User Interface vs. User Experience: Sliding Into the Differences

You’ve been thinking about a career in the emerging field of User Experience, and as you read through job listings and requirements, a questions hits you.  What is the difference between a User Experience Engineer and a User Interface Designer?

You’ve hit one of the core problems with this emerging career field. I would say most people don’t know or fully understand what UX is. Many employers have heard UX as a buzzword, and are just beginning to recognize UX as an important aspect of the design and development process. As a result, UX is often confused with UI, and many people taking on UX roles end up doing more UI work than anything else.

The infinite wisdom of Inigo Montoya extends to the world of User Experience.
The infinite wisdom of Inigo Montoya extends to the world of User Experience.

So what is the difference between the two?

The basic answer I go with is “User Interface is the controls you use when working with a website/piece of software/etc. User Experience is how you feel about using those controls.”

My favorite way to explain what UX is, and where it fits in the process is to imagine a building that constantly has so many people on the top floor and coming up the staircase that it’s difficult, if not impossible, for anyone to use the stairs to go back down again. It’s a huge problem, and the fire marshall is threatening to close down all access unless a way to get people off the top floor is installed soon. An interior design consultant is brought in, and has quite a few different options to select from that might get people from the top to bottom floors: stairs, elevators, bungee cords, a sheer drop with a big inflatable cushion at the bottom, etc. After some consideration, the consultant might come up with the idea of a slide being the most efficient way to get from top to bottom floors.

Who knew a beautiful view could be a major fire hazard?
Who knew a beautiful view could be a major fire hazard?

To get as many people off the top floor of the building, it will need to be as close to the best possible slide for its particular use. Now the building’s architect has some work to do. Where does the slide go? In the corner, in the middle of the floor, by the biggest window, or even starting at the window, leading outside the building?

This was either a terrible or an awesome idea.
This was either a terrible or an awesome idea.

The architect will likely base their decision by coordinating with a number of different individuals and groups. The architect might need to review with the building owner about where to put the slide so that it doesn’t interfere with using space on the bottom floor. The architect might also have a conversation with people on the top floor of the building about how they’d feel about different slides in different places in the building. The architect will likely do some reading to see if any other building are using slides to get people from floor to floor, and what’s making those slides successful. They may even visit a building down the street with a slide of its own to experience for themselves what they like or don’t like about that slide (competitive product research).

Who says research can't be fun?
Who says research can’t be fun?

Once they have all of the information they need to make the final decision about where to put the slide, they’ll probably work with the interior design consultant to make sure that the color and sizing of the slide work with the existing color scheme in both the top and bottom floors.

By the time the construction crew is on-site and ready to build the slide, the architect will have blueprints and specific instructions for the construction team on how the slide should be constructed.  The architect may need to be available to answer questions about the slide’s construction and materials.

The architect will also need to test the slide, however, both before and after it’s in use to answer a number of different real-world questions.  Is the slide dangerous to use?   Is it as fun and efficient as the architect expected?  Do people use it as expected, or are people attempting to scramble up the slide to get to the second floor?  Depending on the results of the testing, the architect may need to tweak the design slightly (or perhaps even scrap and remove the slide if it doesn’t work well at all).

My work here is done.
My work here is done.

We can extend this metaphor to actual web product development. The interior design consultant is a UI designer: it’s their job to understand the different options about what different elements are available for any particular situation (in this case, choosing between another staircase, a the big cushion at the bottom of a sheer drop, or a slide) and to make initial recommendations on the controller.

The UX engineer is the architect, doing the research on the chosen controller and deciding best location for that controller in context of the current project (the house itself), giving the basic instructions for implementation, and then testing the product both during its development and after it’s finished to make sure it’s reaching the needs of real-world users.

Additionally, the architect and interior designer collaborate at different points in the project, just as UI and UX teams might interact. There may even be some crossover between the two functions, but in the end, there is a distinct line where the UI designer’s work ends and the UX engineer’s work begins.

With all of this in mind, it’s easy to see how UX and UI get mixed and confused with one another. Hopefully I’ve built a good description of how these two vital functions differ from one another.

Pun totally intended.

When Worlds Collide: My Cup of Tea (of a Kind)

It’s not often that my love of good food and drink intersects with engaging and fun user experience and interfaces.  An exception to this rule is the relatively-new (at least to the Denver area) Tea of a Kind, which is a tea unlike any other I’ve yet experienced.

When you find Tea of a Kind (hereafter abbreviated as “ToaK” because I’m just that lazy) on store shelves, it looks something like an eco-friendly, bottle of purified water.  This is hardly surprising, as, at this point in its life, that’s all it really is.

But do you see notice the weird looking cap?  It’s the secret to ToaK’s success.

This weird little gizmo is called, fittingly, a Gizmo.
This weird little gizmo is called, fittingly, a Gizmo.

In a moment, this little cap, which ToaK has termed a “Gizmo,” transforms the contents of the fresh little bottle of water into even more refreshing tea.

If you can’t make out Marty McFly’s jawline, it’s only because it’s on the floor.

Seriously, how cool is that?

What’s more, not only does this little Gizmo provide the single best physical UX element of any drink I’ve yet encountered, ToaK maintains that it “prevents degradation of key ingredients” such as vitamins, antioxidants, and other key functional ingredients.

Now, let’s be frank for a moment.  Is ToaK any better tasting than other tea brands out there?  I’ve sampled the unsweetened black and peach ginger varieties and I’ve come to the conclusion of “not particularly.”  ToaK may be marginally more fresh, but compared to its competitors its flavor is average.

The reason I pick one of these up every. damn. time. I’m at the one convenience store in the Denver area I’ve been able to find them is because of just how cool the user experience is.  I don’t care that it’s supposedly fresher, or that the bottle looks cool, or even that it’s slightly more expensive that a majority of its competitors.  I’ll buy it just to show it off the fantastic experience of watching tea brewed instantaneously before my eyes.

Kudos, Tea of a Kind.  Until someone else comes up with something similar and more delicious, you’ve made a loyal customer (and fan) out of me.


The Best Illustration of UI vs. UX

To those that wonder exactly what it is that I do everyday, this is a pretty succinct way of explaining what us UX people do.

Other people suggest the need for a slide. I suggest where to put it, what it should be made out of, where it should take you, and how you should feel when you use it (awesome, hopefully).

You can read more about the Sky Slide in LA here.

Stepping Up Your Game

I have always been a Boy Scout at heart (and, since the age of 18, an Eagle Scout in real life).  The motto of “Be Prepared” has always spoken to me.  In my day-to-day life, being prepared has been key to my success, be it church league softball, making it through the airport quickly, or advancing my UX career.

Lately, I’ve been putting a lot of effort into advancing the latter.

I get a tremendous amount of good out of establishing a daily practice of self improvement. Being relatively new to UX myself, I constantly feel like I have a lot to learn. Imposter syndrome has always been a particular bane of mine, especially when staring a new job in a new field. In a career that’s ever changing and evolving, keeping up with the fluctuating best practices and research can be challenging as well. By spending a bit of time each day working to make myself a better UX’er, I’ve found that I’ve been able to slay all of these proverbial dragons.

The big question, then, is how to go about honing your skills, especially when you’re not on a project team.

For me, there are a handful of things I do on a daily basis that I’d recommend to any UX’er looking to bump their game up a notch.

1.) Read something. There’s so much written knowledge out there about our field. I find that reading something each day is always a great first step to build my skill set. There’s quite a bit of good stuff here on, User Testing Blog, UX Booth, UX Magazine, and many others. I have a Feedly feed setup that drops in all the articles from these groups so that I can pick out a couple to read every day.

2.) Interact with the Community. The UX/UI community is notorious for being welcoming. I don’t think I’ve ever met another professional group that’s more approachable, even at the higher levels. Apart from getting started here, you’ll probably want to look at to get a good look at what questions others are asking. On Twitter there are some excellent people to follow: my favorites are Tobias van Schneider, Daniel Burka, and Jonathan Colman.

Shameless plug time: my twitter handle is @5280_CS, if you’re at all interested. I try to retweet the articles I like best each day, and to post any unique thoughts or scenarios I come accross. It’s a great way for me to meet people in the business, and to hone my skills while doing it.

3.) Problem solve. One of the best ways to get experience in a field is to work on tackling real-life problems other people are facing. UXMastery’s forums is a great place to start, but don’t overlook either. Take a problem that you feel is just a little out of your comfort zone, and get to work. Approach it like you would if you were working on a UX team. Do research, whiteboard, iterate, and test.

You don’t have to post your answer to the question if you don’t feel comfortable doing so, but posting will help you get used to putting you work out there for public consumption, and defending position as well. Additionally, you can compare your approach to others to see how your outcome is different, and analyze how your process may have affected that outcome.

With such an open community, I’ve never met a UX’er with their salt who wasn’t patient when asked to describe their process or logic pretaining to their solutions.

What do you do to build your skill set on a daily basis?