The difference between a UX and UI designer

You just finished the presentation you’ve been working in for weeks, and know: you aced it. The user interface you designed is still on full display behind you, and in front of you is your client. Their faces are blank, expressions unreadable, but you’re not worried — this is the best work you’ve ever delivered. Really, you’re just waiting for the standing ovation to start.

"We asked you to take care of the UX design," says the CEO.

You start sweating. But that's what you did, right? Two of them whisper to each other, while the CEO continues to stare at you stoically. You look back, then forward again. If what's on your screen isn't UX design, what did you do?

Where things went wrong (with web design)

One of the beautiful things about web design is that everyone is invited to join in. Nearly endless (free) resources — tutorials, templates, workshops, and webinars — mean you don't need formal training to enter our digital domain.

Want in? Come right over.

The internet is the great equalizer; you don’t need big money to fulfil your big dreams. At the same time, the lack of any kind of barrier to start as a web designer is a pitfall for our profession.

Since there are no requirements to admission, anyone can label themselves a digital expert and get to work. That’s how you can have people — maybe you’re one of them, maybe you’re not — who mix up what’s what in web design. Are UX and UI design the same? Maybe you’re not even sure what’s the difference between front and back-end development.

I’m not saying a four year college degree is what web design needs, but we need to make sure everyone who calls themselves a web design expert knows the difference between UX and UI — we owe ourselves at much. Web design isn’t a hobby like it was 20 years ago, it’s a huge industry and our aim is to create amazing work.

So, is there a difference between UX and UI design?

Is there a difference between UX and UI?

User Experience (UX) and User Interface (UI) design are often confused and even used interchangeably; designers who focus solely on interfaces still call themselves User Experience designers and vice versa.

Yet, there is indeed a difference between the two fields, but where does all this confusion come from? Well, the terms are suspiciously similar, and the fields overlap significantly.

That's why it's useful to look at what makes them distinct but also to see how (and when) the two intersect.

The differences between UX and UI Design

Let's first look at how the two fields differ from each other.

The work of the UX Designer

The User Experience designer deals with a customer's digital journey. This expert looks at a project from above and keeps an eye on all moving parts: how do customers reach the website, what interactions have customers already had with the brand, and what feeling do we want to convey with our product?

The UX designer is the architect who lays out the broad outlines of a project. Like the architect, the UX designer isn't concerned with the specific dimensions of the windows or the material of the floor.

The work of the UI Designer

The User Interface designer focuses on the details of the user experience. What should the customer journey, outlined by the UX designer, actually look like? This process is about making designs and seeking visual solutions for the ideas conceived to deliver the best product.

The UI designer is the one who takes the broad outlines and then colors in the picture. Without the User Interface specialist, there are only ideas; UI brings ideas to reality.

UX and UI design as two sides of the same coin

Now, the reason we can use UX and UI interchangeably is that they are two sides of the same coin. One cannot exist without the other, so it's understandable that some people think we're talking about the same expertise — that we’re just splitting a larger whole into two smaller parts.

In a way, that’s true. Both UX and UI design are needed to arrive at a successful final product. In smaller projects, one designer could even perform both roles. UX and UI will always be two expertises that exist alongside each other and cannot, in my opinion, exist without each other.

The differences between UX and UI design

We can see User Experience and User Interface Design as two different fields, intimately connected. Below, I’ll briefly describe each fields in broad terms, hopefully showing that even though these are differences: they exist side by side.

Know the differences, understand their similar.

UX design

  • User experience: How the end user experiences the product. Is the goal easy to understand?

  • Prototyping: Test the product in broad strokes; what works and what needs improvement.

  • Higher level: View the project from high up, see the connections with other parts of the whole.

UI design

  • Look & feel: The overall feeling that a product should convey.

  • Design: Design the product, from brand experience to visual details.

  • Details: Examine the product under a magnifying glass and perfect everything down to the last detail.

UX and UI; same same, but different.

You’re stunned; the CEO is right.

What you’ve been presenting is a UI design — the user interface of their product. However, they wanted you to talk about their customer journey and a user’s experience. Okay, breathe. Know there’s still hope. Because, you see, beneath all your designs you can show how you’ve shaped the user experience. It wasn’t your focus, but it’s still there.

You backtrack through the presentation and explain how the client can see your UX work between the lines, for every user interface is an expression of the underlying user experience. Both field work together and are inseparably connected.

User experience, unlike the user interface, is something you don't see. That doesn't mean it's not there.

Display — Framer Template

With this Framer template, you can showcase your design, photography, writing, or any other creative project that you've been working on in a sleek and professional way.

Framer Template - Display

Display — Framer Template

With this Framer template, you can showcase your design, photography, writing, or any other creative project that you've been working on in a sleek and professional way.

Framer Template - Display

Display — Framer Template

With this Framer template, you can showcase your design, photography, writing, or any other creative project that you've been working on in a sleek and professional way.

Framer Template - Display