Blackberry Smart Phones US

Embed Size (px)

Citation preview

  • 8/9/2019 Blackberry Smart Phones US

    1/89

    BlackBerry Smartphones

    UI Guidelines Version: 2. 4

  • 8/9/2019 Blackberry Smart Phones US

    2/89

    SWDT1011811-1011811-0427092418-001

  • 8/9/2019 Blackberry Smart Phones US

    3/89

    Contents 1 Design principles for BlackBerry devices................................................................................................................................ 5

    Best practice: Designing applications for BlackBerry devices................................................................................................... 6Creating a UI that is consistent with standard BlackBerry UIs................................................................................................. 6Display specifications for BlackBerry devices.............................................................................................................................. 7

    2 Considerations for BlackBerry devices with a touch screen................................................................................................. 8

    3 Interaction.................................................................................................................................................................................... 9Interaction methods on BlackBerry devices................................................................................................................................ 9 Touch screen....................................................................................................................................................................................

    Best practice: Designing applications for touch screen devices...................................................................................... 11 Trackball or trackpad...................................................................................................................................................................... 11

    Best practice: Designing applications for trackball or trackpad devices......................................................................... 11

    Trackwheel....................................................................................................................................................................................... 1Keyboard.......................................................................................................................................................................................... 1Best practice: Designing applications for different types of keyboard............................................................................ 12Full keyboard........................................................................................................................................................................... 1Reduced keyboard.................................................................................................................................................................. 14Key functionality..................................................................................................................................................................... 16 Typing indicators.................................................................................................................................................................... 17

    Shortcut keys........................................................................................................................................................................... 18Cursors............................................................................................................................................................................................. 1

    Best practice: Implementing cursors................................................................................................................................... 22Highlighting items.......................................................................................................................................................................... 22

    Best practice: Highlighting items......................................................................................................................................... 24

    4 Screens.......................................................................................................................................................................................... 25

    Application screens......................................................................................................................................................................... 25Best practice: Designing application screens..................................................................................................................... 28Common actions on application screens............................................................................................................................. 29

    Banner.............................................................................................................................................................................................. 29Best practice: Implementing banners.................................................................................................................................. 30Dimensions for banners on BlackBerry devices.................................................................................................................. 31

    Dialog boxes.................................................................................................................................................................................... 3

  • 8/9/2019 Blackberry Smart Phones US

    4/89

    Best practice: Implementing dialog boxes.......................................................................................................................... 32

    Alert dialog boxes................................................................................................................................................................... 33Information dialog boxes....................................................................................................................................................... 34Input dialog boxes.................................................................................................................................................................. 35Inquiry dialog boxes............................................................................................................................................................... 35Picker dialog boxes................................................................................................................................................................. 36Reminder dialog boxes.......................................................................................................................................................... 37Status dialog boxes................................................................................................................................................................ 38

    Progress indicators......................................................................................................................................................................... 38Best practice: Implementing progress indicators............................................................................................................... 39

    Wizards............................................................................................................................................................................................. 4Best practice: Designing wizards......................................................................................................................................... 40

    5 Controls......................................................................................................................................................................................... 42Buttons............................................................................................................................................................................................. 42

    Best practice: Implementing buttons................................................................................................................................... 42Check boxes..................................................................................................................................................................................... 43

    Best practice: Implementing check boxes........................................................................................................................... 43Drop-down lists............................................................................................................................................................................... 44

    Best practice: Implementing drop-down lists..................................................................................................................... 44Labels................................................................................................................................................................................................ 4

    Best practice: Implementing labels...................................................................................................................................... 45Lists................................................................................................................................................................................................... 4

    Best practice: Implementing lists......................................................................................................................................... 46Option buttons................................................................................................................................................................................ 46

    Best practice: Implementing option buttons....................................................................................................................... 46Search fields.................................................................................................................................................................................... 47

    Best practice: Implementing search fields.......................................................................................................................... 48

    Spin boxes........................................................................................................................................................................................ 48Best practice: Implementing spin boxes.............................................................................................................................. 49 Text fields.........................................................................................................................................................................................

    Best practice: Implementing text fields............................................................................................................................... 51 Tree views.........................................................................................................................................................................................

    Best practice: Implementing tree views.............................................................................................................................. 52

    6 Media............................................................................................................................................................................................. 53

  • 8/9/2019 Blackberry Smart Phones US

    5/89

    Displaying images........................................................................................................................................................................... 53

    Best practice: Displaying images......................................................................................................................................... 54Zooming and panning images....................................................................................................................................................... 55

    Best practice: Zooming, panning, and rotating images..................................................................................................... 55Displaying information on a screen temporarily......................................................................................................................... 56

    Best practice: Displaying information on a screen temporarily........................................................................................ 56

    7 Menus............................................................................................................................................................................................ 57

    Best practice: Implementing menus............................................................................................................................................. 57Context menus................................................................................................................................................................................ 58

    Best practice: Implementing context menus...................................................................................................................... 59

    8 Text..................................................................................................................................................... ........................................... 60Fonts................................................................................................................................................................................................. 60

    Best practice: Fonts................................................................................................................................................................ 60

    Writing conventions........................................................................................................................................................................ 6Best practice: Punctuation.................................................................................................................................................... 60Best practice: Capitalization................................................................................................................................................. 61Best practice: Abbreviations and acronyms........................................................................................................................ 61Product names and trademarks............................................................................................................................................ 62 Trademark symbols and UI elements................................................................................................................................... 63Logos........................................................................................................................................................................................ 63

    Best practice: Terminology.................................................................................................................................................... 63 Terms to avoid......................................................................................................................................................................... 64

    9 Themes.......................................................................................................................................................................................... 66Best practice: Designing themes.................................................................................................................................................. 67Precision theme............................................................................................................................................................................... 68Dimension theme............................................................................................................................................................................ 68

    10 Icons and indicators.................................................................................................................................................................... 70Best practice: Designing icons and indicators............................................................................................................................ 70Precision theme icons and indicators........................................................................................................................................... 70

    Best practice: Designing icons and indicators for the Precision theme.......................................................................... 71Dimension theme icons and indicators........................................................................................................................................ 73

    Best practice: Designing icons and indicators for the Dimension theme....................................................................... 74

  • 8/9/2019 Blackberry Smart Phones US

    6/89

    Default themes and dimensions for screens and application icons on BlackBerry devices.................................................. 74

    11 Sound............................................................................................................................................................................................. 76Best practice: Implementing sound.............................................................................................................................................. 76

    12 Localization................................................................................................................................................................................... 77Best practice: Designing applications for different languages and regions............................................................................ 77Best practice: Coding for different languages and regions....................................................................................................... 77

    Best practice: Writing for different languages and regions....................................................................................................... 78 13 Accessibility.................................................................................................................................................................................. 79

    Best practice: Designing accessible applications....................................................................................................................... 79

    14 Glossary......................................................................................................................................................................................... 81

    15 Provide feedback........................................................................................................................................................ ................. 82

    16 Document revision history......................................................................................................................................................... 83

    17 Legal notice.................................................................................................................................................................................. 85

  • 8/9/2019 Blackberry Smart Phones US

    7/89

    Design principles for BlackBerry devices 1Applications designed for BlackBerry devices should provide a balance between the best possible user experience and a longbattery life. When you design your BlackBerry device application, consider the differences between mobile devices and computers.Mobile devices have the following characteristics:

    a smaller screen size that can display a limited number of characters slower processor speeds

    wireless network connections with a longer latency period than standard LANs less available memory shorter battery life one screen appears at a time

    Mobile device users use applications on their mobile devices differently than they would use applications on a computer. Onmobile devices, users expect to find information quickly. For example, a customer relationship management system can providea massive amount of information, but users only require a small amount of that information at one time. The BlackBerry deviceUI is designed so that users can perform tasks easily and access information quickly.

    Before you design your application, consider using the existing applications on the BlackBerry device or the BlackBerrySmartphone Simulator to learn more about the navigation model and best practices for designing the UI for your application.

    For information on designing web pages for BlackBerry devices, see theBlackBerry Browser Content Design Guidelines.

    UI Guidelines Design principles for BlackBerry devices

    5

  • 8/9/2019 Blackberry Smart Phones US

    8/89

    Best practice: Designing applications for BlackBerry devices When you design applications for BlackBerry devices, try to be as consistent as possible with other BlackBerry device applications.Consider the following guidelines:

    Use or extend existing UI components where possible so that your application can inherit the default behavior of thecomponent.

    Follow the standard navigation model as closely as possible so that a particular user action produces a consistent result

    across applications. For example, allow users to open the context menu in all applications by clicking the trackball or trackpad. Support and extend user tasks in useful ways. For example, when users download an application, the application shouldopen automatically. The application should also be saved in the Applications folder.

    When you design your application, also consider the following guidelines:

    Stay focused on users' immediate task. Display only the information that users need at any one moment. Verify that the actions that are available in the menu are relevant to users' current context. Minimize the number of times that users need to click the trackwheel, trackball, trackpad, or touch screen to complete a task. Design your UI to allow users to change their mind and undo commands. Users sometimes click the wrong menu item or

    button accidentally. For example, use an alert dialog box to notify users of a critical action such as deleting data from theirBlackBerry devices.

    Display information in a way that makes effective use of the small screen.

    Creating a UI that is consistent with standard BlackBerry UIs

    You can use the standard MIDP APIs and the BlackBerry UI APIs to create a BlackBerry Java Application UI. The UI components in the BlackBerry UI APIs are designed to provide layouts and behaviors that are consistent with BlackBerryDevice Software applications.

    Screen components can provide a standard screen layout, a default menu, and standard behavior when a BlackBerry deviceuser presses the Escape key, clicks the trackwheel, trackball, trackpad, or touches the screen.

    Field components can provide the standard UI elements for date selection, option button, check box, list, text field, label,and progress bar controls.

    Layout managers can provide an application with the ability to arrange the components on a BlackBerry device screen instandard ways, such as horizontally, vertically, or in a left-to-right flow.

    You can use the BlackBerry UI APIs to create a UI that includes tables, grids, and other specialized features. You can use astandard Java event model to receive and respond to specific types of events. A BlackBerry device application can receive andrespond to user events, such as when the user clicks the trackball or types on the keyboard, and to system events, such as globalalerts, clock changes, and USB port connections.

    UI Guidelines Best practice: Designing applications for BlackBerry devices

    6

  • 8/9/2019 Blackberry Smart Phones US

    9/89

    Display specifications for BlackBerry devices

    BlackBerry device model Display screen size Pixels per inch Dot pitch (mm)

    BlackBerry 7100 Series 240 x 260 pixels 151 0.168BlackBerry 8700 Series 320 x 240 pixels 154 0.165BlackBerry 8800 Series 320 x 240 pixels 163 0.156

    BlackBerry Bold 9000smartphone

    480 x 320 pixels 217 0.117

    BlackBerry Bold 9650smartphone

    BlackBerry Bold 9700smartphone

    480 x 360 pixels 245 0.1035

    BlackBerry Curve 8300 SeriesBlackBerry Curve 8350ismartphone

    BlackBerry Curve 8500 Series

    320 x 240 pixels 163 0.156

    BlackBerry Curve 8900smartphone

    480 x 360 pixels 245 0.1035

    BlackBerry Pearl 8100 Series 240 x 260 pixels 161 0.15825BlackBerry Pearl Flip 8200 Series 240 x 320 pixels 166 0.153BlackBerry Pearl 9100 Series 360 x 400 pixels 238 0.1065BlackBerry Storm 9500 Series 360 x 480 pixels 184 0.138BlackBerry Tour 9600 Series 480 x 360 pixels 245 0.1035

    UI Guidelines Display specifications for BlackBerry devices

    7

  • 8/9/2019 Blackberry Smart Phones US

    10/89

    Considerations for BlackBerry devices with a touch screen 2If you design an application for BlackBerry devices with a trackball or trackpad, you can optimize the user experience with theapplication on a BlackBerry device with a touch screen by considering the following items:

    Users interact with the BlackBerry device by touching the screen with a finger. Toolbars appear at the bottom of most screens. Users type text on a virtual keyboard. Users can view application screens in portrait mode or landscape mode. Some cursors, controls, and methods for highlighting items are different from cursors, controls, and methods for highlighting

    items on other BlackBerry devices. Thescreen, banner, background images, and icons on a BlackBerry device with a touch screen are larger than other BlackBerry

    devices.

    Related topics Touch screen, 9

    Toolbars, 0Keyboard, 12Cursors, 19Controls, 42Screens, 25Banner, 29Default themes and dimensions for screens and application icons on BlackBerry devices, 74Precision theme icons and indicators, 70Highlighting items, 22

    UI Guidelines Considerations for BlackBerry devices with a touch screen

    8

    http://-/?-
  • 8/9/2019 Blackberry Smart Phones US

    11/89

    Interaction 3

    Interaction methods on BlackBerry devices

    BlackBerry device model Interaction method

    BlackBerry 7100 Series trackwheel

    BlackBerry 8700 Series trackwheelBlackBerry 8800 Series trackballBlackBerry Bold 9000 smartphone trackballBlackBerry Bold 9650 smartphone

    BlackBerry Bold 9700 smartphone

    trackpad

    BlackBerry Curve 8300 Series trackball

    BlackBerry Curve 8500 Series trackpadBlackBerry Curve 8900 smartphone trackballBlackBerry Pearl 8100 Series trackballBlackBerry Pearl Flip 8200 Series trackballBlackBerry Pearl 9100 Series trackpadBlackBerry Storm 9500 Series touch screenBlackBerry Tour 9630 smartphone trackball

    Touch screenOn BlackBerry devices with a SurePress touch screen, users use a finger to interact with the applications on the device. Userstype text and navigate screens by performing various actions on the touch screen.

    Users can also perform actions by clicking icons on the toolbar or by pressing the Menu key.

    On BlackBerry devices with a touch screen, users can perform the following actions:

    Action Result

    touch the screen lightly This action highlights an item.

    UI Guidelines Interaction

    9

  • 8/9/2019 Blackberry Smart Phones US

    12/89

    Action Result

    In a text field, if users touch the screen near the cursor, an outlined box displaysaround the cursor. This box helps users reposition the cursor more easily.

    tap the screen In applications that support a full-screen view, such as BlackBerry Maps and theBlackBerry Browser, this action hides and shows the toolbar.

    tap the screen twice On a web page, map, picture, or presentation attachment, this action zooms in tothe web page, map, picture, or presentation attachment.

    hold a finger on an item On the toolbar, this action displays a tooltip that describes the action that the iconrepresents.

    In a message list, if users hold a finger on the sender or subject of a message, theBlackBerry device searches for the sender or subject.

    touch and drag an item on the screen This action moves the content on the screen in the corresponding direction. Forexample, when users touch and drag a menu item, the list of menu items moves inthe same direction.

    In a text field, this action moves the outlined box and the cursor in the same direction.touch the screen in two locations at thesame time

    This action highlights the text or the list of items, such as messages, between thetwo locations. To add or remove highlighted text or items, users can touch the screenat another location.

    click (press) the screen This action initiates an action. For example, when users click an item in a list, thescreen that is associated with the item appears. This action is equivalent to clicking

    the trackwheel, trackball, or trackpad.On a map, picture, or presentation attachment, this action zooms in to the map,picture, or presentation attachment. On a web page, this action zooms in to theweb page or follows a link.

    In a text field, this action positions the cursor. If the field contains text, an outlinedbox appears around the cursor.

    slide a finger up or down quickly on thescreen

    Quickly sliding a finger up displays the next screen. Quickly sliding a finger downdisplays the previous screen.

    When the keyboard appears, quickly sliding a finger down hides the keyboard anddisplays the toolbar.

    slide a finger to the left or right quicklyon the screen

    This action displays the next or previous picture or message, or the next or previousday, week, or month in a calendar.

    UI Guidelines Touch screen

    10

  • 8/9/2019 Blackberry Smart Phones US

    13/89

    Action Result

    slide a finger up or down on the screen In the camera, sliding a finger up zooms in to a subject. Sliding a finger down zoomsout from a subject.

    slide a finger in any direction This action pans a map or web page. If users zoom in to a picture, this action alsopans a picture.

    press the Escape key This action removes the highlight from text or a list of items.

    On a web page, map, or picture, this action zooms out one level. Users can press

    the Escape key twice to zoom back to the original view.

    Best practice: Designing applications for touch screen devices Respond to each touch action that you use in your application. For more information about how to respond to events created

    by each action, see the BlackBerry UI and Navigation Development Guide . Where possible, create a target area for user interface elements that is at least 6 mm.

    Provide enough space around controls so that users can easily touch the screen with their fingertips to initiate a specificaction. Familiarize yourself with navigation models for BlackBerry devices with a touch screen and BlackBerry devices without a

    touch screen. Verify that your application works well for each model.

    Trackball or trackpadOn BlackBerry devices with a trackball or trackpad, the trackball or trackpad is the primary control for user navigation. Userscan perform the following actions:

    Roll the trackball or slide a finger on the trackpad to move the cursor. Click the trackball or trackpad to perform default actions or open a context menu. Click the trackball or trackpad while pressing the Shift key to highlight text or highlight messages in a message list.

    BlackBerry devices with a trackball or trackpad also include a Menu key that is located to the left of the trackball or trackpad.Users can press the Menu key to open a full menu of available actions.

    Related topicsMenus, 57

    Best practice: Designing applications for trackball or trackpad devices Assign a default action or open a context menu when users click the trackball or trackpad.

    UI Guidelines Trackball or trackpad

    11

  • 8/9/2019 Blackberry Smart Phones US

    14/89

    When users highlight text or multiple objects, use the context menu to provide the most relevant actions that apply to the

    selection. For example, when users edit a message, they can use the context menu to send the message. If users highlight text in the message, the context menu changes and users can use the menu to copy the text. Avoid making users alternate between using the keyboard and using the trackball or trackpad. Users should be able to

    perform most actions using either the keyboard or the trackball or trackpad.

    TrackwheelBlackBerry devices that precede the BlackBerry Pearl 8100 Series use a trackwheel as the primary control for user navigation. The trackwheel is located on the right side of the BlackBerry device.

    Users can perform the following actions:

    roll the trackwheel to move the cursor vertically roll the trackwheel while pressing the Alt key to move the cursor horizontally click the trackwheel to initiate an action or open the menu

    KeyboardUsers use the keyboard primarily to type text. Character keys send a character to the BlackBerry device. A modifier key altersthe functionality of character keys. Modifier keys include the Shift key and the Alt key. When users press a modifier key, a typingmode indicator appears in the upper-right corner of the screen.

    On BlackBerry devices without a touch screen, users can also use the keyboard to move around a screen (for example, to movearound a map). However, navigation using the keyboard should always be an alternative to navigation using the trackwheel,trackball, or trackpad.

    BlackBerry devices have either a full keyboard or a reduced keyboard. On BlackBerry devices with a SurePress touch screen, inmost cases, the full keyboard appears in landscape view and the reduced keyboard appears in portrait view.

    Related topics Text fields, 50

    Best practice: Designing applications for different types of keyboard

    If you alter the functionality of a key, always return the key to its original state when users close the application. Verify that your application is compatible with both full keyboards and reduced keyboards. Support modifier keys where

    appropriate. Make sure that users can undo commands easily. Typing can be challenging for new users. Make sure that users can use the Escape key to cancel actions or return to the previous screen. Users should return to the

    Home screen if they press the Escape key repeatedly. They should also be able to close the browser or media applicationby pressing and holding the Escape key.

    Make sure that users can perform the following actions:

    UI Guidelines Trackwheel

    12

    UI G id li K b d

  • 8/9/2019 Blackberry Smart Phones US

    15/89

    Press the Menu key to open a full menu.

    Press the Menu key to initiate an action when a menu item is highlighted. Press and hold the Menu key to open the dialog box for switching applications. Press the Menu key to initiate an action when a button has focus in a dialog box on BlackBerry devices with a touch

    screen. Choose an appropriate field based on what you expect users to type. For example, if you expect users to type numbers, use

    a field that accepts only numbers so that users can type numbers easily. Use the following information to determine whichinput method to choose.

    Full keyboard The full keyboard provides users with a keyboard that is similar to the keyboard on a computer. Users type as they would on acomputer keyboard except that numbers and symbols are located in different places.

    Users can perform the following actions to type numbers and symbols:

    Action BlackBerry devices without a touch screen BlackBerry devices with a touch screen

    Type a number in anumber field

    Press the number key. Press the number key.

    Type a number in a text

    field

    Press the Alt key and the number key. Press the 123 key.

    Type a common symbol Press the Alt key and the character key. Press the Symbol key. Type other symbols Press the Symbol key. Press the Symbol key. Type a capital letter Press and hold the letter key. Press and hold the letter key.

    UI Guidelines Keyboard

    13

    UI Guidelines Keyboard

  • 8/9/2019 Blackberry Smart Phones US

    16/89

    Full keyboard on a BlackBerry device without a touch screen

    Full keyboard on a BlackBerry device with a touch screen

    Reduced keyboardBlackBerry devices with reduced keyboards use SureType technology, which is designed to predict words as users type them.Users can type text using the SureType input method or the multi-tap input method.

    When users use the SureType input method, they press the letter key for each letter in a word once. For example, to typerun , users would press theERkey once, the UI key once, and the BN key once. As users type, a list of possible lettercombinations and words appears on the screen. SureType technology selects letter combinations or words from the list

    UI Guidelines Keyboard

    14

    UI Guidelines Keyboard

  • 8/9/2019 Blackberry Smart Phones US

    17/89

    based on context. If users type a word or letter combination (for example, a web address or an abbreviation) that SureTypetechnology does not recognize, users use the list that appears on the screen to build the word letter by letter. SureTypetechnology is designed to "learn" new words or letter combinations that users type and add them to a custom word list.

    When users use the multi-tap input method, they press a letter key once to type the first letter on the key and twice to typethe second letter. For example, to typerun , users would press theERkey twice, theUI key once, and the BN key twice.

    SureType technology is the default input method for most fields. Multi-tap is the default input method for phone number fieldsand password fields. If users switch from using SureType technology to using the multi-tap input method, the multi-tap input method indicator appears in the upper-right corner of the screen.

    Some languages, such as Simplified Chinese, have specialized input methods and do not use the SureType input method or themulti-tap input method. For more information about specialized input methods for specific devices and languages, visit http://na.blackberry.com/eng/support/docs/ to see the product documentation.

    Reduced keyboard on a BlackBerry device without a touch screen

    UI Guidelines Keyboard

    15

    UI Guidelines Keyboard

    http://na.blackberry.com/eng/support/docs/http://na.blackberry.com/eng/support/docs/
  • 8/9/2019 Blackberry Smart Phones US

    18/89

    Reduced keyboard on a BlackBerry device with a touch screen

    Types of reduced keyboardsReduced keyboards have either 20 keys or 14 keys. Users can perform the following actions using the SureType input method:

    Action 20-key reduced keyboard 14-key reduced keyboard

    Type a number in a numberfield

    Press the number key. Press the number key.

    Type a number in a text field Hold the Alt key and press the number key. Press and hold the number key. Type a common symbol Press the Symbol key. Press 1. Type other symbols Press the Symbol key. Press the Symbol key.

    Type a capital letter Press and hold the letter key. Press the Shift key.Switch input methods When typing, press the Menu key. Press the Shift key.

    Key functionality

    Key Use

    Alt Type the alternate character on a key on most BlackBerry devices. The BlackBerry Pearl 9105smartphone does not have an Alt key.

    End/Power End a call.

    Turn on or turn off most BlackBerry devices. The Power/Lock key turns on or turns off BlackBerryStorm2 Series devices.

    y

    16

    UI Guidelines Keyboard

  • 8/9/2019 Blackberry Smart Phones US

    19/89

    Key Use

    Display the Home screen or application list. The application maintains its current state.Escape Move back a screen.

    Close a menu or dialog box.

    Press and hold to close applications such as the browser or media applications.

    Delete text in a search field.

    Menu Open the application list on the Home screen.Open the menu in an application.

    Mute Turn on standby mode from the Home screen.

    Turn on or turn off mute during a call.Play/Pause/Mute Play, pause, or mute a media file on smartphones in the BlackBerry Curve 8500 Series. You can

    also play, pause, or mute a media file on smartphones in the BlackBerry Pearl 9100 Series.

    Previous and Next Play the previous or next media file on smartphones in the BlackBerry Pearl 9100 Series.Send Open the phone.

    Call a highlighted phone number.Space Type a space.

    Select an option button, check box, or drop-down list item.

    Insert a period (.) when pressed twice in a text field.

    Insert a period (.) in a web address field or an email address field.

    Insert an at sign (@) in an email address field.

    Move down a screen in the browser or message list. Press the Shift key and the Space key to moveup a screen.

    Speakerphone Turn on or turn off the speakerphone during a call on BlackBerry devices. The BlackBerry Pearl 9105

    smartphone does not have a Speakerphone key.Symbol Open the symbol list.

    Typing indicators Typing indicators appear in the upper-right corner of the BlackBerry device screen. Avoid displaying other information in theupper-right corner of the screen because the typing indicators could obscure the information.

    17

    UI Guidelines Keyboard

  • 8/9/2019 Blackberry Smart Phones US

    20/89

    Indicator Description These indicators indicate that the BlackBerry device is in Alt mode. To enter this mode, users press

    the Alt key. On BlackBerry devices with a reduced keyboard, these indicators indicate that the BlackBerry device

    is in multi-tap input mode. These indicators indicate that the BlackBerry device is in number lock mode. On BlackBerry devices

    with a full keyboard, users press the Alt key and the Left Shift key. On most BlackBerry devices with

    a reduced keyboard, users press the Alt key and the Shift key. On BlackBerry devices with a touchscreen, users press and hold the 123 key until the lock indicator appears on the key.

    These indicators indicate that the BlackBerry device is in Shift mode. To enter this mode, users pressthe Shift key. This indicator indicates the typing input language.

    Typing indicators for the BlackBerry Pearl 9105 smartphoneUsers switch modes by pressing the Shift key.

    Indicator Mode

    SureType input mode

    SureType Shift mode

    SureType Shift-Lock mode

    multi-tap input modemulti-tap Shift mode

    multi-tap Shift-Lock mode

    Shortcut keys

    On BlackBerry devices without a touch screen, shortcut keys provide users with direct access to common actions within anapplication. Users can use shortcut keys for common actions such as composing an email message or adding a browser bookmark.Users can also use shortcuts to access buttons in a dialog box.

    Application menu items do not have shortcut keys assigned to them. After users open the menu, they can press the key for thefirst letter of a menu item to highlight the menu item. To initiate the action associated with a highlighted menu item, users pressthe Enter key or click the trackwheel, trackball, or trackpad. If multiple menu items have the same first letter, users can continuepressing the key for the letter until they highlight the menu item that they want.

    18

    UI Guidelines Cursors

  • 8/9/2019 Blackberry Smart Phones US

    21/89

    Best practice: Implementing shortcut keys Assign and document shortcut keys for common actions. For example, on BlackBerry devices with a full keyboard, userscan press "N" to move to the next date in a message list. Users can press "P" to move to the previous date in a message list.

    Use shortcuts keys to increase efficiency for users but not as a primary means for users to interact with your application.Users should be able to access all available actions from the menu.

    Localize shortcut keys where possible for the French, Italian, German, Spanish, Hungarian, Czech, and Polish languages.Use English shortcut keys for all other languages.

    In dialog boxes, assign shortcut keys to all buttons. Underline the character that is associated with the shortcut key. In wizards, do not assign shortcut keys to buttons. Avoid creating shortcut keys for destructive actions, actions that cannot be undone easily, or actions for which the

    consequences might be unclear.

    Guidelines for choosing shortcut keys Use different shortcut keys for full keyboards and reduced keyboards. For example, to move to the top of a web page, users

    can press one of the following letters: "T" on full keyboards

    "1" on 20-key reduced keyboards "2" on 14-key reduced keyboards

    For screens, use the first or most memorable character in an action for the shortcut key. For example, in a message list, theshortcut key "R" represents "Reply" and the shortcut key "F" represents "Forward."

    In dialog boxes, use the first character in the button label as the shortcut key. Use the same shortcut keys t hat are used in other applications for similar actions where possible. Verify that custom shortcut keys do not overlap with existing reserved shortcut keys. For more information about existing

    shortcuts keys, visit http://na.blackberry.com/eng/support/docs/ to see the product documentation.

    Avoid assigning different actions to well-known shortcut keys.

    CursorsAs users roll the trackwheel or trackball, or slide a finger on the trackpad, the cursor moves the focus to each control on thescreen. The cursor takes on different shapes to indicate its current behavior.

    On web pages, users can roll the trackwheel to move vertically. Users can roll the trackball or slide a finger on the trackpad tomove vertically and horizontally. As the cursor moves over controls such as links or text fields, the cursor changes to indicate thetype of interaction that users can have with the control.

    Cursors do not appear as often on BlackBerry devices with a touch screen. When users touch a control on the screen, the focusis set on that control. In some cases, as users touch controls such as links or text fields, a cursor appears to indicate the type of interaction that users can have with the control.

    19

    UI Guidelines Cursors

    http://na.blackberry.com/eng/support/docs/http://na.blackberry.com/eng/support/docs/
  • 8/9/2019 Blackberry Smart Phones US

    22/89

    Cursor Purpose User interactionarrow The arrow cursor indicates the

    position of the cursor on a webpage.

    To move the cursor, users can perform the following actions:

    Roll the trackwheel or trackball. Slide a finger on the trackpad.

    To perform an action, users click the trackwheel, trackball, ortrackpad.

    bar The bar cursor indicates theposition of the cursor in a list such as a menu or drop-downlist.

    To highlight an item in the list, users can perform the followingactions:

    Roll the trackwheel or trackball up or down. Slide a finger up or down on the trackpad. Touch the touch screen.

    To open an item or initiate the action associated with the item,users click the trackwheel, trackball, trackpad, or screen.

    hand The hand cursor indicates theposition of the cursor whenusers pause on a link.

    To follow the link, users click the trackwheel, trackball, or trackpad.

    hourglass On BlackBerry devices that usethe Dimension theme, the

    hourglass cursor indicates that the BlackBerry device is savinginformation or performinggarbage collection. This cursoralso appears when users turn ontheir BlackBerry devices.

    Users cannot perform any actions while the BlackBerry devicedisplays this cursor.

    clock On BlackBerry devices that use

    the Precision theme, the clockcursor indicates that theBlackBerry device is savinginformation or performinggarbage collection. This cursormight also appear when usersturn on their BlackBerry devices.

    Users cannot perform any actions while the BlackBerry device

    displays this cursor.

    20

    UI Guidelines Cursors

  • 8/9/2019 Blackberry Smart Phones US

    23/89

    Cursor Purpose User interaction

    magnifying The magnifying cursor indicatesthat users can zoom in to or out from a web page in Page view.

    To move around the web page, users can perform the followingactions:

    Roll the trackwheel or trackball. Slide a finger on the trackpad.

    To zoom in to the web page, users click the trackwheel, trackball,or trackpad.

    To zoom out from the web page, users press the Escape key.caret The caret cursor indicates the

    position of the cursor in a text field.

    To move the cursor in a text field, users can perform the followingactions:

    Type text in the field. Roll the trackwheel or trackball.

    Slide a finger on the trackpad. Click the trackball or trackpad to open the context menu if applicable.

    To highlight text, users can perform the following actions:

    Press the Shift key and roll the trackwheel or trackball. Press the Shift key and slide a finger on the trackpad.

    To highlight text on BlackBerry devices with a touch screen, userscan perform the following actions:

    Touch the screen in two locations. Touch the screen near the cursor to display an outlined box.

    This box is designed to help users reposition the cursor moreeasily. Press the Menu key and click Select. Drag a finger overthe text to highlight it.

    text The text cursor indicates that the cursor is positioned over atext area.

    Depending on the design of web pages, users can click thetrackwheel, trackball, or trackpad to perform actions.

    21

    UI Guidelines Highlighting items

  • 8/9/2019 Blackberry Smart Phones US

    24/89

    Cursor Purpose User interaction

    underscore The underscore cursor indicatesthe position of the cursor whenusers highlight a link in anapplication other than thebrowser. Links can be for itemssuch as phone numbers, websites, and email addresses.

    To perform additional actions, users can perform one of thefollowing actions:

    Click the trackwheel, trackball, or trackpad. Click the touch screen.

    To highlight a link character by character, users can perform oneof the following actions:

    Press the Shift key and roll the trackwheel. Press the Shift key and roll the trackball horizontally. Press the Shift key and slide a finger horizontally on the

    trackpad. Touch the touch screen near the cursor to display an outlined

    box. Drag a finger over the text to highlight it.

    Best practice: Implementing cursors Use the standard cursors and colors where possible. Where possible, inherit the visual style of the theme that users have selected. If your application does not inherit the visual

    style from the theme, try to provide a consistent experience for your users. Avoid hardcoding color values. The color values that you choose might not work with the theme that users have selected.

    Choose a highlight color that has high contrast and clearly implies focus (for example, white text on a blue background).Use the same highlight color for all controls.

    Avoid changing the font, font size, or font style for highlighted text or items.

    Highlighting itemsIn a text field, a caret cursor indicates that users can highlight text. In the browser, users can highlight text when their BlackBerry

    devices are in Select mode. In Select mode, the cursor changes from the arrow cursor to the caret cursor.

    22

    UI Guidelines Highlighting items

  • 8/9/2019 Blackberry Smart Phones US

    25/89

    In a list, users can highlight multiple items. The bar cursor indicates the position of the cursor. The primary highlight color identifiesthe active item, and the secondary color identifies the items that users have highlighted.

    Action BlackBerry devices without a touch screen BlackBerry devices with a touch screen

    Highlight contiguoustext or messages in amessage list.

    Press the Shift key and roll the trackwheelor trackball.

    Press the Shift key and slide a finger onthe trackpad.

    To highlight contiguous text, press theMenu key and click Select. Drag a fingerover the text.

    To highlight messages in a message list,touch the first and last item simultaneously.

    Perform additional

    actions afterhighlighting text.

    Click the trackwheel, trackball, or trackpad. Press the Menu key.

    Related topicsCursors, 19

    23

    UI Guidelines Highlighting items

  • 8/9/2019 Blackberry Smart Phones US

    26/89

    Best practice: Highlighting items On BlackBerry devices with a trackball or trackpad, when users highlight text or messages in a message list, use the context menu to provide the most relevant actions that apply to the highlighted items. For example, if users highlight messages ina message list, they can use the context menu to file the messages.

    On BlackBerry devices with a touch screen, provide a context menu when users click an item that has a number of commonactions associated with it (for example, a date separator in a message list or a contact name in a message). For example, if users click a contact in an email message, they can use the context menu to save a draft of the message.

    Verify that users can use the Escape key to remove the highlight from text or items. If users can highlight text, always provide a menu item for copying text. Likewise, provide a menu item for cutting the

    highlighted text when users can edit the text. Use the menu item for copying as the default menu item. Where possible, inherit the visual style of the theme that users have selected. If your application does not inherit the visual

    style from the theme, try to provide a consistent experience for your users. Choose a highlight color that has high contrast and clearly implies focus (for example, white text on a blue background).

    Use the same highlight color for all controls. Avoid changing the font, font size, or font style for highlighted text or items.

    24

    UI Guidelines Screens

  • 8/9/2019 Blackberry Smart Phones US

    27/89

    Screens 4

    Application screensMultiple screens can be open on a BlackBerry device at one time, but users can view only one screen at a time. When multiplescreens are open, they are organized in a stack. The screen at the top of the stack is the active screen. When an applicationdisplays a screen, the BlackBerry Java Virtual Machine pushes it to the top of the stack. When a screen closes, the BlackBerry Java Virtual Machine deletes the screen from the top of the stack and displays the next screen on the stack. The applicationredraws the screen as necessary.

    A screen typically has the following characteristics:

    Screen element Description

    nonscrolling title bar This bar appears at the top of the screen and can include a descriptive screen title andindicators such as the battery power indicator and wireless coverage indicator.

    scroll arrows or bars If content extends beyond the viewing area, scroll arrows or scroll bars appear. Verticalscroll arrows or scroll bars appear on the right side of the screen, and horizontal scroll barsappear at the bottom of the screen. Scroll bars do not interfere with text.

    25

    UI Guidelines Application screens

  • 8/9/2019 Blackberry Smart Phones US

    28/89

    Screen element Description

    context menu A context menu contains a list of the most common available actions that users can performwithin the current context.

    On BlackBerry devices with a trackball or trackpad, a context menu appears when usersclick the trackball or trackpad and there is no default action. The context menu appearsat the bottom of a screen, centered horizontally.

    On BlackBerry devices with a touch screen, a context menu appears when users click an

    item that has a number of common actions associated with it (for example, a date separatorin a message list or a contact name in a message). The context menu appears to the right of the highlighted item. If there is not enough space to the right, the context menu appearsto the left of the highlighted item.

    full menu A full menu contains all the available actions for an application. To open a full menu, userspress the Menu key. Full menus appear in the lower-left corner of the screen.

    toolbar On BlackBerry devices with a touch screen, a toolbar appears at the bottom of the screen. Toolbars provide users with access to common actions, such as composing an emailmessage or adding a browser bookmark.

    26

    UI Guidelines Application screens

  • 8/9/2019 Blackberry Smart Phones US

    29/89

    Screen element Description

    portrait and landscape view On BlackBerry devices with a touch screen, users can switch between portrait view andlandscape view by turning the device sideways.

    Portrait view

    Landscape view

    Related topicsMenus, 57 Toolbars, 0

    27

    UI Guidelines Application screens

    http://-/?-
  • 8/9/2019 Blackberry Smart Phones US

    30/89

    Best practice: Designing application screens Delete your application screen from the stack when users close a screen. If you use standard components, the BlackBerrydevice automatically deletes screens from the stack.

    Set appropriate focus when your application screens open. Typically, you should set the focus on the control that users aremost likely to use first. If this control is not near the top of the screen, consider changing the layout of the screen.

    Repaint the screen judiciously. Your BlackBerry device application should not perform unnecessary screen repaints. Use a limited number of nested layouts. The more nested layouts that you use to build your screen, the longer it takes for

    the BlackBerr y device to render the screen. Verify that your application receives and loses focus appropriately. Support multiple screen resolutions and sizes. If you use standard UI fields to build your screens, the BlackBerry device

    automatically renders content to fit the screen. Otherwise, you might need to include the necessary logic to determine thescreen size at runtime. Always test your application on different BlackBerry device models and screen sizes.

    Include a Close menu item that users can use to close the application. When users click the menu item or press the Escapekey, the application should close. If you use standard components, the Close menu item appears in the menu automatically.

    Prompt users with a dialog box to save any unsaved data before closing a screen.

    Where possible, inherit the visual style of the theme that users have selected. If your application does not inherit the visualstyle from the theme, try to provide a consistent experience for your users. Avoid hardcoding color values. The color values that you choose might not work with the theme that users have selected.

    Guidelines for layout Use a vertical layout for your application screens and include scroll arrows or a scroll bar to allow users to scroll up or down

    the screens. If you use standard components, scroll arrows are inherited. If you build a custom scroll bar, try to be consistent with other applications on the BlackBerry device.

    On BlackBerry devices with a touch screen, verify that the screens display correctly in both portrait and landscape view. Include a title bar that describes the content of the screen. Consider including the date, time, battery power level indicator, and wireless coverage indicator in the banner of the

    application, especially if the application requires a wireless connection. Display the most important information at the top of the screen. For example, for contact information, display the name

    first, followed by the email address and phone numbers. Display a field such as the Notes field last. Limit the number of controls that appear on the screen at one time. Place all actions that the user can perform in the full menu for the application. Use line separators on a screen to separate controls or to indicate a group of controls. Consider localization requirements as early in the design process as possible. Localization can affect the layout of screens.

    Related topicsDisplay specifications for BlackBerry devices, 7Default themes and dimensions for screens and application icons on BlackBerry devices, 74 Themes, 66

    28

    UI Guidelines Banner

  • 8/9/2019 Blackberry Smart Phones US

    31/89

    Common actions on application screensUsers can perform the following common actions on screens:

    Action User interaction

    Move around the screen. Roll the trackwheel or trackball. Slide a finger on the trackpad or touch screen.

    Open the menu. Click the trackwheel. Press the Menu key.

    Invoke an action in the menu. Click the item. When an item is highlighted in the menu, press the Menu key.

    Switch applications. Press the Alt key and the Escape key. Hold the Menu key.

    Close an application. Click Close in the menu.Return to the Home screen without closing theapplication screen.

    Press the End key.

    Banner The banner, or the device status section of the Home screen, displays the following information:

    date and time wireless service provider battery power indicator wireless coverage indicator sound profile indicator status indicators, such as the alarm indicator, missed call count indicator, and unopened message count indicator

    third-party indicators The theme that users have selected on their BlackBerry devices determines the design of the Home screen banner.

    29

    UI Guidelines Banner

  • 8/9/2019 Blackberry Smart Phones US

    32/89

    Medium or small banners appear in the title bar of some applications. For example, in a message list, the medium banner displaysthe time, battery power indicator, and wireless coverage indicator.

    Best practice: Implementing banners Choose a medium banner or small banner depending on how much of the screen you want to reserve for displaying the

    application screens. For example, consider displaying a small banner for the media application or the browser applicationto display more content on the screen.

    Where possible, inherit the visual style of the theme that users have selected. If your application does not inherit the visualstyle from the theme, try to provide a consistent experience for your users.

    Include the date, time, battery power indicator, and wireless coverage indicator in the banner, especially if the application

    requires a wireless connection. Add an indicator to the Home screen banner if necessary to provide a notification or to communicate important informationabout the status of your application. For example, include an unopened message indicator and count to provide users withnew message information.

    Consider the legibility of the text. Text becomes illegible when it appears on a background of a similar color or brightness.

    Related topics Themes, 66

    30

    UI Guidelines Dialog boxes

  • 8/9/2019 Blackberry Smart Phones US

    33/89

    Dimensions for banners on BlackBerry devices

    BlackBerry device model Large banner size Medium banner size Small banner size

    BlackBerry 7100 Series 240 x 65 pixels 240 x 32 pixels 240 x 17 pixelsBlackBerry 8700 Series 320 x 50 pixels 320 x 32 pixels 320 x 17 pixelsBlackBerry 8800 Series 320 x 50 pixels 320 x 32 pixels 320 x 17 pixelsBlackBerry Bold Series 480 x 75 pixels 480 x 48 pixels 480 x 28 pixelsBlackBerry Curve 8300 Series 320 x 50 pixels 320 x 32 pixels 320 x 17 pixelsBlackBerry Curve 8350ismartphone

    BlackBerry Curve 8500 Series

    320 x 51 pixels 320 x 36 pixels 320 x 20 pixels

    BlackBerry Curve 8900smartphone

    480 x 75 pixels 480 x 48 pixels 480 x 28 pixels

    BlackBerry Pearl 8100 Series 240 x 65 pixels 240 x 32 pixels 240 x 17 pixelsBlackBerry Pearl Flip 8200 Series 240 x 73 pixels 240 x 55 pixels 240 x 28 pixelsBlackBerry Pearl 9100 Series 360 x 96 pixels 360 x 48 pixels 360 x 48 pixelsBlackBerry Storm 9500 Series 360 x 96 pixels portrait view: 360 x

    48 pixels landscape view: 480

    x 48 pixels

    portrait view: 360 x24 pixels

    landscape view: 480

    x 24 pixelsBlackBerry Tour 9600 Series 480 x 75 pixels 480 x 48 pixels 480 x 28 pixels

    Dialog boxesUse dialog boxes to perform the following actions:

    Prompt users for information that is required to complete a user-initiated task. Inform users of urgent information or the status of important actions. Warn users of unexpected or potentially destructive conditions or situations.

    Dialog boxes are modal; they interrupt the normal operation of the BlackBerry device and are pushed to the top of the stack.A dialog box includes an indicator that indicates the type of dialog box, a message, and buttons that allow users to perform anaction. The size of the dialog box depends on the size of the BlackBerry device screen. Scroll arrows appear if necessary. Thetheme that users select on their BlackBerry device determines the visual style of the dialog box.

    31

    UI Guidelines Dialog boxes

  • 8/9/2019 Blackberry Smart Phones US

    34/89

    Best practice: Implementing dialog boxes Always use buttons as controls in dialog boxes. Avoid using links or other controls. Use a standard indicator that is appropriate for the type of dialog box. Avoid using multiple indicators in a dialog box. Include scroll arrows if your dialog box message or buttons cannot be displayed fully on the dialog box. If you use standard

    components, scroll arrows appear automatically if necessary.

    Always allow users to use the Escape key to close a dialog box. Avoid implementing another action when users press theEscape key to close a dialog box. For example, if a dialog box allows users to change a setting, do not implement any changeswhen users press the Escape key. If necessary, display the dialog box at a later time.

    If users press the End/Power key when a dialog box appears on an application screen, display the Home screen or applicationlist. If users return to the application, display the dialog box again.

    Where possible, inherit the visual style of the theme that users have selected. If your application does not inherit the visualstyle from the theme, try to provide a consistent experience for your users.

    Choose a highlight color that has high contrast and clearly implies focus (for example, white text on a blue background).Use the same highlight color for all controls.

    Avoid hardcoding color values. The color values that you choose might not work with the theme that users have selected.

    Guidelines for layout Center the dialog box on the screen. If you use standard components, the BlackBerry device automatically centers the

    dialog box. Create dialog boxes that are 90% or less of the width and height of the screen. If you use standard components, the

    BlackBerry device automatically calculates the appropriate size for dialog boxes.

    Center the dialog box indicator vertically with the dialog box message. Display messages to the right of the indicator and above any buttons. Place buttons for confirmation actions first. For example, place "Save" before "Discard" or "Cancel." Center buttons horizontally in dialog boxes. Place buttons vertically in the dialog box. The vertical layout allows buttons to expand to accommodate localized button

    labels.

    Guidelines for messages

    32

    UI Guidelines Dialog boxes

  • 8/9/2019 Blackberry Smart Phones US

    35/89

    Be specific. If possible, use one short sentence to clearly state the reason for displaying the dialog box and the actions that can dismiss it.

    Use complete sentences for messages where possible. Use vocabulary that users understand. For example, use "The file could not be saved because the media card is full" instead

    of "Error writing file to disk." Use positive language where possible and avoid blaming the user. Never write messages that blame users for errors or

    unexpected conditions. Instead, focus on the actions that users can take to resolve the issue. Use the second person (you, your) to refer to users. Use sentence case capitalization. Avoid using exclamation points (!) in messages.

    Avoid using an ellipsis (...) in messages unless you are indicating progress (for example, "Please wait...").

    Guidelines for buttons For the default button, use the button that users are most likely to click. Avoid using a button that is associated with a

    destructive action as the default button. An exception to this rule are those cases where users initiate a minor destructiveaction (such as deleting a single item) and the most common user action is to continue with the action.

    Avoid using more than three buttons in a dialog box. If there are more than three, consider using an application screeninst ead with option buttons.

    On BlackBerr y devices with a trackwheel, trackball, or trackpad, provide shortcut keys for buttons. Typically, the shortcut key is the first letter of the button label.

    Use clear, concise labels. Use one-word labels where possible. The size of a button changes depending on the length of the label. If a label is too

    long, an ellipsis (...) appears to indicate that the text is truncated. If you do use a label with multiple words, use sentencecase capitalization.

    Avoid using the labels "Yes" and "No." Use verbs that describe the associated action (for example, "Cancel," "Delete,""Discard," or "Save"). This approach helps users quickly and easily understand what happens when they click the button.If necessary, include more descriptive text elsewhere on the screen (for example, in an application message).

    Avoid using symbols or graphics in labels. Avoid using punctuation in labels. Use an ellipsis in a button label to indicate that additional information is required before

    the associated action can be performed.

    Related topics Themes, 66Buttons, 42

    Alert dialog boxesUse alert dialog boxes to notify users of a critical action such as turning off the BlackBerry device or an error such as typinginformation that is not valid. An exclamation point (!) indicator appears in an alert dialog box. To close an alert dialog box, userscan click OK or press the Escape key.

    33

    UI Guidelines Dialog boxes

  • 8/9/2019 Blackberry Smart Phones US

    36/89

    Best practice: Implementing alert dialog boxes Include only an OK button. This button should be highlighted by default. When users click the button, the dialog box should

    close. To provide users with multiple buttons, such as an OK button and a Cancel button, use an inquiry dialog box instead. Allow users to press the Escape key to close the dialog box. Use a concise, descriptive message to explain the situation that prompted the alert. Avoid phrasing messages as questions. Use statements instead.

    Information dialog boxesUse information dialog boxes to provide feedback about a user action. Information dialog boxes close automatically after apredefined period of time, or users can close the dialog box by pressing the Escape key. An information indicator appears in aninformation dialog box.

    Best practice: Implementing information dialog boxes Do not include buttons in information dialog boxes. To provide buttons, use another type of dialog box. Allow users to press the Escape key to close the dialog box. Set an appropriate timeout period for the dialog box based on the amount of time that is required for users to read the

    message. If users require more than 10 seconds to read the message, consider using another type of dialog box. If you do not want to allow users to perform any other actions while the dialog box appears on the screen, use a status dialog

    box instead.

    34

    UI Guidelines Dialog boxes

  • 8/9/2019 Blackberry Smart Phones US

    37/89

    Avoid phrasing messages as questions. Use statements instead.

    Input dialog boxesUse an input dialog box when users must specify information such as a date or file name. After users type the required information,they can press the Enter key to close the dialog box and save their changes. To close the dialog box without saving changes,users can press the Escape key. You can include buttons on this type of dialog box.

    Best practice: Implementing input dialog boxes Use a standard cursor that is appropriate for the type of text that is required from users. Allow users to press the Escape key to close the dialog box. Use a concise, descriptive phrase for field labels. Avoid stating in the message that users must provide information. Use the labels to imply that action is required. Avoid using prompt text in fields. Punctuate field labels with a colon (:).

    Inquiry dialog boxesUse inquiry dialog boxes when users must confirm an action before continuing. A question mark (?) indicator appears in an inquirydialog box.

    35

    UI Guidelines Dialog boxes

  • 8/9/2019 Blackberry Smart Phones US

    38/89

    Best practice: Implementing inquiry dialog boxes Use a concise, descriptive question for the message. Always prompt users with an inquiry dialog box to save their changes when they attempt to close a screen with unsaved

    changes. Include a Cancel button so that users can close the dialog box without making changes. Use verbs for labels that describe the associated action (for example, "Cancel," "Delete," "Discard," or "Save"). If necessary,

    include more descriptive text elsewhere on the screen (for example, in an application message). Avoid using the labels "Yes" and "No."

    Picker dialog boxes You can use picker dialog boxes to help users choose an item from a list easily.

    Type of picker Description

    File This picker allows users to browse for files on their BlackBerry devices.

    Location This picker allows users to choose a location from a list that you define. For example, you canallow users to choose their GPS location or a previously selected location.

    Date This picker allows users to choose a specific day, month, or year. For example, you can allow usersto choose a month and year to specify when their credit card expires.

    36

    UI Guidelines Dialog boxes

  • 8/9/2019 Blackberry Smart Phones US

    39/89

    Type of picker Description

    Time This picker allows users to choose a specific hour, minute, or second.

    Best practice: Implementing picker dialog boxes

    Use the FilePicker ,LocationPicker , andDateTimePicker classes to create picker dialog boxes. For more information

    about creating picker dialog boxes, see the API reference guide for the BlackBerry Java Development Environment and theCreate a file pickertopic and the Create a date picker topic in the BlackBerry Java Application UI and Navigation Development Guide .

    Guidelines for file picker dialog boxes Allow users to start browsing from an appropriate default folder. If the application does not have a default folder and a

    media card is inserted in the BlackBerry device, allow users to start browsing from the root folder. If the application supports different file types and a media card is inserted in the BlackBerry device, allow users to start

    browsing from /Media Card/BlackBerry. If the application supports different file types and a media card is not inserted in

    the BlackBerry device, allow users to start browsing from /Device Memory/home/user.

    Reminder dialog boxesUse reminder dialog boxes to remind users of time-sensitive activities such as appointments or tasks.

    37

    UI Guidelines Progress indicators

    http://docs.blackberry.com/en/developers/deliverables/11958/Create_a_date_picker_856987_11.jsphttp://docs.blackberry.com/en/developers/deliverables/11958/Create_a_file_picker_856986_11.jsp
  • 8/9/2019 Blackberry Smart Phones US

    40/89

    Include a Snooze button that users can click to receive another reminder at a later time and a Dismiss button to dismiss thereminder. To dismiss the reminder, users press the Escape key. To close a reminder dialog box, users click a button or press the

    Escape key. Reminder dialog boxes include an indicator that represents the application that generated the reminder.

    Status dialog boxesUse status dialog boxes to indicate to users that a process is occurring. When a status dialog box appears, users cannot performother actions. Status dialog boxes include a clock indicator for the Precision theme or an hourglass indicator for the Dimension

    theme.

    Best practice: Implementing status dialog boxes Use a status dialog box when you cannot determine the duration of an operation. If you can determine the duration of the

    operation, use a progress bar instead. Always indicate progress when the operation takes more than 1 second to complete. Do not include buttons in a status dialog box. If users can perform other actions when the status dialog box appears, consider

    using another type of dialog box. Punctuate the dialog box message with an ellipsis (...).

    Progress indicatorsUse progress indicators to indicate the status of an operation. There are two types of progress indicators:

    38

    UI Guidelines Progress indicators

  • 8/9/2019 Blackberry Smart Phones US

    41/89

    Use definite progress indicators when you can determine the duration of an operation. Definite progress indicators includea label to indicate what the operation is and a horizontal bar that fills from left to right as an operation progresses. Apercentage appears in the bar to indicate how much of the operation is complete. In the browser, progress indicators alsoindicate the number of kilobytes out of a total number of kilobytes that a BlackBerry device has downloaded. To hide adefinite progress indicator, users press the End key. If users press the End key, the operation continues, but users can performother tasks at the same time.

    Use an indefinite progress indicator when you cannot determine the duration of an operation. You can indicate progressusing a status dialog box or by using an animated clock cursor for the Precision theme or an hourglass cursor for theDimension theme. Users cannot perform any other actions while an application displays an indefinite progress indicator.

    Definite progress indicator Indefinite progress indicator

    Best practice: Implementing progress indicators Always indicate progress when an operation takes more than 2 seconds to complete. Use a definite progress indicator when you can determine the duration of an operation. Use an indefinite progress indicator when you cannot determine the duration of an operation. Use the GaugeField class to create progress indicators. For more information about creating progress indicators, see the

    API reference guide for the BlackBerry Java Development Environment and theBlackBerry Java Application UI and Navigation Development Guide .

    Always allow users to use the End key to hide a definite progress indicator.

    Provide useful progress information. For example, if users are loading a web page, indicate the amount of data that theirBlackBerry device has loaded (for example, 8 KB of 10 KB). If they are downloading applications to their device, indicatethe progress as a percentage. Be as accurate as possible with the progress information.

    To indicate indefinite progress, use a clock icon for the Precision theme or an hourglass icon for the Dimension theme. Use a status dialog box to indicate indefinite progress when you can provide a meaningful message about the operation

    that is in progress. To indicate garbage collection, use the animated clock cursor for the Precision theme or an animatedhourglass cursor for the Dimension theme.

    39

    UI Guidelines Wizards

  • 8/9/2019 Blackberry Smart Phones US

    42/89

    Where possible, inherit the visual style of the theme that users have selected. If your application does not inherit the visualstyle from the theme, try to provide a consistent experience for your users.

    Guidelines for labels Use a concise, descriptive label (for example, "Loading data" or "Building an application list"). Use sentence case capitalization. Punctuate the dialog box message with an ellipsis (...).

    Related topicsStatus dialog boxes, 38

    WizardsUse a wizard to simplify a series of complex steps or to order tasks that have dependencies, such as the steps that users must perform to set up an application. Wizards can help users make decisions if they do not have the background knowledge to completea task.

    Best practice: Designing wizards Use wizards judiciously. Instead of designing a wizard, try to make your application as user friendly as possible. Include a table of contents in wizards. The table of contents should provide users with a list of all the steps or screens in

    the wizard. If users close a wizard, they can use the table of contents to return to the appropriate location in the wizard. Use the title bar to identify the current screen. Center the title horizontally in the title bar. Include instructions for users at the top of each wizard screen. Include default values or settings for controls where possible.

    Use "Next" as the default menu item in the full menu and the context menu. Avoid including Select in the context menu. Users can accidentally remain in Select mode. Allow users to move the focus to the UI controls on the screen. Avoid allowing users to move the focus to a read-only text area. If you are designing for the Dimension theme, include a progress indicator that indicates the current step out of the total

    number of steps. If you are designing for the Precision theme, do not include a progress indicator. Save changes as the u ser progresses through each screen of a wizard.

    Guidelines for buttons

    40

    UI Guidelines Wizards

  • 8/9/2019 Blackberry Smart Phones US

    43/89

    Include a Next button to allow users to move to the next screen in a wizard. This button should be selected by default. Donot include a Next button on the last screen of a wizard.

    Include a Back button to allow users to move to the previous screen in a wizard. Do not include a Back button on the first screen of a wizard.

    Include a Finish button on the last screen of a wizard. Include a Close button to close the wizard. When users close a screen in the wizard, the application should save any changes

    and return users to the table of contents screen.

    41

    UI Guidelines Controls

  • 8/9/2019 Blackberry Smart Phones US

    44/89

    Controls 5

    ButtonsUse buttons to allow users to perform an action from a dialog box. Menus typically include actions that are associated with a screen.

    Users can perform the following actions with a button:

    Action BlackBerry devices without a touch screen BlackBerry devices with a touch screenHighlight a button. Roll the trackwheel or trackball.

    Slide a finger on the trackpad.

    Touch the button lightly.

    Perform an action. Click the button or press the Enter key. Click the screen.

    Best practice: Implementing buttons Avoid using buttons on an application screen. To provide actions that are associated with a screen, use the application menu

    instead where possible. The menu is available to users immediately, regardless of the position of the cursor on the screen.Buttons are static and require users to highlight the button to perform the associated action. If you use buttons, includemenu items for the actions in the application menu as well.

    Use check boxes or option buttons for options such as turning on or turning off a feature where possible. Use the ButtonField class to create buttons. For more information about creating buttons, see the API reference guide

    for the BlackBerry Java Development Environment and theBlackBerry Java Application UI and Navigation Development Guide . For the default button, use the button that users are most likely to click. Avoid using a button that is associated with a

    destructive action as the default button.

    Guidelines for labels Use clear, concise labels.

    42

    UI Guidelines Check boxes

  • 8/9/2019 Blackberry Smart Phones US

    45/89

    Use one-word labels where possible. The size of a button changes depending on the length of the label. If a label is toolong, an ellipsis (...) appears to indicate that the text is truncated. If you do use a label with multiple words, use sentence

    case capitalization. Use verbs for labels that describe the associated action (for example, "Cancel," "Delete," "Discard," or "Save"). If necessary,include more descriptive text elsewhere on the screen (for example, in an application message).

    Avoid using the labels "Yes" and "No." Avoid using punctuation in a label. Use an ellipsis in a button label to indicate that users must perform another action after

    they click the button.

    Check boxesUse check boxes for options that users can turn on or turn off.

    Users can perform the following action with a check box:

    Action BlackBerry devices without a touch screen BlackBerry devices with a touch screen

    Select a check box. Press the Space key or click the trackwheel,trackball, or trackpad.

    Click the screen.

    Best practice: Implementing check boxes Use check boxes when users can select multiple options. Use the CheckboxField class to create check boxes. For more information about creating check boxes, see the API

    reference for the BlackBerry Java Development Environment and theBlackBerry Java Application UI and NavigationDevelopment Guide .

    Do not start an action when users select a check box. For example, do not open a new screen. Align check boxes vertically. Group and order check boxes logically (for example, group related options together or include the most common options

    first). Avoid ordering check boxes alphabetically; alphabetical order is language specific.

    Guidelines for labels

    43

    UI Guidelines Drop-down lists

  • 8/9/2019 Blackberry Smart Phones US

    46/89

    Use clear, concise labels. Verify that the label clearly describes what occurs when users select the check box. Use positive labels where possible. For example, if users have the option of turning on or turning off a feature, use "turn on"

    instead of "turn off" in the label. Place labels on the rig