Designing a UI for different screen sizes

Best practices for BlackBerry smartphones with a physical keyboard

Optimize layouts

  • Make sure that layouts scale across devices. Use dock and stack layouts so that layouts scale automatically. If you created custom layouts for the BlackBerry 10 Dev Alpha or use fixed or absolute layouts, you will likely need to manually adjust the sizes and positions of your UI components to fit different screen sizes.
  • Pay attention to background bitmaps and assets that use the full width of the screen. If you create custom bitmaps and assets for all-touch smartphones, you might need to scale those assets by 94% for smartphones with a physical keyboard.
  • Don't create landscape views for smartphones with a 1:1 aspect ratio unless you have a good reason to use landscape view.

Focus on content and primary tasks

  • Make sure that the most relevant information is visible. Adjust the initial scroll position of views so that the most relevant information is in focus. Alternatively, you can restructure the layout so that less important information appears at the bottom of the view.
  • Optimize screen real estate. As users scroll, consider allowing UI components such as title bars to scroll out of view. If you're designing an immersive application, such as a video player, where users typically stay in the application for a significant period of time, chrome (UI components) should disappear from the screen after a few moments of no interaction and reappear when a user starts interacting with the screen again.
  • Make UI components semi-transparent if they overlap with content such as pictures. This approach allows users to focus more on the content instead of the chrome.

Optimize keyboard use

  • Use shortcut keys to give users direct access to common actions for a specific screen. For example, allow users to press "T" to move to the top, "C" to compose a message, "S" to search, "I" to zoom in, and "O" to zoom out.
  • Use the keyboard for direct action. For example, set focus on a field so that users can just start typing.
  • Don't force users to switch between using the keyboard and the touch screen. Allow users to use the keyboard to complete a task.

Optimize battery life

BlackBerry smartphones with a physical keyboard have an OLED screen. Following the best practices below helps to optimize battery life.

  • Adapt your color scheme. Bright colors and UI components in a static position (e.g. title bars and action bars) have a tendency to burn out pixels quicker. The darker an image is, the less power it uses. Can you use a black theme? Can you adjust light backgrounds to use less power and still preserve readability?
  • Consider removing subtle patterns and textures. Use pure black where possible.

Was this information helpful? Send us your comments.