🌲

Visual Design

Move cards into the appropriate 'YES' or 'NO' columns. Each card has a relevant description & examples.

NamePriorityStatusSubmitted to work
🌲Alert messages are consistentHigh
🌲Visual hierarchy leads users to the required actionHigh
🌲There is progress indicator for multi-step workflowsHigh
🌲The primary actions differ visually from the secondary actionsHigh
🌲Confirmation of form submission is visually distinct High
🌲Information on the page is arranged according to F- or Z- patternHigh
🌲The most important items are on top of the visual hierarchyHigh
🌲The contrast of the main text is not less than 4,5:1High
🌲Website demonstrates proximity and alignmentMiddle
🌲Interactive elements are familiar to usersMiddle
🌲It is visually clear which menu blocks the menu elements belong to Middle
🌲There is a strict hierarchy of headings, subheadings and main textMiddle
🌲Alert messages stand out visuallyMiddle
🌲There is enough space between information blocksMiddle
🌲There are no more than 3 font sizes on the pageMiddle
🌲On any page, users can see the most relevant information without scrollingMiddle
🌲Website content (fonts, images, illustrations) looks integral and reflects a certain ideaMiddle
🌲Foreground elements (like content and controls) stand out from the backgroundMiddle
🌲Similar information and functions are grouped in blocksMiddle
🌲Too long or too shot lines are not usedMiddle
🌲The font which is used on the website is readableMiddle
🌲Hierarchy, content or functionality are conveyed not only through colorMiddle
🌲Capital letters (CAPS) are not overusedMiddle
🌲There are no more than 3 typefaces (including title) per pageMiddle
🌲The size of clickable elements and the distance between them are enough to prevent accidental clicksMiddle
🌲There are no more than three primary colors on the pageMiddle
🌲Active objects are visually clickable, while inactive ones don't prompt to clickLow
🌲Names of fields and text in the fields are visually differentLow