Radial

A glanceable, contextually-aware instrument cluster for L3 autonomous vehicles.

Role
UX Designer

Organization
Personal Project

Ownership

UX Design
Information Architecture
Wireframing
Interaction Modeling

Visual Design
Physical Prototyping
User Testing
Research Synthesis

The Problem

How might we build driver trust & confidence while using ADAS?

Advanced Driver Assistance Systems are an unfamiliar, sometimes unnerving technology. Most have never driven an L3-capable car and have no existing interaction models to rely on. Therefore, fear, confusion, and a lack of confidence may endanger drivers or prevent them from using ADAS altogether.

The Solution

Radial: a glanceable, focused, contextually-aware instrument cluster.

Radial builds confidence by clearly communicating what the vehicle is doing and sees, shows only mode-relevant drive information, and enables an “eyes up and out” experience with a clear, glanceable UI.

How It Works

The driver always knows who’s in control, what’s going on, and what’s important.

Distinctive state changes between driven and autonomous modes show when the driver should take or cede control.

Visualized sensor data and increased nav info conveys situational awareness and builds confidence with the driver.

A glanceable UI, with mission-critical data in a clear information hierarchy, enables a safer, “eyes up and out” user experience.

Key Visuals

Clean. Focused. Logical.

Interaction Model

One piece of a multi-screen, multi-input, multi-user experience.

Radial prioritizes pilot-critical info, ceding other data and inputs across a whole-vehicle, passenger-inclusive HMI. Information is located contextually where it’s most relevant and input devices have clear, consistent interaction patterns.

Why It Matters

Confidence & trust in ADAS increases safety and accelerates user adoption.

Confidence

Trust

safety

Research + Synthesis

Qualitative User Research

Understand user needs.

On past projects, I’d work with our Design Researchers to understand user needs, wants, and lived experiences. We’d then synthesize key insights and frame them as questions:

SAFETY

How can the HMI support safe low-speed driving experiences?

CONFIDENCE

How can we build trust & confidence while using ADAS features?

ATTENTION

How can the cluster minimize distraction & direct driver’s attention?

TIME

How can a multi-screen HMI enable multitasking and unlock time?

Benchmarking

Gain some firsthand knowledge.

On past projects, I’d test fleet and competitor vehicles to experience similar features and scenarios our users would typically encounter.

Problem Framing

Learn the major problems and constraints.

On past projects, I’d sit with software and mechanical engineers to learn the software, hardware, and regulatory constraints we would need to build around:

Cluster screens have shitty refresh rates.

Speed, gear must be visible at all times.

Consider screen glare from the sun.

Design for entire vehicle portfolio.

Some users have color-blindness.

Compensate for rim block.

Consider existing input devices.

Maintain existing design system.

Minimize driver distraction.

Ideation + Production

Moodboarding

Draw inspiration from historical and analogous design solutions.

I studied physical and digital clusters as well as mechanical watch faces from different eras to abstract novel interaction patterns and visual layouts. I then grouped them by theme.

1/3: RADIAL

Concentric circles, semi-crescents, and info aligned along a central axis. Ideas of nested data and data modifying other data.

2/3: LINEAR

Wide, sweeping gestures. Short vertical height increasing forward visibility. Ideas of linear progression, greater/less than, forward/back.

3/3: CYCLOPS

Ideas of magnification, hierarchy of information, & data across multiple planes. Big, obvious changes of state. Fits well inside rectangles.

VALIDATE

Does our product roadmap align with user wants & needs?

INGESTION

Where Collab tags, catalogs, & records newly-submitted clips.

DISTRIBUTION

Where Collab utilizes & monetizes clips for claims, licensing, promo & more.

Sketching

Think on paper.

Wireframing

Think in higher fidelity with wireframes.

After sketching, I pulled my 3 mood board themes and built a set of wireframes around each concept.

L1 Driving

1/3: RADIAL

2/3: LINEAR

3/3: CYCLOPS

L3 ADAS

1/3: RADIAL

2/3: LINEAR

3/3: CYCLOPS

Charging

1/3: RADIAL

2/3: LINEAR

3/3: CYCLOPS

Feedback

Get feedback from your team & iterate.

I took my wireframes to other designers and noted their feedback to incorporate into later designs.

Prototyping & User Testing

Prototyping

Build an interactive prototype with Protopie so users can test something real.

With help from our engineers and another designer, we built a vehicle emulator that ran as a Protopie plugin. It allowed us to build and test interactive prototypes on both desktop and physical simulators.