Logo UX & Usability Toolkit
DE | EN

Evidence rating

Effect score (E): 4/5 Evidence for the underlying principle or measurement method.

Transfer score (T): 3/5 Evidence for reliable results in digital product practice.

Evidence level: High

[Plausible based on UX research] Distinguish interface features from user experience: interface inspection does not replace studying users’ experience.

Scale and rating rules

Effect score: 5 established · 4 robust · 3 context-dependent · 2 weak · 1 preliminary.

Transfer score: 5 practice-proven · 4 field-supported · 3 partially supported · 2 plausible · 1 hypothesis.

Without a robust scientific or normative source, E is capped at 3. Blog and agency opinions support at most T=2. If evidence conflicts, the more conservative score applies until justified otherwise.

Evidence level: High = E ≥ 4 and T ≥ 3; Moderate = E ≥ 3; Preliminary = E ≤ 2 or T ≤ 1.

User Interface vs. User Experience

Two terms that are often confused - but describe different aspects of interaction with digital products.

Definitions

User Interface (UI) refers to the visible and operable elements of a digital application: layout, colors, buttons, typography.
User Experience (UX) describes the entire experience - from the first perception to the use to the after-effect.

Comparison: UI and UX at a Glance

User Interface (UI)

The UI is what users see and use. It includes all visual and interactive components of an application.

  • Design & visual level
  • Layout, color scheme, icons, buttons
  • Responsive design, accessibility
  • Sub-area of the UX design
  • Example: A structured navigation bar with clear icons

User Experience (UX)

UX describes how a product is experienced overall - emotionally, functionally and aesthetically. It encompasses expectations, usage situations and after-effects.

  • Holistic: before, during and after use
  • Emotional & cognitive dimensions
  • Focus on user needs & context of use
  • Includes usability & UI
  • Example: The feeling of control and trust in online banking
User interface vs. user experience
Comparison of user interface and user experience

Practical Example

A banking portal with a modern UI - clear colors, large buttons, intuitive icons - can look technically flawless.
But if users feel insecure, receive no feedback on actions or loading times cause frustration, the UX suffers.
Conversely, a site with a simple UI can offer an excellent UX - if it is reliable, fast and trustworthy.

Take Home Message

**UI is what users see. UX is what they feel **.

Deepening & Application

UX and UI can be specifically designed and improved - with the help of methods and standards:

Frequently asked questions (FAQ)

What is the user interface (UI)?
The UI includes all visible and operable elements of an application - such as layout, colors, buttons, typography and interactions. It is the visual and functional interface between the user and the system.
What does user experience (UX) mean?
UX describes the entire user experience - from initial perception to interaction and after-effects. It includes emotional, functional and contextual aspects.
What is the difference between UI and UX?
UI is a sub-area of UX and focuses on the design of the user interface. UX is more comprehensive and also takes into account emotions, expectations, context and the entire user journey.
Can a good UI make up for a bad UX?
No. An appealing UI can improve perception, but if processes are unclear, feedback is missing or loading times are frustrating, the UX still suffers.
What role does accessibility play in UI design?
Accessibility is a key quality feature of the UI. It ensures that all users - regardless of limitations - can use the interface, which in turn improves the UX.
How are UI and UX related in practice?
A good UI is the basis for a positive UX, but it is not enough. UX design also integrates user needs, emotions, context and interaction flow.

Science corner: evidence data

Setting
Conceptual distinction; user-centred product evaluation
Replication status
Mixed findings
Evidence level
High (E=4, T=3)
Key sources (APA)
  • International Organization for Standardization. (2019). Ergonomics of human-system interaction—Part 210: Human-centred design for interactive systems (ISO Standard No. 9241-210:2019). Open source
  • Hassenzahl, M., & Tractinsky, N. (2006). User experience – a research agenda. Behaviour & Information Technology, 25(2), 91–97. https://doi.org/10.1080/01449290500330331
  • Law, E. L.-C., Roto, V., Hassenzahl, M., Vermeeren, A. P. O. S., & Kort, J. (2009). Understanding, scoping and defining user experience: A survey approach. Proceedings of the SIGCHI Conference on Human Factors in Computing Systems, 719–728. https://doi.org/10.1145/1518701.1518813
  • Tractinsky, N., Katz, A. S., & Ikar, D. (2000). What is beautiful is usable. Interacting with Computers, 13(2), 127–145. https://doi.org/10.1016/S0953-5438(00)00031-X
Review date / version
2026-11-01 · 1.1
Next review
2027-11-01 (Review cycle: 12 months)

Last modified: 1 November 2026