Please note that as of October 24, 2014, the Nokia Developer Wiki will no longer be accepting user contributions, including new entries, edits and comments, as we begin transitioning to our new home, in the Windows Phone Development Wiki. We plan to move over the majority of the existing entries. Thanks for all your past and future contributions.
Mobile Design Pattern: Contextual Prompt
This design pattern is part of the Mobile Design Patterns series.
A modal view containing a group of options, actions or information directly related (and contextual to) the focussed or active mode, object or view.
- Can be used to present a wide variety of actionable contextual options.
- Can suffer from poor discoverability.
- To provide task-related options ‘just-in-time’.
- To group options and reveal them to the user as close to the interaction as possible.
Several types of contextual menus are popular on mobile:
These menus are most often triggered by pressing the left softkey and can include (a recommended maximum of) two levels of options. These menus do suffer from a certain lack of visibility however they are now so common that this is becoming less of a problem.
Note: Carefully consider the context of use. If the user interface enables multiple selections (typically via Mark/Unmark commands) the contextual options must be adjusted to only display actions which can be executed on all marked items and/or feedback should be provided to explain to the user why certain actions will not be executed.
These menus are triggered through selection of an on-screen icon or prompt. Depending upon the placement of the prompt, these menus can suffer from low discoverability and impede other interactions.
Direct manipulation: Contextual menus are often invoked by tapping an icon or—in the case of S60 5th Edition, executing a long tap on a list item.
Figure: A simple short tap opens the detail view of the item while a long tap invokes a contextual menu.
See the Touch Utilities API within the Forum Nokia S60 5th Edition C++ Developers Library for more information regarding long-tap events.
Indirect manipulation: In this context, contextual pop-up implementation is more problematic as direct selection of a list item already has an expected behaviour.
Figure: The ‘arrow’ icon indicates that clicking Right will open a contextual menu. This cue is required as the typical behaviour is to click the Center softkey to ‘Open’ the focussed item. Without this additional cue, the menu might never be discovered.
c. Temporary contextual pop-ups
These pop-ups are temporary. They immediately appear once an item is focussed and automatically disappear once focus is removed. For this reason they cannot have focus themselves and therefore only contain contextual information.
Figure: A. This mapping example opens a contextual pop-up as the user hovers over an icon (via the mapping application’s custom ‘crosshairs’). In examples B and C, the pop-up is triggered as soon as the item is focussed.
Certain devices include a bespoke key or physical control, which is exclusively designed to trigger a contextual pop-up menu.
- Once open, contextual menus should (ideally) have primary focus. It should not be possible to interact with the visible elements ‘behind’ the menu—even on a direct manipulation device.