Top 9 Mobile UI Dos & Don’ts

1. Formatting Content

  • Create a layout that fits the screen of the device.
  • Users should see primary content without zooming or scrolling horizontally.

Formatting Content

2. Touch Controls

  • Use UI elements that are designed for touch gestures to make interaction with your app feel easy and natural.

Touch Controls

3. Hit Targets

  • Create controls that measure at least 44 points x 44 points so they can be accurately tapped with a finger.

Hit Targets

4. Text Size

  • Text should be at least 11 points so it’s legible at a typical viewing distance without zooming.

text size5. Spacing

  • Don’t let text overlap. Improve legibility by increasing line height or letter spacing.

Spacing6. High Resolution

  • Provide high-resolution (@2x) versions of all image assets.
  • Images that are not @2x will appear blurry.

High Resolution

7. Distortion

  • Always display images at their intended aspect ratio to avoid distortion.

Distortion8. Organization

  • Create an easy-to-read layout that puts controls close to the content they modify.

Organization9. Alignment

  • Align text, images, and buttons to show users how information is related.
download pdf button

, , , , , ,
Previous Post
Behavior Driven Development/Testing (BDD)
Next Post
Web UI Dos and Don’ts