Incredible analysis of a display

The XBox 360 dashboard is the user interface to the XBox operating system. When the game console is booted up, the user is presented with a display that looks like:

The user can navigate to different sections of the display using the XBox 360 controller to switch “Blades” - between, Games, Media, and other functions. It’s a fairly usable design, though it is difficult to make sense of initially (at least, based on my experience).

Over at the blog The Fanboys, there is a fantastic analysis of the 360 dashboard display. The dashboard is broken down into pixels and classified as being used for the user’s content, interactive items (buttons, menus, etc.), ad space, or blank space. The results are startling but also inform a smart redesign that minimizes dead space but does not lead to increased clutter. It’s a really impressive redesign.

The Fanboys: Dreaming of Dashboard 2.0

As someone who is starting to propose a display redesign for a submarine tactical system, this kind of analysis could be incredibly useful to implement. At the very least, it gets the mind thinking in a visual, yet quantitative, manner. Oftentimes, it is easy to be descriptive about changes that need to be done. But when you get sensible and realistic numbers, the case becomes far more convincing.

Animations and the iPhone

Animation in computer interface has been used for as long as the technology has been able to support it. The infamous “Clippy” in Microsoft 1997-2003 is an example of that. However, Clippy was almost universally despised because the animations tended to slow down completing a task. Even worse, when the user is idle (possibly thinking about something), the on-screen character would do a little dance, providing a distraction. No wonder why Clippy was even hated by Microsoft.

Animations can be useful, though, in the right context. On the iPhone/iPod Touch user interface, there are several examples of animations providing information about the state of the interface. This video below (created by me, which explains the awful production values), shows two instances of this. One is zooming and scrolling during navigation in Maps, and the other is scrolling in Safari, the web browser.

These animations naturally fit in the interface; they are not superfluous like Clippy. The zooming and scrolling in maps provides information about location and space. As users progress through the fake turn-by-turn directions, Maps could simply display the next turn. Instead, Maps zooms out from the old location and zooms in to the new location. This provides the user with a sense of where they are in the global sense, but also where they’ve come from in the relative sense (“We’ve driven very far southeast.”) This is useful in giving users a sense of situational awareness about the state of their trip.

The Safari animation is much more subtle – you scroll a page by tapping on the screen with your finger and dragging. When you reach the top or bottom of a page, trying to scroll more gives the user the sense of dragging the whole window, which visually implies to the user that there is no more to see. This is incredibly smart for this interface. In a regular computer interface, scroll bars are used to give the user a sense of position in the document. Scroll bars would not fit well in the iPod Touch interface, however, because many users would feel they had to use this bar to scroll, and the finger is not precise enough to grab a narrow area like that. Instead, the iPod Touch uses the entire screen as an effective scroll bar.

The downside to this is that there is no indication of document position, which is especially crucial at the top or bottom of the document. If the user is at the bottom but thinks there is more to see, the user may try to scroll. If the animation was not present and the interface did nothing, it would look like the scroll command performed by the finger did not register. This would prompt repeated actions by the user, all met by silence from the interface. Instead, this natural “rubbery” action by the interface signals that there is no more document to see. It’s natural, informative, and unobtrusive, which makes for an excellent use of animation.

iPod Touch User Interface: Touch controls

I know I’m extremely late to the party, but I just got myself an iPod Touch. It is quite impressive, and one of the major aspects of the user interface that I love so much is how intuitive the touch-based action gestures are. Being intuitive is hard to define, but I like to think that if something is intuitive it appeals to common sense.

The touch controls are something that have been highly touted and are well-known at this point. In order to zoom in on a location in Maps, a photo, or a web page in Safari, you put two fingers around the location you want to zoom in on, then you bring them closer together. This is known as the “Pinch.” Conversely, to zoom out, you spread your fingers apart (the “Anti-Pinch”?). Finally, to move around the map, you simply press your finger against the screen and move it in the direction you want the map to go.

This is an example from the Mobile Safari web browsing application:

These actions seem so intuitive that they elicit a reaction of “Well, obviously!” from many people. However, this is not one of those times when common sense would seem to point to these gestures. This seems to be more a function of hindsight bias (hindsight is 20/20) than anything else.

For example, the simple “pulling” action to scroll around in the Maps application is the most intuitive, gestures. This is so intuitive, in fact, that I find myself trying that with other map programs. Google implemented this first with their web-based Map application (so this was not an Apple invention). However, other companies have simply not caught on - MapQuest, for example, does not implement this feature. My GPS (a TomTom Go 720) has not, either. When I want to make sure the route it is giving me is correct, I want to be able to grab the map and scroll to get a better sense of where the route is taking me. Instead, the GPS thinks I tapped the screen, which brings up a different part of the interface. I am left unsatisfied.

The zoom controls are another aspect of the interface that are intuitive. I don’t find myself trying to pinch and anti-pinch on other interfaces. Instead, I am satisfied with a zoom bar (pictured below) or using a scroll wheel to zoom in and out.

The biggest reason for this is that zooming on the iPhone/iPod Touch requires two fingers, and there is no way to emulate that using the input devices available to modern computers. However, the iPod Touch pulls it off quite nicely, and it is continually impressive to show off. The master, Steve Jobs, certainly impressed the crowd when he introduced the iPhone:

---

What this all boils down to is ease of use, which can be split into two parts. One is ease of learning, which is what intuitiveness is all about. A shallow learning curve for these gestures means they are grasped easily. This then improves information retention, the second part of ease of use. Users remember what action to perform to reach a desired state, and they perform the action admirably.

Compare this with a new computer user learning Copy and Paste. Click + Drag over text, choose one of 50 different commands that let you copy (right-click, the Copy button in the toolbar, the Edit menu, a keyboard shortcut…) and then repeat for paste. The learning curve is somewhat steep, and the retention of information is not all that great.

The iPhone/iPod Touch, however, gets it right.

Alleviating Office feature bloat with text-based search

A common complaint about Microsoft Office is how many features and commands it has. The new “ribbon interface” introduced in Microsoft Office 2007 was designed to help users find their desired command more easily. A prototype feature that was recently shown off let the user type in their intention. It almost works like the good-old command line of DOS or Unix, but with much more flexibility.

This is a keyboard analog of the “virtual intelligence” that would be an ideal interface. Instead of pointing and clicking, many users would like to talk to their computers in a (more or less) natural language and have the computer understand. The command lines of DOS or UNIX are rigid in their syntax, which did not correspond to natural language at all. Being able to type “Insert a picture” in Microsoft Word is much more natural. For that matter, there are many search engines striving to accurately reply to a request like “Give me census data for Illinois in 1997.”

While this will likely help users navigate the confusing Office interface, this screenshot shows just how many features there are. Type “insert” and get 205 command options? Page 1 of 23? This would take an incredibly long time to sort through this many options to find the desired one, which is not the best solution. Nonetheless, Search Commands is a decent first step, though.

Application Usability Webcomic

An amusing comic about usability at industry-leading companies like Google and Microsoft versus what most in-house company programmers put out for software (originally from http://stuffthathappens.com/blog/2008/03/05/simplicity/):