Hierarchy of Information Remains Critical

 

Users do not read. They glance; skipping around the page looking for key words / phrases, things that are familiar to them, or things that stand out.

I’m paraphrasing from Krug’s seminal “Don’t Make Me Think.”

Heat maps confirm Krug’s assertion to be true. It is also true, however that users, during a specific phase of researching, tend to read more and read in a linear / timeline fashion. Because of this, it is critical that a single-page website must BOTH be able to be read in a linear format while having good hierarchy and visual acuity to support glance rate.

With this project, we started with a general page outline that identified the key messages defined in the creative brief. Over time, we learned however that as the content was generated the layout was not supporting both strategies at the same time. As a result, working with the content writer, marketing team and design team, we re-architected the page layout to make the information easier to consume.

The below images show how we progressed from the initial wire frames, into the first design iteration, and finally into a more comprehensive design that we believe strategically supports all of the user type’s goal(s) when visiting the website.

 

initial page wire frame
Image 1: Initial wire frame based on creative brief

 

intermediate website design
Image 2: First Design iteration; we determined a need for better information hierarchy

 

final website design with information hierarchy
Image 3: A more comprehensive design that supports both linear reading and glance acuity

 

ROLE: UX Strategy
TEAM: Matthew Luken & Nathan Diebel