Review: The Elements of User Experience by Jesse James Garrett

I still consider myself very new to the UX world and I did read a few articles pertaining to the subject, but this was my very first book about UX design for the web, specifically. If you are getting into UX, like myself, this is an excellent read when first starting out.

Garrett discusses how successful interactive product design requires more than good code and nice graphics; UX designers must also “fulfill strategic objectives while meeting users’ needs." 

User experience, Garrett defines as the "experience the product creates for the people who use it in the real world.” The difference between a successful product and an unsuccessful one depends upon whether a designer makes sure to spend time considering the product’s users. User experience deals with the outside of the product, how a person comes into contact with it. Garrett brings up a good point when he says typically, when people think about product design, they think of aesthetics (how it looks, feels, etc.) and/or functionality (if the product does what it’s supposed to do), and don’t look beyond. There is so much more to product design.

User-centered design, or the practice of creating efficient, engaging user experiences, is brought up in this book frequently, among the Elements of User Experience. The Five Planes are:

-The Surface Plane (images and text, what you click on, etc.)
-The Skeleton Plane (placement of buttons and blocks of text, etc.)
-The Structure Plane (define how users got to __ page and where they go next, etc.)
-The Scope Plane (what do certain features/ functions do, etc.)
-The Strategy Plane (what do creators AND users want out of site?)

Garrett encourages people to work from bottom to top (Strategy to Surface), as the ideas start abstract and become more concrete. Issues starts fairly basic and become more specific and detailed the higher we go. 

Above is the layout of the five planes. Each plane is dependent on the one below it. When we don’t start from the bottom and hash out choices, deadlines are missed, costs go up, and projects become a mess.

Garrett also brings up the duality in the nature of the Web in the user experience community: one group sees problems as an application problem and applied problem-solving approaches from desktop and software worlds; the other group saw the Web in terms of information distribution and retrieval, and applied problem-solving approaches from the publishing, media, and information science worlds. Garrett suggests splitting the five planes straight down the middle to deal with this issue: one side as functionality and the other as an information medium.

Lots of information, all in the first 27 pages. But it does make more sense as you read along. I found myself struggling somewhat with the lower planes, as I tend to think of myself as more of a “visual” person. But I did find them very interesting. Garrett spends time addressing the fact that USERS are so important, and that’s why user research is so important. 

Just like he encourages you to do, Garrett starts with the lower planes and works his way up. The book is filled with lots of diagrams, colorful charts, and even highlights key words (like a school textbook). He goes into depth about each aspect of every plane, both on the functionality side and the information side.

Good user experience is good business. If a user has a bad experience with your product, they won’t come back. Garrett also discusses return on investment and conversion rate when proving that good user experience results in good business. 

User experience design is just solving a very large collection of little problems. One should approach user experience with two basic ideas, Garrett says:
1. Understand what problem you’re trying to solve.
2. Understand the consequences of your solution to the problem.

The topics addressed in this book are thought-provoking and should be considered by anyone concerned with (or who should be concerned with) user experience. I’m very glad I read this book early into my UX experience. Reading this shortly after finishing The Design of Everyday Things helped to solidify certain ideas that poor design is not something to accept or tolerate; successful user experience design should be acknowledged or, preferably, invisible. This book has helped me to understand that UX is not just dealing with color schemes and button placement and user research. There is so much more that needs to be examined and hashed out if the users are to actually be considered when designing a product.

My Rating: 5/5. Get the book here.

*Photos are not mine.

The Elements of User Experience by Jesse James Garrett

The more complex the product, the more difficult it is to deliver a successful experience to the user. For example, you can add 100s of buttons to a phone and make it impossible to use

The website or mobile app is a self service product.

User centered design - practice of creating engaging, efficient user experiences.

The five plans of user experience
1. The surface plane - we see a series of web pages or screens made of images
2. The skeleton plane - placement of buttons, controls, photos and blocks of text. Designed to optimize the arrangement of these elements for maximum effect and efficiency
3. The structure plane - skeleton is s concrete expression of the more abstract structure of the site. Structure defines flow of user through pages
4. The scope plane - the structure defines the way the various features and functions fit together. Scope decide which should be included in the first place.
5. The strategy plane - this incorporates business goals and user goals

Product as functionality and product as information - the web has products people use but also products people get information from

On functionality side - we are concerned with tasks. We consider the product as a tool the user employs to accomplish a Task.

On information side, what info the product offers.

1. Strategy: user needs need to balance with product objectives
2. Scope:: functional specifications vs content requirements
3. Structure: interaction design - how the system behaves in response to user vs information architecture- arrangement of content to facilitate understanding
4. Skeleton: info design for both. Then interface design vs navigation design
5. Surface plane: sensory experience for both

The Strategy plane:
Product objectives -what do we want to get out of this product?
User needs: what do our users want to get out of it?
• Do we have segments of users? Can we create personas and optimize for them via user testing?

The Scope plane:
Functional specifications - scope of specs that we are going to create.
• be specific when creating specs - videos with most views will appear on top of the list vs. most popular videos will be highlighted

Content requirements - what content? How often updated? What about content implications of using the product - help? Error messages?

The Structure Plane
Interaction design:
• Conceptual models - user’s impressions of how the interactive components we create will behave. For example, conceptual model for a shopping cart is the container. And, popular conceptual models become conventions.
• Error handling

Information architecture
• basic unit is a node
• Nodes can be organized sequentially, in a hub and spoke model, organically etc.
• information can be organized based on metadata - info and tags about the information

The Skeleton Plane
Interface design - providing users the ability to do things. Clearly shows what is important and what is not and clearly tells the user what to do - checkboxes vs drop downs vs text boxes
Navigation design - providing users the ability to go places. where are they now and where can they go? Many ways to do this - global, local, contextual (links within content), courtesy (hours of operation for a business)
Information design - communicating ideas

Wayfinding. Help users clearly understand where they are and where they can go

Wireframes. Integrate interface design thought arrangement of elements, navigational design through identifying core navigational systems and information design through placement and prioritization of informational components

The Surface plane.
Sensory design - smell and taste, touch (vibration), hearing, vision)

Eye tracking can be used to figure out if vision movement is smooth.

Uniformity matters. So create a wireframe with all the colors, typography, etc., working together - document all of this into a style guide

2 basic ideas that can define success or failure
• understand what problem you are trying to solve
• Understand the consequences of your solution to the problem

The Five Planes of User Experience

These are the five planes Jesse James Garrett uses in his book “The Elements of User Experience” to describe the user experience design process:

  • The Surface Plane: A series of web pages, made up of images and text.
  • The Skeleton Plane: The placement of buttons, controls, photos, and blocks of text.
  • The Structure Plane: Define how users got to each page and where they can go in any moment.
  • The Scope Plane: The features and functions of the site.
  • The Strategy Plane: Incorpores what the people running the site want and what the users want to get out of the site.

This structure builds from bottom to top. That means that the surface depends on the skeleton, the skeleton depends on the structure and so on. To put it in another way, we must start from the strategy plane and continue to the surface. As we advance in this process, the issues become a little less abstract and a little more concrete.

One way to evaluate the visual design of your product is to ask: Where does the eye go first? What element of the design initially draws the users’ attention? Are they drawn to something important to your product’s strategic objectives? Or is the first object of their attention a distraction from their goals (or yours)?
—  The Elements of User Design by Jesse James Garrette
For sites that depend on advertising revenue, impressions - the number of times each day an ad is served to a user - is an incrediblely important metric. But you have to be careful. Adding several layers of navigational pages between the home page and the content users want will definitely increase your ad impressions, but is it serving user needs? Probably not. And in the long run it will show: as your users get frustrated and decide not to come back.
—  The Elements of User Design by Jesse James Garrett