Design Hierarchy

by Joseph on the 29th Jul 2023

Design Hierarchy is not Visual Hierarchy; they are two different things. Design Hierarchy is the process by which a document is created by using systematic steps and pre-defined fundamental guidelines.

When I create a document, I use the following Design Hierarchy:

  1. Margins – Set up document margins
  2. Grids – Set up grid structure in a column or modular grid
  3. Research
    • Understanding the message
    • Talking to product owners
    • Verifying requirements or brief
    • Looking at similar examples
    • Understanding the user
  4. The Hero – A single focal point or the hook on the document. It can be a large image or text;
    it’s something that grabs attention and makes it memorable.
  5. Content Flow – Organising content around or strategically around the focal point to follow a flow, preferably to a CTA (Call to action) like a contact us button.
  6. Negative Space – Declutter the design keeping it simple and allowing for breathing room around elements to enable the user to navigate through the document with ease visually.
  7. Repetition – Connecting design aspects to a unifying element, such as shape or colour.
  8. Test – Test the design for:
    • Consistency
    • Typos
    • Mistakes
    • User perception
    • User journey

Categories