The Elements of User Experience – J.J. Garrett

Rachel Rose with the book The Elements of User Experience.

The Elements of User Experience by J.J. Garrett proved a stimulating and thought-provoking text book which gave substance to my UX Design Course. I loved the book, and made time almost every evening to read a few pages. Upon awakening, I would try to remember what I had read the night before.

Studying is a slow and steady quest. Rarely can I dedicate large chunks of time to my course, but I chug along. I could have rushed into Part Two of the course, Start the UX Design Process: Empathize, Define and Ideate. But, I thought it wiser to buy the two books referenced in Part 1 and thus gain a more solid footing in the material. (The other book is The Design of Everyday Things. More on that later…)

UX

User Experience (UX), like many things tech-related, is a relatively nascent field. As we have broadened and deepened our relationship with technology, we have become more discerning and habitual in the way that we wish to interact with the tech. Making the user adapt to the company’s or the programmer’s vision (or bias) is no longer acceptable. It is a sure path to ruin in today’s competitive online market.

Enter UX. Twenty-five years ago, with insensitive regularity, tech savvy folks would sniff that “the user just has to adapt to the interface”. Since then, certain standards have been established that make information design and interface design more predictable and, well, usable. After all, that’s it: what we want to achieve with UX is a usable site that aligns with the product objectives.

The 5-Elements UX Model

Garrett identifies 5 User Experience planes: Strategy, Scope, Structure, Skeleton, Surface. The Elements of User Experience is a model that accommodates both information and interface design.

The author begins by explaining that the two points of view are opposite but equally necessary. Those who look at the Internet as a big database, who think mostly about the search for and delivery of information, view web development from one perspective. Those who see the Internet as more of an “app”, as something that lets you do something, contemplate it from another perspective. JJ Garrett came up with a model that serves both standpoints.

The Elements of User Experience

The UX 5 Elements Model (graphic)

This image is adapted from Garrett’s original work (2010)

A full description of the theory and application of the Elements of User Experience Design is well beyond the scope of this post. What I hoped to do is comment on a few things about the book and the course.

Takeaways from The Elements of User Experience

First of all, it is perfectly possible to do the UX Design Course and not read this book. I undertook this as an extracurricular activity and am I ever happy that I did. The course description of the five elements of UX is more than adequate. But, the book gave history, breadth and depth to the subject.

Secondly, Garrett is extremely good at defining common terms. It can be easy to think that you know the difference between interface design and information design, but some assumptions are not always true. Furthermore, it is good to challenge your own understanding. I feel much more confident now in distinguishing between the different parts of a web site or app.

Thirdly, reading this book helped me to perceive a bias that I did not know I had: I am an information person and have always approached the Internet from that perspective. Despite being a lover of pretty things, I was always thinking about the information. I discovered that bias whilst reading this book and now look at UX Design from a different perspective.

Fourthly, there is some Google bias in the UX Foundations Course. This is a criticism that I had seen levelled at the course, so was looking out for it. A fair chunk of time is dedicated to the “Design Sprint“. The Design Sprint is typically a week-long intensive in which the prototype design of a project is hashed out. Interestingly, in the last section of Garrett’s book, he says:

“Product development is rarely a sprint…thoughtful, deliberate design decisions will cost you time in the short term, but they will save you much more time in the long term.”

The Elements of User Experience, page 160, JJ Garrett, New Riders Press.

Fifthly and finally, Garrett emphasises the importance of planning and documentation. Every site I have ever created has been done on the fly. When it is for personal use, this is fine. But for professional work, improvisation will only get you so far before confusion, conflict and cracks begin to show. So, point taken. From now on, planning, wireframes and design comps are the order of the day.

Conclusion

The Elements of User Experience was an invaluable book and an excellent time investment. I was really grateful to the print book! Why? Well, I am studying alongside my busy work schedule and I don’t always want screen time just before bed. We all know how that turns out, right? To have a real book to read, just before bed, highlighter in hand, was just…lovely.

I am halfway through the second part of the course. I will keep you posted. Thanks for reading!

Cheers,

Rachel

Alteayoga UX User Survey

A web site redesign needs UX and to define UX, you need a User Survey. So, using the Elements of User Experience, I created a User Survey. I will compile the results once they’re in. Let me fill you in on the background. Read on.

The Elements of User Experience

The Elements of User Experience is a fantastic companion of the UX Certificate course I am doing. This book teaches you how to think about web site design from two distinct but equally necessary perspectives. Web sites can be viewed as depositories for information storage and retrieval, or they can be seen as applications, that allow you to “do” something. To accommodate both points of view, Jesse James Garrett developed his theory, the Elements of User Experience.

The Five Elements of UX are Strategy, Scope, Structure, Skeleton and Surface.

Alteayoga logo - the site being redesigned according to the Elements of User Experience.
Alteayoga

Alteayoga is the name of my yoga project. I currently use alteayoga.es, but have alteayoga.com parked on Google. I will design the site with Webflow, a platform that we looked at in the Part 1 of the course, Fundamentals of UX Design.

The first thing I have to think about is the Strategy. To decide the Strategy of the site we are designing, we have to define two things: the product objectives and user needs. The product objectives are defined by the site owner or stakeholder, while user needs come from the users.

Thinking carefully, I figured out what I want, but how do I know what the user wants? To find out, I created a User Survey based the Elements of User Experience.

Product Objectives

Taking pen to paper, I defined my objectives – or, my strategy – for the redesign of Alteayoga.com. From my side, I want Alteayoga.com to

  • Open me to a more international/English speaking market.
  • Allow me to book and manage requests for online classes. (I often get such requests from students/patients who meet me on their visits to Altea).
  • Let me sell the yoga videos, meditation music and guided meditations that I create.

User Needs

To define the user needs, I need to do some research. Accordingly, I used Google Forms to create a short survey. My aim was to keep it short, neutral and simple.

To define my strategy, I need to know if my users use online wellness classes and if so, via what platform. Do they read wellness blogs and subscribe to them? Do they subscribe to wellness email lists? Knowing this will allow me to decide how I present the material and the project.

User Survey

If you’ve read this far, maybe you can give me five minutes of you time? The forms are hosted on Google Drive, but you don’t have to log into to access them.

Here is the UX User Survey in English: Alteayoga UX User Survey

Aquí tienes la encuesta en español: Alteayoga UX Encuesta Usuario

Conclusion

I hope to get a few responses, so that I have some material to work with. Even though I am taking longer than suggested to do the course, I truly feel that applying the methods contained in the course gives me the best chance of success. The course is very practical, and we will create a UX portfolio, but behind that, I need my web sites to be solid. So, here’s to defining my strategy!