Design Guidelines

Design Guidelines
The user interface guidelines for Windows Mobile 6 Professional and Windows Mobile 6 Classic assist you in developing Windows Mobile powered applications that provide a good user experience.
In This Section
Accessibility and Ergonomic Guidelines
Outlines the guidelines for developing an accessible user interface.
Home and Today Screen Guidelines
Describes the information the user might want instant access to, and ways to display it when the component is selected.
Mobile Web Site Design Overview
Some general guidelines on how to optimize your Web site design for Internet Explorer Mobile.
Navigation Guidelines
Describes the various views (list view, summary view, and edit view). and provides recommendations for using them.
Screen Rotation Guidelines
Describes practical approaches you can take to create screen layouts that accommodate portrait, landscape, and square.
Soft Key and Menu Guidelines
Describes the role that Soft Keys play in the user interface, and how to properly implement them in your applications.
Usability Guidelines
Provides a checklist to help you confirm that your application's user interface meets usability requirements.
User Interface Control Guidelines
Provides guidelines for user interface (UI) controls.
User Interface Text Guidelines
Provides guidelines for designing user interface text.
Acronyms and Terminology Guidelines
8/28/2008
You can help users learn more quickly by using terminology that is clear, consistent, and familiar. Avoid jargon such as "screen real estate" and "reboot."
Note:
|
Translating jargon increases localization time and costs.
|
When using acronyms, follow these guidelines:
Confirm that the acronym isn't already being used to represent a different phrase or name.
To conserve user interface space, do not spell out acronyms.
Determine whether the acronym will be problematic in languages other than English.
Geopolitical-Ready and Localized Text Guidelines
Apply the following geopolitical guidelines to the user interface text:
Always use the term country/region instead of the word country.
Always use the term capital/major city instead of the word capital.
Be cautious when using an untranslated trademarked term from the United States because it might be interpreted as an offensive or otherwise undesirable term in another language.
Apply the following localization guidelines to the user interface text:
Use terminology, punctuation, acronyms, and capitalization consistently.
Avoid idioms, jargon, colloquialisms, abbreviations, acronyms, and metaphors whenever possible.
Avoid long compound sentences with multiple nouns because they are difficult to translate.
Use descriptors wherever possible.
When using punctuation, take into account that other languages have different rules.
Localizing English text usually increases the length of the text, which may affect the layout of controls. As needed, use standard abbreviations and rephrase text to ensure that it fits on the screen.
The following illustration shows the difference in text length when the same content is localized in three different languages.
Error and Informational Message Guidelines
Follow these guidelines when you write error messages and informational text:
Identify the problem, indicate the cause if helpful, and provide a solution if possible.
Write phrases instead of complete sentences to conserve space. For example, write "Save using a different name" instead of "Save this document using a different file name."
Use title caps in the title bar of the message box and sentence caps in the message body text.
Title caps rules specify that all words are capitalized with the exception of articles, coordinating conjunctions (and, but, for, not, or, so, and yet), and prepositions containing four or fewer letters.
Sentence caps rules specify that only the first word and any proper nouns are capitalized.
Bold command names instead of using quotation marks.
When there may be a consequence of a user's action, preface the error message with the word "Warning." For example, write "Warning: If you synchronize now, duplicate items may appear in your Inbox."
Do not use exclamation points.
Do not write content that implies that applications can think or feel.
Avoid using the word please. Also, use the following alternative terms for abort, boot, and reboot.
-
Instead of
|
Use
|
Abort
|
End, quit, or stop
|
Boot
|
Start or switch on
|
Reboot
|
Start
|
User Interface Text Guidelines
The topics in this section provide guidelines for the design of user interface text. Because of the limited amount of screen space available on most Windows Mobile powered devices, it's extremely important minimize the amount of textual information displayed on the device. In addition, mobile professionals don't have a lot of time or desire to read large amounts of text to accomplish specific tasks. When writing user interface (UI) text for Windows Mobile powered devices, consider the following questions:
Is the user interface text clear, concise, and contextually relevant for the audience?
Does the text consistently follow the style, terminology, and tone and voice specified for the product?
Does the text follow localization and geopolitical guidelines?
User Interface Text Checklist
When writing UI text for Windows Mobile powered devices, use the guidelines in the following checklist:
Use clear terminology.
Avoid technical jargon and colloquialisms.
Use as few words as possible without losing the meaning.
Use one term consistently for all concepts that have the same meaning.
Avoid negative and politically sensitive terms.
Write active sentences.
When writing instructional text, present the result before the required action. For example, "To begin importing contacts, click Next."
Allow for at least 30 percent text expansion for localization.
Follow the Mobile Devices Product Group capitalization and punctuation guidelines.
Make sure UI command labels match labels for the UI they open.
Write informative error messages.
Ask an editor to review all UI text.
Capitalization and Punctuation Guidelines
The following table indicates the type of capitalization you should use for user interface (UI) controls.
Title capitalization specifies that all parts of speech are capitalized, with the exception of articles, coordinating conjunctions (and, but, for, not, or, so, and yet), and prepositions containing four or fewer letters. Sentence capitalization specifies that only the first word and any proper nouns are capitalized.
Title capitalization
|
Sentence capitalization
|
Button label
|
Check box label
|
Header
|
Combo box label
|
Menu label
|
Drop-down list items
|
Menu command label
|
Error message text
|
Option button label
|
Instructional text
|
Pop-up menu command
|
List box label
|
Split button label
|
Option button label
|
Soft key label
|
Progress bar label
|
Tab label
|
Slider label
|
Text header
|
Text box label
|
Toolbar buttons
|
Drop-down list label
|
Screen tip
|
Text sub header
|
Tree view label
|
Time picker label
|
Window, dialog box, and error message titles
|
|
The following table indicates standard rules of punctuation for UI controls.
Mark
|
Usage
|
Colon (:)
|
In most cases, labels for controls such as text boxes, drop-down lists, progress bars, and spin boxes end with a colon.
Do not end the label with a colon when the text box or drop-down list is embedded in a sentence or when the drop-down list appears in a main window.
|
Comma (,)
|
In a series of three or more controls, separate the controls with commas.
|
Ellipsis (...)
|
Because of space constraints, ellipsis should be used on Windows Mobile powered PDAs but not on Windows Mobile 6 Standard.
Use an ellipsis at the end of a menu command and at the end of a button command that opens another dialog box instead of performing an action.
Use an ellipsis in a progress bar label to indicate a continuing action.
|
End punctuation (. ? !)
|
Use ending punctuation only in instructional text.
Add only one space after ending punctuation to separate sentences.
|
Usability Guidelines
Use the following checklist to confirm that an application user interface meets basic usability requirements:
Dialog boxes do not contain irrelevant information because it diminishes the visibility of relevant information.
Information appears in a logical order in the dialog box based on the functionality provided. The information is communicated using words and concepts that are familiar to a user. Consider the following to keep the user interface simple and focused:
Place commands for critical features in a prominent area such as a menu.
Place advanced and less-frequently used commands in a less prominent area such as a submenu or settings dialog.
Avoid placing commands redundantly, with the exception of shortcut menu commands on Windows Mobile 6 Professional and Windows Mobile 6 Classic.
Instructions for using an application are visible or easily accessible whenever appropriate. Avoid complicated instructions.
When appropriate, the same user action is consistently used to complete the same application operation.
Consistency is applied to the visual presentation of information, placement of user interface elements, and format, capitalization, and punctuation of user interface text.
Avoid visual noise in the user interface because it distracts users from completing tasks. Visual noise is created by misaligned controls or redundant borders of neighboring controls.
Appropriate feedback is provided to a user within a reasonable time.
Shortcuts for experienced users are provided for completing tasks.
Error messages are provided that concisely explain a problem and contain meaningful suggestions for resolving the problem. For more information, see Error and Informational Message Guidelines.
Whenever possible, the application design prevents errors from occurring.
User Interface Control Guidelines
The following table provides descriptions for user interface (UI) controls. Refer to the linked topics for guidelines and details for each UI control.
UI control
|
Description
|
Check Box Guidelines
|
Use a check box only when it provides choices that are opposite and unambiguous. Otherwise, use option buttons.
|
Combo Box Guidelines
|
Use combo boxes in place of option buttons to conserve space or when the user needs to add entries to a list. (Windows Mobile 6 Professional and Windows Mobile 6 Classic only)
|
Command Buttons Guidelines
|
The command button control causes an application to perform an action when the button is selected. On Windows Mobile 6 Standard devices, only Internet Explorer Mobile has command buttons. All other applications use soft keys.
|
Context Menus Guidelines
|
Context Menus provide an efficient way for the user to access the operations of objects. Whenever actions are available for a specific item, a context menu should be available. (Windows Mobile 6 Professional and Windows Mobile 6 Classic only)
|
Date Pickers Guidelines
|
The date picker control provides a calendar display that enables a user to select a date and display it in a specified format.
|
Expandable Edit Control
|
This control is expanded to full screen when the user presses the ENTER hardware button. (Windows Mobile 6 Standard only)
|
Full Screen Multi-line Edit Guidelines
|
A full-screen multi-line edit (MLE) control is a special type of edit box used to conserve space.
|
Headers Guidelines
|
A header control is used to display a heading above a list view that can also be used for sorting, folder picking, and other list-specific controls. (Windows Mobile 6 Professional and Windows Mobile 6 Classic only)
|
Horizontal Line Separator Guidelines
|
Horizontal line separator elements visually group items on a screen or separate content areas of a screen.
|
Hyperlink Guidelines
|
When you use an HTML control to create a hyperlink, you can take advantage of other aspects of the HTML control such as background images.
|
List Box Guidelines
|
Include a list box to display items a user can select. (Windows Mobile 6 Professional and Windows Mobile 6 Classic only)
|
List View Guidelines
|
A list view control is used to display items in a scrollable list.
|
Developing Menu Components
|
Use menus to consolidate functionality.
|
Menu Bar Buttons Guidelines
|
Frequently used actions can be taken out of menus and placed directly on the menu bar so that they are easily accessible. (Windows Mobile 6 Professional and Windows Mobile 6 Classic only)
|
Mnemonics Guidelines
|
When you assign mnemonics to menu commands, use the first letter of the command name unless another letter provides a better mnemonic association.
|
Option Buttons Guidelines
|
Use option buttons only when they provide mutually exclusive choices and when there are only a few choices. When there are many choices, use list boxes instead. (Windows Mobile 6 Professional and Windows Mobile 6 Classic only)
|
Progress Bars Guidelines
|
A progress bar shows the percent completed for an operation or the percentage of a value.
|
Scroll Bar Guidelines
|
A scroll bar allows users to view all information on a page, even when not all of the information appears on the screen at the same time.
|
Shortcut Key Guidelines
|
The functionality of the shortcut keys in your application should be consistent with shortcut keys in other applications to ensure a consistent user experience. (Windows Mobile 6 Professional and Windows Mobile 6 Classic only)
|
Sliders Guidelines
|
A slider control is used to set or adjust values within a range. (Windows Mobile 6 Professional and Windows Mobile 6 Classic only)
|
Spin Boxes Guidelines
|
Spin boxes conserve space and provide an alternative to list boxes and combo boxes.
|
Split Buttons Guidelines
|
A split button is used to create a button with an attached menu with secondary functions and options. (Windows Mobile 6 Professional and Windows Mobile 6 Classic only)
|
Tabs Guidelines
|
Use tabs in an application to group related information and functionality. (Windows Mobile 6 Professional and Windows Mobile 6 Classic only)
|
Text Boxes Guidelines
|
The text box control provides basic user text input and editing support.
|
Text Headers Guidelines
|
Use text headers to provide context for wizards, context for full-screen dialog boxes that contain settings or options, and instructions for picker dialog boxes. (Windows Mobile 6 Professional and Windows Mobile 6 Classic only)
|
Text Guidelines
|
To conserve space, use text subheaders instead of group boxes to visually group items on a screen. Also, use text subheaders to clarify application data and functionality. (Windows Mobile 6 Professional and Windows Mobile 6 Classic only)
|
Time Pickers Guidelines
|
Time pickers enable users to set the time, including the hour, minutes, and AM or PM options.
|
ToolTips Guidelines
|
A ToolTip is a small pop-up window that displays the name of a Windows Mobile powered menu bar button. (Windows Mobile 6 Professional and Windows Mobile 6 Classic only)
|
Tree View Guidelines
|
A tree view control is a special type of list box that displays the hierarchical relationship of items.
|
Upper case keyboard selection
|
On a QWERTY keyboard, you can allow the selection of upper case (capital) letters by a long press on the letter key, as well as by pressing Shift and then pressing the letter. Overriding keys in this manner must not affect any other key pressing requirements.
|
|