Stories

back Stories Overview

User Experience at SAP

Projects

ASUG

Conference Reports

Future Scope

 

Gesture Navigation in Contextual Menus

By Dennis Middeke & Thomas Hirt – March 26, 2009 • The definitive version was published in Interfaces 78, see the copyright note below

In this article Dennis Middeke presents a novel mobile phone interface developed as part of his studies at the University of Applied Sciences in Düsseldorf. This is work from the final project part of the course, which focuses on concept design. Here students investigate opportunities for innovation in mobile interaction design as well as the potential for developing applications that are relevant to the device and context of use.

Like all students on the course, Dennis’ project was a collaboration with an industry partner and mirrored a commercial design process, including everything from market analysis right thorough to final design concepts.

The project partner in this case was LG Mobile and was supported by Markus Lüdemann (Head of User Experience) who acted as sounding board and mentor for the students. The aim of the project was to develop innovative interaction designs in the context of the mobile phone industry’s attempt to counter the challenge of the iPhone. In order to achieve this Dennis investigated current industry trends as a starting point for exploring new design concepts.

 

Mobile Phone Trends

Interface design has been relatively static for a number of years with few innovations in interface design for either fixed or mobile devices. To some extent phones had reached a plateau in which the commercial advantages of standardisation seemed to halt serious attempts to do anything new. There are a few exceptions such as Nokia’s game-centric phones, but generally mobile phone interaction design had settled into one or two archetypes such as the twelve key clam and the QWERTY smart phone, and the only design opportunity was incremental and slight improvements and tweaking.

The iPhone certainly disrupted this relatively comfortable stasis. The release of Apple’s iPhone finally established touch-screens as a desirable and usable interaction method. Of course touch-screens are nothing new in themselves, but Apple succeeded where PDAs and Smartphone manufacturers in the past had failed. Commercially available touch-screens in the past were not very usable partly because of the imprecise nature of touch displays and mainly because no one had put resources into developing a touch-oriented operating system. In contrast to the clunky touch interfaces of the past, the iPhone is fun; menus scroll smoothly and even bounce, content can be explored playfully by paging through album covers instead of simple lists, for example.

While the iPhone is good, touch-screen interaction has some drawbacks, especially when used on mobile phones. With the lack of haptic feedback, the handling is more complicated in comparison to conventional input methods with buttons and keys. Text entry is also negatively impacted by touch-screens and it is almost impossible to write a message while walking. Most people need both hands for typing; one holding the phone and the other one inputting the text!

The increasing number of functions available on current mobile phones also affects usability in a detrimental way. The latest generation of Smartphones provide functions comparable to desktop PCs, including word processing and web browsing. Despite the functional power of such phones, surveys show that a significant number of users just stick to the basic functions of their mobile devices rather than discover and use the more advanced (and potentially useful) ones. This means that adding new features complicates currently used functions and is a barrier to adopting new ones.

To summarise, touch-screen interfaces have disrupted the mobile phone world but have yet to fully achieve their potential in satisfying all use cases. As well as the potential for optimising touch-screens there is also a design opportunity to enhance navigation on devices that include a growing number of features.

 

Design Concept

This is the initial point of my design. The goal was to focus on the actual purpose of phones as primarily communication tools. Therefore I questioned the basic structure of common mobile operating systems and explored new approaches to navigation by using and reviewing a number of touch-screen interfaces.

My concept ‘Basic Communication’ is a mobile interface substantially different from its peers even to the level of its information architecture. All data and functions are assigned to contacts in the address book rather than dispersed through the interface. This means that the central element of the interface is something very familiar and in constant use. The contacts can be displayed in different ways: graphically sorted by contact groups, e.g. friends or work, on a map showing their location, and in a common list view for quick access.

Clicking on a contact opens a contextual menu. The menu is divided into quarters each containing one option and its submenus. Each commands can be accessed by a touch in its direction. As soon as the finger reaches the menu item, submenu items appear. This way of navigation provides some advantages over the ordinary point-and-click method as the position of the finger is relative rather than exact. The touch-screen interface, even though having no tangible buttons, can be used without visual cues, to some extent, as only the direction of the finger gesture is relevant, not the absolute position. Once the menu structure has been learned users are able to access commands by a few gestures that are strung together, and do not have to look at the display.

For less experienced users the contextual menu can be navigated like a map. By scrolling to the centre the user enlarges parts of the menu to reveal the submenu items. The menu can be explored in a playful way and the user can skip long navigation paths by accessing a subordinate command directly.

The structure of this mobile interface differs dramatically from existing interfaces. To keep the barriers as low as possible, I removed any cryptic terms or icons from the interface. Instead of that the functions are simply named after the action they provide. GPS and route planning are called ‘locate’ while messages and email are merged into a single ‘write’ option.

In addition I reduced the features to the very basics a mobile device should offer centring on a few core use cases: making a call, writing messages, locating and route planning as well as organising media files and calendar. The principle of gesture navigation can also be transferred to the keyboard for text input. Tapping a letter and dragging the finger up writes capitals. By dragging the finger to the right special characters like umlauts can be entered.

 

Conclusion

Navigating through gestures in contextual menus is a very fast way to reach certain commands. There is no space wasted for toolboxes or other navigation elements, which is an important advantage on small mobile displays. In many cases gesture is not intuitive on first use and this is one of the major challenges that still needs to be solved in future work. While designing the concept for the menu structure the limitations of the contextual menus became clear: it is quite difficult to build up a menu with only four entries per level. On submenu levels there are actually three items remaining because the second direction of a finger gesture has to differ from the previous one, otherwise the system would not recognise it. Menu entries have to be reorganised and merged on the fly and in complex applications it is impractical to replace lists and buttons completely. Despite some of these challenges this concept has many advantages over current touch-interfaces and it is an innovative and speedy way to reach a manageable number of commands.

 

About the Authors

Dennis Middeke

Dennis Middeke has been working for six years in the field of corporate interaction design for companies and agencies in Germany. His focus is on conceptual design and specifically developing websites, mobile applications, exhibitions and signage systems. Currently he studies communication design at the University of Applied Sciences Düsseldorf.

Thomas Hirt Thomas Hirt studied Product Design at Dresden University of Science and Technology. He is head of the Digital Communications department at ERCO GmbH and a lecturer at Düsseldorf University of Applied Sciences, where he was visiting professor from 2003 to 2005.

References

© Interaction (formerly known as The British HCI Group) (2009). The definitive version was published in Interfaces 78.

Web links:

 

To top top