Feature: Designing for Small Screens

This is an extract from "Designing for Small Screens: Mobile Phones, Smart Phones, PDAs, Pocket PCs, Navigation Systems, MP3 Players, Game Consoles", by Carola Zwick, Burkhard Schmitz and Kerstin Kuhl, brought out by Ava Publishing late last year at £17.95. (The image, left, is a typical page spread from the book showing the style of the publication, which is highly graphic. Here, images, boxes and other visually distributed material has been removed from the account, because UN is not!)


The nature of user interaction plays a far more important role in the design of applications for small-screen devices than in the design of applications for desktop computers. This is partly because there are fewer standardised forms of input or, more simply, no clear equivalent to the keyboard and the mouse. In addition, the context for small-screen device use is far less predictable than for a conventional desktop computer. Even the comparatively mobile use of a laptop computer requires the user to be in a static, seated position. For those portable devices that are often more peripheral in their use, the design options for the menu structures and screen layout will depend far more on the user’s likely interaction style.

Physical interaction Interaction with small-screen devices reveals the conflict of interests between creating the smallest physical size that will give the user unrestricted mobility and flexibility, whilst maintaining dimensions that are defined by the size and the motor functions of the human hand. The balance is not always achieved and some devices are already smaller than the minimum size that can be comfortably operated by an adult hand. There are two fundamental types of physical interaction that can be distinguished: one-handed and two-handed interaction. Some devices can only be operated with two hands, for example, the Game Boy, whilst other devices offer different modes that can be selected alternately. Smart phones, for example allow the user to dial numbers with one hand, but interaction for more complex applications such as using the calendar or accessing the internet is done with two hands.

One-handed interaction enables a device to be used at the same time as carrying out other activities. One-handed interaction presents the greatest challenge for the interaction designer because the same hand is used for the interaction and to hold the device. This means that all fingers, except for the thumb, have restricted freedom of movement, and thus less scope for interaction. Yet the thumb has considerably less fine motor control than the index finger.

In one-handed interaction, a tabulator system is almost always adopted: the user employs their thumb to control a mini joystick, which enables them to move from one menu item to the next and then to confirm their choice. The mini joystick is almost always placed centrally on the front of the device. This is not an ergonomically ideal position, but a compromise so that the device can be operated both with the left and the right hand. However, putting the interactive element in this position does in fact restrict the user’s freedom of movement and their ability to navigate the software.

Two-handed interaction often sees one of the hands playing a supporting role so that fine movements, such as data input through use of a stylus or keyboard, are carried out by the other hand. Full two-handed operation, in which keys and control elements are operated simultaneously with both hands, is mainly found in portable game consoles. Most games focus heavily on the player’s fast reactions, so the motor skills of the two hands are used simultaneously. Complex two-handed movement patterns are stored in ‘motor memory’ so can be called upon as a reflex action when needed. When interaction with a device requires the use of both hands, completing any other activity at the same time is almost impossible, even walking.

Interaction techniques and elements Unlike the standard input methods that evolved for interaction with desktop computers, a multitude of different input and interaction elements have developed for the operation of small, mobile devices.

Sony’s ‘jogdial’ is a clickable scroll wheel that can be operated with the thumb. It was one of the first multifunctional elements developed for portable devices. Turning the wheel enables the user to scroll through menu options and pressing the wheel confirms the user’s selection. It is usually sufficient to control just the vertical navigation alone because the size, proportions and resolution of the small screen mean that it can only display a simple list. To allow the same element of control with the ability to jump between different hierarchical levels, a knurled wheel was developed that could also be tilted in two directions. The scroll wheel and the knurled wheel have high tactile and motor qualities because they really move, and use of the wheel means that physical stop points can be linked with menu items.

A mini joystick is operated with the thumb and can be used to control movements in two directions, and to select items. Pushing the mini joystick in one direction simply defines the direction of the movement; the speed of the movement can be altered by varying the movement of the mini joystick. The mini joystick is cheaper and more robust than a scroll wheel, and therefore became an established interaction component even before the screen sizes and software concepts were really able to incorporate the second direction that it offers.

On small screens there is not yet any representation of the user – in the form of a cursor – so the movement of the mini joystick is not translated into a directional vector; interaction is simply interpreted as a movement that is either horizontal or vertical. Here too, the display jumps from one tabulator to another. The exceptions to this are isolated applications such as navigation systems, in which an extract from a map can be moved obliquely by using the joystick.

Both the scroll wheel and the mini joystick permit one-handed navigation, and sometimes even blind navigation, because the thumb interacts continuously with the same component and does not have to move from one interaction element to another. This means that they are ideal forms of interaction for portable devices because they can be used peripherally. To give the joystick similar tactile and motor qualities to the scroll wheel, techniques such as tactile feedback, e.g. vibration, can be used.

Apple’s rotating click wheel, seen on the first generation iPod, displayed direct feedback of the user’s movement on the screen, and as such had a high physical quality that contributed significantly to the success of the device. This direct feedback has created a mental model of a virtual transmission, in spite of the fact that the directions of movement are not congruent.

The virtual click wheel is technically little more than a circular touchpad that largely imitates the physical movements of an ‘actual’ wheel. The virtual click wheel enables the quality of continuous physical interaction to be maintained, but is far cheaper and less prone to error than its actual counterpart. The common element of both wheels is that the user can develop a special skill in their interaction, which is a positive user experience because it helps to foster self-confidence in working with new technology.

The touchpad, as an indirect and relative control mechanism, has yet to become established for small screens. The touchpad could be a useful addition to some devices, such as the Pocket PC, but its disadvantage, especially compared to a joystick is that the finger must be moved back and forth several times in order to direct the cursor, which makes one-handed operation difficult.

The touchscreen is a very direct and intuitive form of interaction, but on small-screen devices it must be remembered that the finger is a relatively large input instrument. Therefore a stylus is often used for input on small-screen appliances so that the size of interaction elements or icons, and the area of the screen that is obscured during interaction can be reduced. The standard touchscreen does not have any tactile feedback, so the user’s eyes must remain on the screen in order to maintain interaction. In the design of interactive applications for use on a touchscreen, the general rule is that the elements for navigation and interaction should be placed close to the bottom of the screen, so that the screen is unobscured during interaction.

During the interaction process, conventional touchscreens are unable to distinguish whether the user clicks on the screen or just touches it instead. This means that no balloon help or other rollover effects can be used on touchscreen interfaces. However, the latest generation of touchscreens are able to interpret the pressure of the user’s touch, and so can distinguish between rollover and clicking. This progression offers greater scope for the design to include sensitive feedback mechanisms between the actions of the user and the reactions of the device. In addition to clicking and drag-and-drop interactions, the interpretation of other motions on the touchscreen is becoming increasingly important. For example, a fast zigzag movement can be interpreted as deleting, and circling an object can be interpreted as an expression of interest that zooms in on the corresponding detail.

With an anoto pen the input problem is reversed; the user can enter data by writing on specially printed paper. The written text or sketch is then transmitted from the stylus to the device. This type of data entry requires a writing surface and full concentration on the writing process, and it is therefore very suitable for certain situations, such as making notes during the course of a meeting.

Voice input is very suitable for peripheral use. A technical requirement for voice control at present is a controlled acoustic environment, such as inside a car, so that the system can interpret the input reliably. The dialogue for interaction with a computer-assisted system is still not fluent, so voice input is only effective for short commands or data entries, like e.g. names or addresses. The structural advantage of voice input is that this form of navigation cuts across the hierarchical levels of the overall structure – each menu item can be called up immediately, irrespective of its level within the navigation scheme.

Offering menu choices via voice output is an arduous form of interaction and should always be avoided where possible because of the linear character of language. A verbal list of several menu functions is far less effective than a simultaneous visual representation. Yes or no decisions are the only type of interaction dialogue that can be handled at a reasonable speed. Voice output however, is an appropriate technique for delivering content such as e-mails or text messages, because it allows the user to simultaneously carry out other activities, such as driving a car or walking.

Physical keys that are used as interactive elements are especially important for older users because they represent a familiar and reliable way to control a device. Matters can become more complex if these keys have multiple assignments. Soft keys – those keys which are dynamically assigned different functions – should be positioned close to the screen, and the current and active function of the key should always be displayed on the screen. For the successful incorporation of soft keys, the design process of the end device and its interface must be so closely linked that this relationship can be seen at a glance.

The telephone keypad with assigned alphabetical letters is a special case of multiple assignment. Using a 12-key block to write long text messages is an arduous task. The automatic word recognition (or predictive text) feature T9 is only helpful in part because it only offers a standard and limited vocabulary. The success of text- based communication between mobile phones is probably due more to the discretion that this form of communication allows, rather than the convenience of its use. In this form of multiple assignment of keys, it is very helpful to have an on-screen display of all of the characters that are represented by any given key when that key is pressed.

Associated Link: The AVA Publishing site - search on 'Small Screens' for a useful table of contents

Online poker company uses Science to assess Player Preferences
Source: Recentpoker.com, 8 January 2009
 
Working with customer experience consultancy Foviance, PKR is exploiting the benefits of electroencephalography (EEG) technology to gather information on poker players' emotional relationship with a brand or service.

Do Users really love Laptops?
Source: channelinsider, 7 January 2009
 
More than one-fifth of all laptop computers will break down over the course of their life, and other limitations frustrate their users. From this list of user complaints come laptop opportunities.

User Interviews - Analysis Simplified
Source: Webcredible, 6 January 2009
 
You’ve conducted your user interviews, but now you need to make sense of all that information you’ve gathered.

Why Products Fail
Source: ComputerWorld, 5 January 2009
 
Most gadget and software makers don't understand what users want most: control.

How to Design Websites for Mobile Phones
Source: stemkoski.com, 3 January 2009
 
Tips from Ryan Stemkoski's web design blog.

Pioneer of Cyberspace honoured
Source: BBC, 2 January 2009
 
A professor who invented a forerunner of the world wide web has been made a dame in the New Year Honours.

2008 in Review: Developments that rocked the world of User Experience
Source: Catalyst Resources, 1 January 2009
 
A look back at 2008 highlights some of the key developments that rocked the world of user experience.

2008: The Year Online
Source: MIT Technology Review, 31 December 2008
 
The business of social networking, cloud computing, and a flaw in the fabric of the Internet top the most notable stories of 2008.

Shoveling through the Spamalanche
Source: UN, 30 December 2008
 
A ‘Spamalanche’ of 3,000 emails will be waiting in your inbox by the time you get back to work. What can you do besides 'delete all'?

New guidelines boost Web Access
Source: BBC, 29 December 2008
 
The World Wide Web Consortium (W3C) has announced a new standard to make sites more accessible to older and disabled people.