Usability Skool: 30 simple rules for designing software (part2)

October 10th, 2007 by Mitch Brisebois

Smashing Magazine published a smashing list of 30 usability principles and terminology. These should be known by anybody designing, developing, and marketing web applications. Here are #11-20 with some SM updates for web 3.0 realities… Part 1 is here.

11. The Cliffhanger / Zeigarnik effect (circa 1927)
Like the famous lyric in The Rocky Horror Picture Show, “antici………………………pation!”, people have an innert motivation to find out what happens next in incomplete scenarios. This emotional kidnapping (of sorts) locks the user in, knowing they won’t go anywhere until the final reveal. Certainly this effect can backfire if your cliffhanger is annoying or opportunistic. Simply by keeping existing customers well-informed of upcoming developments will go a long way in building loyalty.

12. Assorted bag of Gestalt principles
These are timeless principles of cognitive psychology that really formed the foundation of good GUI design. One paragraph can’t do this justice… but here goes. Users will perceive a group when objects are placed in proximity. Similar objects should be grouped together (this affected the design of the original radio buttons). Foreground objects will be perceived as more prominent than background placement. Users will perceive symmetrical placement as equal, even if the designer did not intend it.

13. Self-reference
As Smashing describes it, it’s about writing in a style that connects to the actual experiences of the reader. For design, it’s about defining appropriate mental models. Graphical interfaces are really just an illusion – providing a real world layer for controlling bytes. Make sure you use your mental model consistently, or you’ll confuse users. Classic example: Apple OS – dragging disk to trash to eject it. Bad idea! Bad Steve!

14. Eye-Tracking
During the 90s countless university computer/usability labs were doing eye tracking experiments. Similar experiments were done previously for print media – looking at how people scan pages of information, and determining where the blind spots are. With today’s cluttered and scattered UIs (from social nets to blogs to SaaS…) who knows what the eyeballs are looking at. The evolution continues as the SEO army tries to figure out the best place to stick their ads! Gag. I’ve changed my mind… here’s $50 for the ad-free version!

15. Beyond the Fold
This refers to stuff that is vertically off the viewable area. If you’re placing ads, then the fold is significant. If you’re designing software, it may not be. For software that may require multiple sections or steps, it’s important to keep the related taskflows on the same page instead of popping up a bunch of different windows. So scrolling isn’t an issue. The biggest sin is horizontal scrolling of windows.

16. Foveal Viewpoint
Didn’t you always want to use “foveal” in a sentence? This refers to your main focal point -the center. Design best practices will always tell you to present a clear center where the user actually interacts with your product. Many opportunities exist for designing better “informing” features that use the periphery of vision. Users can easily sense motion in their periphery while not distracting from their main task.

17. Granny Larity
huh… no.. granularity. Provide the appropriate level of detail for a given task. Designers often provide “too much information”. Layer the information on a need-to-know basis.

18. Hotspots
Cancun? Las Vegas? East LA? This refers to the unspoken rules of the web, where designers expect users to use their amazing ESP capabilities to find the clickable areas. In an AJAX world there’s no excuse for hidden links (unless you’re designing easter eggs). In fact, multi-state hotspots will become common place with rollover, more info (example: snapshot) and click-through.

19. Minesweeping
Essentially the same as hot spots… use your cursor to discover the clickable areas… This is a web 1.0 relic!

20. Mystery Meat Navigation
Also relates to 18 & 20 but more meaty! Usabilist, Vincent Flanders coined this term to describe the obscure web designs that inhibit link discovery. He is famous for his website, Web Pages That Suck. One of his favourites this year is UsabilityNet.gov – ironically a usability resources site (btw this site IS a good resource – but they haven’t altered the site in years!)

[tags]Smashing-Magazine, Usability-Skool[/tags]