Visual Design
🌲

Visual Design

Each item has a relevant description & examples.

🌲
Visual hierarchy leads users to the required action
High
🌲
The most important items are on top of the visual hierarchy
High
🌲
Alert messages are consistent
High
🌲
The primary actions differ visually from the secondary actions
High
🌲
Confirmation of form submission is visually distinct
High
🌲
There is progress indicator for multi-step workflows
High
🌲
Information on the page is arranged according to F- or Z- pattern
High
🌲
The contrast of the main text is not less than 4,5:1
High
🌲
Hierarchy, content or functionality are conveyed not only through color
Middle
🌲
Foreground elements (like content and controls) stand out from the background
Middle
🌲
There are no more than three primary colors on the page
Middle
🌲
Interactive elements are familiar to users
Middle
🌲
Alert messages stand out visually
Middle
🌲
Website demonstrates proximity and alignment
Middle
🌲
Capital letters (CAPS) are not overused
Middle
🌲
Too long or too short lines are not used
Middle
🌲
Similar information and functions are grouped in blocks
Middle
🌲
The size of clickable elements and the distance between them are enough to prevent accidental clicks
Middle
🌲
There are no more than 3 typefaces (including title) per page
Middle
🌲
There is enough space between information blocks
Middle
🌲
It is visually clear which menu blocks the menu elements belong to
Middle
🌲
On any page, users can see the most relevant information without scrolling
Middle
🌲
There is a strict hierarchy of headings, subheadings and main text
Middle
🌲
Website content (fonts, images, illustrations) looks integral and reflects a certain idea
Middle
🌲
The font which is used on the website is readable
Middle
🌲
There are no more than 3 font sizes on the page
Middle
🌲
Active objects are visually clickable, while inactive ones don't prompt to click
Low
🌲
Names of fields and text in the fields are visually different
Low