← Back to home
Alfa Romeo IVI Design

Alfa Romeo IVI Design

A clean, driver-focused IVI concept for a premium vehicle experience

Role
UX Designer (Team of 2)
Timeline
Sep 2025 – Dec 2025
Skills
Competitive Analysis, IVI Design, Visual Hierarchy, Usability Testing
Tools
Figma

Problem

Dense interfaces overwhelm drivers when attention shifts

As in-vehicle systems expand with more features, drivers need interfaces that stay clear under real-time attention limits. A collaboration with the Stellantis Brand Design team to rethink the Alfa Romeo in-vehicle experience.

Dense in-vehicle interfaces can overwhelm drivers during attention shifts, increasing cognitive load and potentially undermining safety.


Demo

See the interface in action

Prototype walkthrough video

Video placeholder — add Figma prototype recording or demo walkthrough


01 — Research

Competitive analysis

Benchmarked 6 existing in-vehicle systems to understand current patterns, strengths, and pain points in automotive interface design.

6 Systems benchmarked
20+ HMI screens designed
3 Display types
Competitive analysis matrix — 6 systems compared

Feature and usability comparison across benchmark vehicles


02 — Wireframes

Establishing information hierarchy

Low-fidelity wireframes to define layout structure and prioritize safety-critical information for each screen type.

Landing Page

Entry screen displaying navigation, media, and key car information for quick access.

Wireframe — Landing page

Navigation

Destination search and saved places like Home, School, or Work.

Wireframe — Navigation

Vehicle Controls

Access to key settings — lights, drive modes, wipers, and mirrors.

Wireframe — Vehicle controls

Media

Music selection and playback control.

Wireframe — Media

03 — Visual Design

Style guide

Established to support clarity and accessibility across the interface, refined to align with Alfa Romeo's brand visual language.

Style guide — typography, colors, iconography, spacing

Design system foundations for the IVI interface


Final Design

Center display

The primary touchscreen interface. Each screen is designed to minimize cognitive load while keeping essential information accessible.

Landing Page

Gives drivers an immediate overview of the system — navigation, media, and car status at a glance.

Hi-fi — Center display landing page

Media Controls

Prioritize playback clarity, with personalized AI infotainment search on the right.

Hi-fi — Media controls with AI search

Quick Controls

Essential settings organized in one place, with adaptive weather assistance adjusting lights and wipers.

Hi-fi — Quick controls with weather assist

HVAC

Clear on/off state with optional smart climatization that adjusts airflow automatically.

Hi-fi — HVAC controls

Navigation

Clear map view with focused turn-by-turn guidance.

Hi-fi — Navigation with turn-by-turn

Cluster display

The screen behind the steering wheel — presenting essential driving information designed to remain clear and glanceable while supporting AI features.

Hi-fi — Cluster display overview
Cluster — driving mode
Cluster — navigation mode

Cluster adapts between driving information and turn-by-turn navigation


Heads-up display (HUD)

Windshield-projected interface keeping critical driving data in the driver's line of sight — speed, navigation, and alerts without looking away from the road.

Hi-fi — HUD overlay on windshield

HUD concept received positive feedback from Stellantis stakeholders


System Overview

Three displays, one experience

The center display, cluster, and HUD work together as a unified system — each surface showing the right information at the right time based on driving context.

System diagram — center display + cluster + HUD relationship

Reflection

What I learned

↑ Back to top