Archive for April, 2007

Anatomy of sharing

Apr 07
30

There are only so many ways that something can be shared. This is based on four things:

  1. Direction – what direction the files go when it’s shared
  2. Storage – where the file is stored once it’s shared
  3. Relationship – determines if you can send or receive
  4. Access – determines who can participate in sharing
  5. Notification – how you find out something has been shared

Share Direction:

  • Push: File is sent onto your computer, like it or not (email)
  • Pull: File is downloaded (from a server)
  • Permission: File doesn’t move but permissions are set so that it can as needed

Share Notification:

  • Synchronous: When something is shared you are notified
  • Asynchronous: Notified at some interval hour/daily/weekly of sharing activity
  • None/Discovery: User is not notified but the user can discover that something has been shared

Share Relationship

  • Incoming : Allow files to be received
  • Outgoing : Allow files to go out
  • Bi-directional : Sent and received

Storage

  • Self : File is stored with the share originator
  • Recipient : The person receiving the file will store the file
  • Transitive : File is stored with the originator and recipients
  • Server : File is stored on a central server

Access

  • Open : Anyone can add files and get files
  • Open-Get : Anyone can get the file
  • Open-Put : Anyone can share a file
  • Secure (Get/Put) : Only specified people can get or share
  Direction Storage Relationship Access Notification
FTP Push/Pull Server Bi-directional Secure None
Email
Push Recipient Bi-directional Open-Put
Secure-Get
Asynchronous
YouTube
Pull Server Bi-directional Open Discovery
Website
Pull Server Incoming Open Discovery
Torrent
Pull Transitive Bi-directional Open None
Network Sharing
Permission Self Outgoing Secure None
Postal Mail
Push Recipient Bi-directional Open Synchronous

Am I missing any key scenarios for how sharing services can differentiate themselves technically?

Fitts law of mental clicking

Apr 07
27

Fitts law is a basic UI principal that predicts how easy it is to click on something. Larger things that are close to the mouse are easier to click and smaller things that are far away are harder to click. This principal guides a lot of UI design and helps ensure the proper placement of buttons, controls scrollbars and other elements.

It’s perhaps not fair to call it a ‘law’ since many applications and operating systems break the law in many places. One of the artifacts of this rule is that the edges of the screen end up being much easier to click.  In Windows XP & Vista the start button is clickable from the far-most corner even though the pixels in that corner are visually not inside the button area. (However the clock is not clickable, oops)

Fitts law predicts how easy something is to click but it doesn’t predict what you’re actually more likely to click. For example given two buttons that have the same meaning you are more likely to click the larger one.

Let’s take an actual example:

Example of vista taskbar button

Here I’m showing the mouse as it hovers along the taskbar. The user is moving their mouse along the bottom looking for a particular application. Once they see that application there is a strong instinct to want to click on the actual object that they see because it’s larger. This is what I call “Fitts Mental Law” the user will want to click the larger button. From the users perspective the image is the application so this maps to what they want.

Unfortunately on Vista this doesn’t work. As soon as you move your mouse toward the large image it disapears.  Add another little frustration to my growing list.

Designing for column width

Apr 07
25
A newspaper column width is typically just under two inches. A paper back book is usually under 4 inches wide per page. The size of a typical computer display is climbing over 17 inches and this is isn’t necessarily a good thing.

Newspapers and books are designed to reduce eye strain and make it easy to read for longer periods of time. They do this by allowing several muscle groups in the eye to relax. In a newspaper your eye will track vertically down a column without needing to jog back and forth. The column width should be narrow enough to scan down. As your eye reaches the end of a line it moves straight down without slowing down. Because the lines are short you can ‘skim’ an article quickly without moving your eye left to right.

A computer article on the other hand isn’t as simple. The eye has to track horizontally across the width of the page. The movement isn’t smooth because when you reach the end of a line you have to change direction and scan back to find were the next line begins. Reading large amounts of content is much more difficult this way and can cause blurry eyes and general eye strain.

There are four core technologies that are needed to properly design for column widths. The first is the ability to layout and balance columns, the second is hyphenation. Recently the New York Times released an application that does both. This application fills a gap that CSS and the web haven’t been able to fill (yet).

Balancing columns means that you take two or more columns and you balance the number of lines in each column so that the combined columns form a box. This is a useful design tool because it allows you to have an easy to read block of text that’s sized to the available screen space.

When you start using columns you realize that there’s a problem. Long words will tend to end-up on a line by themselves. This looks silly and makes the document harder to read. The solution is hyphenation. When a long word is close to the edge of a column a hyphenation dictionary can determine where the word can be broken. A typical dictionary shows these possible hyphenation points as dots in the definition: hy·phen·ate. The hyphen gives the columns a better appearance and again helps your eye track to the next line.

The last missing piece are page jumps. What happens if you have too much text in a column? On the web the solution is to scroll. In a newspaper it’s a jump. A jump is a link to the place were the text continues. This allows you to put the important content up-front and keep the article details deeper in the site without needing to scroll.

Columns, hyphenation, balanced columns and jumps are all great design tools and they can be used in designs to make text easier to read.

Now if we could only get these features into the browsers ;)

Things to Love & Hate about Vista

Apr 07
18

Love

  • New start menu – In general the new start menu is easier to navigate. By typing a few letters you can quickly find an application. Alternativly you can navigate the menu structure without filling the screen with cascading menus.
  • Better system searching. Finally. – You get relatively fast results without too much pain. It has room for improvement but it’s 100x better then XP searching.
  • File-system meta-data tagging – You no longer have to create sub-folders for everything. Just save all your stuff into one core location and use tags and meta-data to find it. This in conjunction with searching moves away from hierarchical storage. This makes it much easier to manage 100,000′s of files without having overly nested folders.
  • Better photo browser – Along with the generic file-system meta data there are photo specific attributes and a photo browser that makes it easier to look at large collections of pictures.
  • Other things I loved? Nothing really.
    • Tablet and Media Center are great if you’re using Vista as either a tablet or a media center. Having these features built in didn’t really change anything.
    • Aero is nice. It looks better then the XP theme but doesn’t dramatically impact how you use the computer. Flip-3D is also nice but slower then the traditional Alt+Tab. Whenever I see Flip3D it reminds me of the “Window->Cascade” menu in Windows 3.1. The more things change the more they stay the same.

Hate

  • Security dialogs, warnings and confirmations. I generally don’t turn security features off but it’s so awful I just had to disable it in order to actually use my computer. Security shouldn’t impact the user experience unless the user is actually doing something that could harm the computer. These security dialogs are now all over the place.
  • Stuff that used to work in XP may no-longer works (my scanner from HP doesn’t work, my web-cam from Logitech doesn’t work, certain software applications such as Quickbooks’05 are not supported, my standard dell sound card driver didn’t work without a lot of tweaking. etc, etc.)
  • Stuff that changed but didn’t improve. There are many example of dialogs and interface screens that got re-vamped and didn’t add significant improvements. In fact many of these seem to have lost some features or gotten unnecessarily complex.
    • Windows explorer used to have a film-strip view when viewing photos – gone
    • You used to be able to select the photos you wanted to print from the photo printing wizard – gone
    • You used to be able to change the date/time from one dialog, now it’s four separate screens .
    • You used to be able to adjust your screen/display/theme from one dialog, now it’s five separate screen.
    • Remote desktop forgets my multi-monitor resolution when I re-connect to the desktop.
  • There are now 50 different control panels. That’s 50 different places that you could screw up a setting. (Win2000 and XP had about 23)
  • Sidebar. – Anything that takes up permanent screen space should help users work with their computer. The sidebar is a classic example of a distractor. Google desktop and Yahoo both have their own versions of this same ‘tool.’
  • Business/Home/Ultimate differentiation. – Business should be a super-set of home so if you wanted home plus some other stuff you would get business. Now certain features aren’t in business but they are in home. You can’t have Windows business and still play games during lunch like solitaire.


Should I upgrade?

Probably not. Unless you like living on the edge or are developing Vista sotware there really isn’t a compelling reason to migrate. Tools like Google and Yahoo desktop fill the gap for desktop search and ‘sidebar widgets’ (if you like that sort of thing) Picassa is a good photo stop-gap for XP machines. The time saved by other improvements across the system are outweighed by the time lost due to security dialogs, re-learning and incompatibilities.

If you are really itching to improve productivity I would instead recommend the upgrade to Office 2007.

Analog vs. Digital Dials

Apr 07
7

Over the years many devices have have replaced analog dials with digital displays. Stoves, microwaves, refrigerators, cars, clocks and more. Some people forget that there are advantages to analog dials.

Here are some of them:

  • Analog dials always show a range and you can see where you are within that range. A digital display typically only shows the current value.
  • Analog dials are available even when an item is turned off.
  • Analog dials move linearly through values. You can’t skip over a value as you can in a digital display. You can also visually see how fast the value is changing.
  • Analog displays can easily have color a range of values (red/green) to show you when you are approaching or leaving a desirable range.
  • Analog displays typically give you a rough approximation of a value. This is useful for things that need approximations not exact figures.

Many of these charecteristics can be simulated with a digital display but often times they are not because people no-longer see value in it. Is your data ambiguous? Are you giving people a false sense of precision with a digial display?

  • Analog dials allow you to know the value of the dial just by quickly seeing the angle (clocks, speedometers)