Learning the difference between UI and UX design can initially be very confusing. Designers will tell you that UI is part of UX, but UX is not “experienced” from UI only. But what does that mean? Which one is more important? How do you use them together effectively?
Rahul Varshney, co-creator of Foster.fm, explains, “User Experience (UX) and User Interface (UI) are some of the most confused and misused terms in our field. A UI without UX is like a painter slapping paint onto canvas without thought; while UX without UI is like the frame of a sculpture with no paper mache on it. A great product experience starts with UX followed by UI. Both are essential for the product’s success.”
“Something that looks great but is difficult to use is exemplary of great UI and poor UX. Something very usable that looks terrible is exemplary of great UX and poor UI.” –Helga Moreno
What is UX Design?
User Experience Design is the overall “feel” that a user gets from your product. It’s their entire experience. UX designers succeed if users have a positive and satisfying experience using their product.
If you open an app on your phone and it’s confusing and complicated, or if you feel frustrated after using it, that’s an example of bad UX design. On the other hand, if an app is simple and seamless, and you quickly and easily accomplished what you opened the app to do, that’s good UX.
Remember that even though UX design is about how the user feels, good UX design doesn’t mean that after every interaction, the user is overjoyed because the interface was so fun and easy to use. People expect apps to be simple and easy to use. UX design is usually unnoticed––unless it’s bad.
So, how do you construct this perfect user experience? It’s a whole lot more than just design. UX relies on research and data to determine what users prefer. Usability is influenced by visual aspects such as where buttons are, how a menu is formatted, and how you navigate through a product.
“UX designers are concerned with how the user experiences the product. They want the user to come away from the app feeling good.” –Matt Powers
Here’s an example of UX design:
Most apps go to a loading screen when you first open them. This splash screen usually is colorful and prominently features the app logo. And, it usually features some sort of animation. Why? Because when something is loading and a user sees a circle turning or a bar filling up, they can easily see that their app is indeed loading. If a loading screen is a static page, the user may wonder if the app is frozen, or they may get impatient waiting. If an app says it’s 90% loaded after a minute, the user is a lot more likely to wait than if they’ve been waiting a minute and have no idea what percent of the app is loaded yet. Little things like that contribute to the overall user experience.
What is UI Design?
User Interface Design is more visual. It’s how a user interacts with your interface and is a part of UX design. UI design is comprised of the visual aspects of a design, including the colors, buttons, images, etc. With the demand for digital products only increasing, UI design is the future of graphic design. Some UI roles on smaller teams require front-end coding knowledge or proficiency, while others have a separate team of developers. Knowing basic front-end coding, especially HTML and CSS, as a designer definitely won’t hurt.
“If the UX designer is looking at a website from 40,000 feet, the UI designer is looking at it with a microscope.” –John T. Jones
UI designers create tangible elements that comprise an app or website. They want to optimize the layout and determine which assets appear where. Especially now, digital design is essential to establishing a website’s identity and legitimacy. If your website or app is unattractive, you lose a significant amount of credibility, which is going to hurt you.
How do UI and UX design work together?
UI design is one aspect of UX design. Larger companies separate these roles, while smaller companies often combine them. Either way, they’re both crucial. You don’t want an elegant interface that’s difficult to use. And you don’t want an app that’s easy to use but is boring and unappealing. When UI and UX combine together perfectly, the result is a clean, simple, stunning product that is both easy to use and engaging to the user.
How can I learn UI/UX design?
Because these fields are very new, there are very few college programs specifically tailored for UI and UX design. Some tech-focused universities, like Carnegie Mellon, offer a Master of Human-Computer Interaction, which teaches valuable UX skills. If you’re interested in UI design, you can enroll in a graphic design, interactive design, or visual design program and apply those concepts. A background in visual design, computer science, or psychology/sociology can help you with a career in UX design. Learning about emotional intelligence and developing your empathy will also be helpful. For a more specific, immersive experience, look into UI/UX bootcamps or courses, especially if you live in a major metropolitan city. There are also online courses or tutorials you can try. No matter what route you take, pursuing a career in UI/UX is a great career move, as these skills are in extremely high demand.
Want to learn more about UI/UX design? Check out some of the books below (The Design of Everyday Things is a great starting point).