A common slip-up we find on some of the apps that we review is the use of illegible fonts, items too close to each other or items too small to be easy to touch. In the first case the outcome is obvious, the user will not be able to read the text or it will be very difficult to. In the second and third case, the result will be hitting the wrong target.
Minimum text size
Size and placement of typographical elements are key to forming the screen layout. By now, I’m sure you know that one of the Metro principles shaping the foundation of the WP7 visual style is the lack of chrome elements. Lack of chrome gives the size of core elements, such as text, more importance than in any other platform. Those typically use additional elements like borders and frames to craft the layout of content. Make sure you use different font size, color or style to create the needed hierarchy on screen so the user can identify easily primary and secondary tasks. Our minimum size recommended for body text on the WP7 platform is 15 points.
Ideal hit target size
Designing for touch is a complex balance between size, spacing and visuals. Achieving this balance reduces what is known as “Index of Difficulty in target acquisition”.
Click the graph below for our guidelines on proper target sizes.
If target size guidelines cannot be followed, due to space and task constraints, consider the following to influence your design.
· Shape
· Location
· Frequency of use
· Task context
· Visual Design (padding/spacing)
· Error consequence
Special attention should be given to “frequency of use,” or how often the screen is used in a specific task. When defining the proper size for UI elements, consider the importance of each task. Mundane tasks (checking email) should require less attention from the user, as opposed to infrequently performed tasks (changing settings on your device).