Design Guidelines for Touch Screen Interfaces

Touch screens are no longer a novelty interface in the field of human computer interaction. They have infiltrated consumer products as well as enterprise ones; they are used not only in mobile devices, but also the most stationary of devices. Due to direct manipulation, touch screens are independent of most of the tools we thought we could never part with: keyboard, mouse, stylus, etc.

However, this sacrifice does come with tradeoffs. Traditional keyboards provide tactile feedback and allow people to type at speeds much greater than touch screen keyboards. Mice move pointers at accelerated rates that mimic our own visual saccades; whereas with a touch screen interface, we are limited by having to traverse full physical distance with our hand.

These limitations are actually the result of, or rather the evidence of, the infancy of the touch screen interface. Once this specialized interface is optimized for our own cognitive and physical abilities and limitations, the touch screen interface may flourish. In this article, I attempt to provide guidelines taking into account some of the factors I have already mentioned.

1. The Finger

Points of interaction must be large enough to be pushed by a finger. This is best done by a graphic-rich icon. There should be enough clearance on all sides to prevent accidental touches but at the same time the hot spot should be well placed. Precision should not be taken for granted, such as with mouse, point-and-click activities.

2. Text

Text should be used as a label and rarely, if ever, used as a hyperlink. Since touch screens are used up close, even closer than computer screens, text does not need to be significantly enlarged or magnified.

3. Information

These interfaces should solely be used for quick retrieval of bite-sized information easily accessible through efficient navigation. Devices that employ touch screens leave the user most often in an uncomfortable state (standing in front of a kiosk with neck bent, holding a mobile device in one hand while interacting with the device with the other hand). Due to these awkward positions, one should assume and design interfaces that do not afford reading long passages.

4. Navigation

Navigation and action buttons should be laid out in consistent areas of the screen. At the top level screens, designs can and should be more flexible and creative in style, placement, and size. In deeper level screens, navigation should be laid out on the top or side portions first with action buttons better suited to the left or center portions (depending on availability of screen space).