10-minute UI Evaluation Cheatsheet v1

Updated on June 18, 2022

Name Category

1. Do you use an obvious vertical rhythm? Space & Size

2.. Do you use a consistent grid? Space & Size

3. Do your components use a consistent box model? Space & Size

4. Do your components scale relatively or independently? Space & Size

5. Do you use borders appropriately? (input fields, tables, content cards) Space & Size

6. Do you create depth consistently? (shadows, z-index properties) Space & Size

7. Do you provide visual weight to headlines and display text? Visual Hierarchy

8. Is your content F-pattern or Z-pattern scannable? Visual Hierarchy

9. Do you separate your navigation types? (system, product and context) Information Architecture

10. Do you provide a natural breadcrumb? Information Architecture

11. Do you use progressive disclosure appropriately? Information Architecture

12. Do you appropriately label affordances? Information Architecture

13. Do you group like-actions and information? Information Architecture

14. Do you use 2 or less typefaces with at least 3 weights? Type

15. Do you use a consistent type scale? Type

16. Do you limit copy to 2-3 sentences? Content

17. Do you use a consistent title or sentence case? Content

18. Do call-to-actions use VBU (verb + benefit + urgency)? Content

19. Do you violate WCAG 2.0 AA contrast ratios? Color

20. Do you have a color that tells me where I can go? (Hyperlinks, buttons) Color

21. Do you have a color that tells me where I’m at? (Active tabs, highlighted rows) Color

22. Do you have consistent empty states? Interactions

23. Do you execute animations within 450ms? Interactions

24. Do you provide appropriate system messages for all possible paths? (error handling) Interactions

25. Do you require double opt-in for destructive actions? Interactions

26. Do you use primary and secondary buttons consistently? Interactions