hamburger menu


Using Garrett’s 5 Planes of User Experience in Web Design

When designing a website, it is important to think through every possible way that users will be interacting with the website. The way they interact with the website is highly dependent on the way it is built. This might sound like a complicated process, but by breaking the process down into its core elements, we can understand it better. Thankfully, Jesse Garrett, an information architect, came up with a principle called Five Planes of User Experience.

Screen Shot 2017-07-19 at 3.49.02 PM

Screen Shot 2017-07-19 at 3.50.44 PM

Although this is the most abstract one of the five planes, a strategy should be decided at the very beginning because it represents the goals and objectives of the UX that we want to achieve. You must be able to articulate the problem you are trying to solve and the user’s needs.

Screen Shot 2017-07-19 at 3.51.34 PM

In this plane, you identify the content, features, and functions that are going to be used in your product. This allows you to address potential issues right at the beginning.

Screen Shot 2017-07-19 at 3.52.08 PM

In this plane, you focus on defining how the various features of your product fit together.It is important to define how users interact with your product’s functions and to focus on giving the right information to the user.

Screen Shot 2017-07-19 at 3.52.55 PM

In this plane, you focus on the arrangement of buttons, text, images, etc. The purpose of this plane is to optimize the placement of these elements for maximum efficiency.

Screen Shot 2017-07-19 at 3.53.31 PM

The surface plane is what we can see with our eyes at the first moment. You should focus on appearance and the visual design of the product.

5 Planes of User Experience in Web Design

At Brand & Mortar, our website design Toronto team apply this method when designing websites. Thinking about these five planes helps us focus on our website goals and creating a pleasant user experience.


Sign up to get
insights in your inbox

Leave a Reply

Your email address will not be published. Required fields are marked *

We know that transparency is non-negotiable and that strong communication is the foundation of any great relationship. With the knowledge and expertise at Brand & Mortar we are confident that we can make an impact on your business and its bottom line.


31 Powerhouse St. Suite 203
Toronto, ON. M6H 0C7
416 729 1154





Digital Agency Network

With growing global concerns around COVID-19, the health and safety of our employees and clients is top of mind. Brand & Mortar services will remain open while our team works remotely until further notice. We want to assure our trusted clients that business will remain unchanged while we do our part to #FlattenTheCurve.

For more information, please read our formal statement here.