UX vs UI

Written by
josee.leger

UX (User Experience) and UI (User Interface) are two terms that are often thought of as having the same meaning, yet there are some major differences between the two. When creating a product or service, you should always have the users experience in mind. Whereas, User Interface is almost always not a necessity for a great intuitive User Experience.

“If you think good design is expensive, you should look at the cost of bad design.”
– Dr. Ralf Speth (CEO, Jaguar Land Rover)

There are so many questions to ask before diving into the interface of a product or service. What is the end user’s problem? How can we solve this problem? How can we simplify the product/service to allow for a quick and easy solution? The end result should allow the user to solve their problem or pain point quickly and easily; without frustration.

As a UX designer, I find myself often having to remind others how important UX is; not only in software but also in everyday life. Many UX designers have begun referring to UX as a human-first way of designing products and services. If you’re not thinking of the user or human that will be using the product, every step of the way, their experience will likely not be an enjoyable one.

An example I often like to use to explain the difference between the two is imagining the product or service is a human body.

  • Coding or programming can be compared to the Bones of the human body. The structure on which the body (product) will stand.
     
  • UX can be compared to the organs of the body. If the organs are failing, the body (product) is likely not happy or working efficiently.
     
  • UI is comparable to the external appearance of the human body. “the cosmetic” outer appearance is nice to look at, it doesn’t mean the organs (UX) are functioning properly.

In short, if the UX is less than efficient and functional, the UI will not help the end result in any way. Users will get frustrated and find a competitor’s product before using something that will further their frustrations or irritation towards their already existing problem.

Josée Leger, UI/UX Designer
Missing Link Technologies

 

Other articles by Josée:

Related Articles:

 

UX vs UI Infographic

User Experience, User Interface, Software Development

Comments

*

Restricted HTML

  • Allowed HTML tags: <a href hreflang> <em> <strong> <cite> <blockquote cite> <code> <ul type> <ol start type> <li> <dl> <dt> <dd> <h2 id> <h3 id> <h4 id> <h5 id> <h6 id>
  • Lines and paragraphs break automatically.
  • Web page addresses and email addresses turn into links automatically.