UI

Définition

While UX is the brain and logic, UI (User Interface) is the face and visual performance. UI is the point of immediate contact between the user and the digital product. It encompasses the visual elements (colors, typography, buttons, motion, animations, and layout) that allow the user to interact with the system. Unlike UX, which focuses on research and the journey's logic, UI is concerned with the functional aesthetic, which is its main objective.

The goal is to create a UI that is not only beautiful, but also intuitive, accessible, and perfectly aligned with the brand's Design System. A good UI facilitates reading and guides the eye, transforming complex information into a pleasant visual experience.

The UI approach relies on three performance axes:

  • Brand Alignment: UI is the visual extension of brand identity. It is essential that each choice (color, typography, character of icons, and each element's placement) reinforces the brand's personality and positioning.
  • Clarity and Guidance: The main role of UI is to minimize the user's cognitive effort. The design of interfaces must instantly convey the expected actions (buttons clear or content) through a strategic use of color, white space, and visual hierarchy.
  • Accessibility and Reactivity: The UI must be usable by everyone, including people with visual impairments. Strict WCAG rigor guarantees respect for accessibility standards and ensures that the design adapts perfectly to all screen sizes (Responsiveness), from mobile to desktop.
No items found.

Exemple

If UX is the recipe that guarantees the pot or the cake, UI is the decoration, the icing, and the presentation on the plate. The cake may be delicious (good UX), but if the icing is unattractive and poorly presented (bad UI), no one will be tempted to taste it.

Outils recommandés

  • Figma: The absolute reference for high-fidelity interface design, prototyping, and real-time collaboration.
  • Ouvrages recommandés

    Practical UI by Adham Dannaway: A modern, hands-on “must-have” guide. It provides logical and mathematical rules for choosing colors, spacing, and visual hierarchy. The book is only available in Kindle or online format. The link points to Adham’s website.

    Références & sources

    No items found.