CQH-201: UI vs UX

Imagine opening a beautifully designed app. The buttons are crisp, the colors are pleasing, and the fonts are modern. But then… you can’t figure out how to save your work. The app freezes when you tap the wrong part of the screen. You press the back button and lose everything.

Looks great. Feels terrible.

This is the difference between UI and UX in a nutshell.

🖼️ UI: What You See

User Interface (UI) refers to the visual and interactive parts of a product. It’s what you see and touch:

Layouts and colors
Buttons and sliders
Fonts and spacing
Animations and transitions

Great UI is like good packaging: it makes a strong first impression and tells you where everything is. But UI alone doesn’t guarantee a good experience.

🎢 UX: What You Feel

User Experience (UX) is the entire journey a person has with your product. It includes:

How intuitive the navigation is
Whether the user feels in control
How errors are handled
The emotional reaction to the product

Good UX means:

Tasks are easy to complete
Information is where you expect it
The product feels satisfying to use

A beautiful app with poor UX is like a fancy car with the steering wheel in the back seat.

🔍 Real-World Example

Consider a login screen:

UI: The form is centered on the page, with soft shadows and a stylish “Login” button.
UX: If the form doesn’t tell you why your login failed — or makes you retype everything — the experience is frustrating.

Good design is both: a clear form with visual appeal and helpful error messages, password visibility toggles, and sensible defaults.

🧠 Why This Matters for You

As a developer, it’s tempting to focus on functionality. “It works” feels like success.

But to your users, how it works matters just as much as whether it does.

You don’t need to become a designer overnight. But even learning a few UX basics can transform the quality of your software.

Check out these resources to go deeper:

Don Norman’s “The Design of Everyday Things” — the classic intro to human-centered design
Nielsen Norman Group’s UX Basics
Laws of UX — principles like Hick’s Law and the Serial Position Effect
A List Apart — thoughtful articles on design and development

🧪 Your Challenge

Pick an app or website you use every day. Ask yourself:

What’s one thing you love about its UX?
What’s one thing that frustrates you?
How might you redesign it?

Sketch it out. Talk about it with a friend. Or write a short review and share your ideas.

Next up: we’ll return to hands-on mode and explore mobile interfaces — and how designing for small screens challenges and refines your thinking.