Project Description
Release date: 2021
Role: UI Designer
Icons power every digital interface—especially in vehicles. Partnering with cross-functional engineers and designers, I researched automotive conventions, sketched dozens of concepts in Illustrator, and refined each icon for MAN TGX’s digital cluster and infotainment. The result: intuitive visuals that balance safety with brand personality.
The Challenge
Creating a set of high-quality icons for the MAN TGX’s digital cluster and infotainment presented several intertwined hurdles
Domain-Specific Complexity
Unlike generic app icons, vehicle symbols often represent highly abstract functions—differential locks, lane-keeping assist, tire pressure monitoring—that drivers learn over time or consult the manual to decode. Our first task was to research ISO 7000 and other automotive standards to understand required glyph shapes and semantics, then translate those dry specifications into visuals that felt immediately familiar and leveraged drivers’ existing mental models.
Strict Standards vs. Creative Clarity
ISO compliance meant color, stroke weight, and icon proportions were largely prescribed, limiting stylistic flexibility. At the same time, certain functions demanded added clarity—warning icons, for example, use red to signal urgency. We had to reconcile these clashes by defining a strict palette hierarchy (primary brand color → safe-state color → warning color) and layering only minimal accents atop monochrome outlines.
Multi-Size Legibility & Visual Harmony
Our icon set needed to serve two very different screens—an instrument cluster and an infotainment display—each with its own pixel density and viewing distance. An icon that read crisply at 16×16 px risked looking clunky at 32×32 px, and vice versa. To maintain consistency, aesthetic and minimalist design, we built each symbol at different breakpoints, tested them in UI mockups under real-world lighting conditions, and fine-tuned line weights and spacing so the entire set felt balanced when browsed in sequence or mixed across contexts.
Evolving Scope & Documentation Gaps
As new vehicle features emerged mid-project the icon library ballooned. Early on, we hadn’t prioritized a single source of truth, so designers and engineers began working from divergent Illustrator files. Recognizing this risk to scalability, we introduced an Illustrator component library with clear naming conventions, metadata for screen-size variants, and automated export scripts. This “single source” approach slashed version conflicts, accelerated handoff, and made every design decision traceable.
The Process
The processes at MAN are uniquely tailored to the company. For icon creation, we received conceptual metaphors from a separate department, which we then translated into visual representations. Depending on each metaphor’s complexity or level of abstraction, we developed multiple design variations and reviewed them side by side to ensure consistency across the set. The final icons were rendered pixel-perfect, exported as PNG files, and delivered to the software team.
Iterative Sketching & Collaborative Review
We produced multiple Illustrator variants for each metaphor—simple linear outlines for well-known features and layered compositions for more abstract functions. In regular workshops, UX designers and engineers reviewed options side by side, upholding style consistency and validating legibility under real-world conditions before finalizing a direction.
Results and Impact
By project’s end, the team delivered approximately 600 unique icons, which—when adapted across different size breakpoints and multiple color states—expanded into roughly 6,000 finalized assets. These icons now power three primary MAN TGX interfaces: the instrument Cluster, the Infotainment display, and the Internal Remote Control system.
While iterative reviews revealed opportunities for refinement—such as further optimizing certain multi-element symbols and streamlining documentation workflows—the structured processes we established ensured a smooth rollout. Today, the MAN TGX 2021 truck features our cohesive icon system, delivering consistent visual language and clear status cues across all screens.
All Images and Videos are subject to © Copyright 2021 MAN Truck & Bus SE
