ux blog header image

The UX Blog

UX vs. UI Design

Many people use these terms interchangeably, but they are actually quite different and imply different skillsets among their practitioners.

UI stands for User Interface, but it could be described better as “the hardware or software through which a user interacts with a product.”

UX stands for User eXperience, but it could be more completely described as “what the user experiences throughout the entirety of his interaction with every aspect of a product.”

###A simple example

Think of your TV. You probably interact with it via the remote control and maybe also some menus in the TV’s software. Both the physical control and the menus could be called the TV’s user interface.

The user experience of your TV, though, encompasses a much broader set of things: how hard it was to unbox, whether the manual was easy to understand, how it looks in your living room, how many video inputs/outputs it has, whether the ports are easy to access, how long you had to wait on hold when you called the manufacturer to ask a question about it, etc.

Clearly the remote control and the software menus are part of your experience with your TV. And in that same way, user interface design is a part of user experience design. Although people and roles vary, UX designers tend to be jacks of all trades while UI designers usually specialize in creating interfaces.

###Some practical examples

A typical UI designer might try to answer questions like this:

  • What should our sign-up form look like? Should all the inputs be visible at once, or should some of them be hidden and then only appear after the user completes the first one? How should we inform the user if an email address isn’t valid or his preferred username has already been taken? Should the box get outlined in red, or should we put a little X next to it?
  • On the product dashboard, what information should be displayed by default? How can we indicate to the user that items can be removed from the dashboard? Should we use an X icon in the corner of each item, or some other icon? Should the X icon always be visible on each item, or should it only appear on hover?
  • Where should the navigation links appear on our website, the top or the side? Should the link to the contact page actually say “Contact,” or should it say “Email us” or “Support”? When a user filters our search results, how should we display which filters are applied? Does the user remove a filter by hitting “Back” or by clicking a tiny X next to each applied filter?

A typical UX designer might consider some of the UI questions above, but he or she would also try to answer other questions about the product:

  • When sending emails to the customer, whom should the sender be – the name of the company? The name of the CSR? If a customer replies to an automated message, what happens to it? Do we just have a no-reply address, or does that message get sent to a person somewhere?
  • Which is more important to launch first, feature X or feature Y?
  • What should the structure of our website be? What pages should it have, and how should the user navigate between them?
  • Should we spend time creating spectacular visual design, or is it better to work on improving feature X instead?
  • Why do users buy our product? Why don’t they buy our product?