What is UI/UX design?

UI and UX: what’s the difference?

UI design answers the question of how something looks and how it is operated: typography, colors, icons, spacing, form fields and states such as “active” or “disabled.” It ensures a clear, consistent interface.

UX design starts earlier and asks whether a product meets its users’ needs. It deals with workflows, information architecture and clarity. The DIN EN ISO 9241 series of standards describes usability as the interplay of effectiveness, efficiency and satisfaction—and that is exactly the yardstick for good UX design.

The two disciplines are intertwined: a beautiful interface is of little use if users can’t find the next step. And a well-thought-out flow looks unprofessional if the design is cluttered or inconsistent.

What a UI/UX design process looks like

It starts with questions rather than drafts: Who uses the product, in what situation and with what goal? This produces user profiles and workflows. Only then do structure and visual design follow.

How extensive each step is depends on the project. For a small website, a compact workshop and a prototype of the key pages are often enough; for complex software, more extensive testing with different user groups pays off.

• Research: interviews with users, analysis of existing data and workflows
• Information architecture: organizing content and navigation logically
• Wireframes: simple sketches of the most important views
• Clickable prototype, for example in Figma, for testing before development
• Usability tests with real users, followed by revisions
• Design system and handoff to development

Benefits and limits of UI/UX design

Good UI/UX design reduces training and support effort because users can find their own way. It makes it easier to complete forms and purchases and increases the acceptance of internal software. Errors caught in the prototype also cost far less than changes to finished code.

The limits: design can’t fix an unclear offering or a poor process. And tests with a small number of users provide valuable insights, but not statistical proof. What matters is continuing to monitor and improve results after launch.

Real-world example: UI/UX design for a company app

A service company wants its technicians to document jobs via an app. Instead of starting to code right away, the design team first shadows them for a workday: Where is the app used—with gloves on, with poor reception? This leads to large controls, few required fields and an offline mode. Sufficient contrast for outdoor use is also taken into account.

A clickable prototype is tested with several technicians and refined before development begins. At Nano Concepts, UI/UX design is created together with partner agency LOMA DESIGN at the same location—so design and implementation mesh directly.