Would you like to tell us how we are doing?

You bet No thanks

Types and sizes

BlackBerry smartphones use different sizes for in-app icons and indicators.

Keep the main graphical elements within the inner area of the icon or indicator to allow for a UI buffer zone. The focal area refers to the size of the symbol within the icon itself.

Action bar and menu icons

Large icons

8 x 8 du (focal area 5.5 x 5.5 du)

Large icons are the most common. Apps use them most often in these UI contexts:

Action bar with tab icons

Device showing an action bar.

Action menu icons

Device showing an action menu.

Tab menu icons

Device showing a tab menu.

Content area icons

Device showing icons associated with list items.

Application menu icons

Device showing an application menu.

Context menu icons

Device showing a context menu with only the icons visible.

Components and small buttons

Medium icons

Use the medium icon size for components.

7 x 7 du (focal area 4.5 x 4.5 du).

Small icons

Use the small icon size for small buttons.

6 x 6 du (focal area 4.5 x 4.5 du)

Device showing components, including small buttons.

Indicators

Indicators are small icons used in the content area to show extra information (for example, status). If you create an indicator, follow the design guidelines for icons listed above. Reduce the amount of detail, and reduce the number of pixels by one for the largest lines. Follow the size and alignment guidelines below:

Large indicators

5 x 4 du

Small indicators

3 x 3 du

Device showing examples of indicators associated with list items.

Alignment

Diagram showing acceptable indicator alignment.

Recommended: Make indicators smaller than the adjacent text. Bottom-align indicators to the baseline.

Diagram showing unacceptable indicator alignment.

Not recommended: The first indicator is not bottom-aligned. The second indicator is larger than the text.



Got questions about leaving a comment? Get answers from our Disqus FAQ.

comments powered by Disqus