Menus

Action menus

Action menus contain actions that are used less often than actions in the action bar and are not prominent or frequent enough to place inline on the screen. People care about content, so you should minimize the number of options that you display on the screen.

Users open an action menu by tapping the action menu button Action menu button. on the right side of the action bar.

Device showing an action menu.
Device showing the order of items in an action menu.

Best practices

Include only the actions that apply to the screen. Don't repeat actions on all screens in your app. Place actions that apply to the whole app in the application menu.

Consider including shortcuts to common actions on BlackBerry smartphones with a physical keyboard. When an action menu is open, let users use a shortcut key for common actions.

Place application-defined actions at the top of the menu (for example, Add as friend, or Play).

Place contextual actions that are defined by the platform in the middle of the menu. Items like Call, BBM, Share, and Open in are provided by the invocation framework.

Place Select More and Delete at the bottom of the menu, if applicable.

Context menus

Context menus give users a quick way to use the most common actions for an item in your app. Context menus are similar to right-click context menus in desktop applications, but are designed for touch screen interfaces. If you use a context menu in your app, users don't have to open the item to act on it.

Use when

You want to add an action for an item that is visible on the screen.

You have an existing BlackBerry app that uses shortcut keys or pop-up menus. Include the shortcut actions and pop-up actions in context menus. Context menus replace pop-up or graphical context menus.

Don't use when

Most users probably need the action often. Place the action inline on the screen instead.

Example

If a user touches and holds on a photo, actions such as Share, Edit, Move to folder, and Delete could appear in the context menu.

Device showing a context menu with only the icons visible.
Device showing a context menu with the icons and labels visible.

Best practices

Include only the most common actions for the item. Don't clutter the menu with irrelevant functionality. Include actions for items that users can act on, such as contacts, links, telephone numbers, images, and list items.

Don't include the most intuitive action. Instead, perform the most intuitive action when users tap an item. For example, if users can tap an item to open it, then don't include Open in the context menu.

Let users stay in the current context. Keep users in the app to complete a task. You can integrate your app with other applications to avoid a dead end.

Include an icon and label for each item. Make sure that the icons are meaningful to users and that the labels are concise. It is important that icons reflect the actions because only the icons appear when a user touches and holds an item. The user needs to drag their finger to the left to see the labels.

Consider including shortcuts to common actions on BlackBerry smartphones with a physical keyboard. When an action menu is open, allow users to perform a common action by pressing a shortcut key.

Application menus

Application menus hold important actions that are common for the application and aren't context-specific (for example, Settings, Log Out, or Help).

Users open an application menu by swiping down from the top of the screen. Users dismiss the menu by swiping up toward the top of the screen or by tapping outside the menu.

Best practices

Include as few actions as possible. The menu holds only five actions. Don't include frequent actions, navigation links, view-specific actions (for example, Edit or Sort), or actions that are already on the screen.

If your app contains settings or help, place the Settings icon on the far right side of the menu and the Help icon on the far left.

Use the same icon size and font size as items in an action bar. Make the height of the application menu slightly larger than the height of an action bar. Use the same depth treatment (drop shadow) as you would for an action menu.

Device showing a sample application menu.

Make sure the application menu pushes the UI on the screen down. The menu should not overlay the UI.

For actions that open a new view (such as Settings and Help), slide the menu up and slide the new view in from the right. For actions that open a dialog box or toast, slide the menu up and then display the dialog box or toast.

comments powered by Disqus