UX Design · Information Architecture · NIO · 2019

NIO OS 2.0
Media Redesign

Redesigning NIO's in-car media app — transforming a fragmented multi-source tool into an open, emotionally resonant platform that connects users with rich content and each other. Part of NIO OS 2.0, winner of the IF Design Award and Red Dot.

My Role
UX Designer · IA Lead
Methods
Data Analysis · User Interview · Mental Model · IA · UX Design · Prototype Testing
Company
NIO (2019)
Awards
🏆 IF Design Award · Red Dot 2020

01

Overview

NIO OS Media app integrates seven sources: NIO Radio, QQ Music, Himalaya, Bluetooth, FM, and USB music. It's one of the most frequently used apps in car. However, the first version had usability problems and an unclear product vision.

I discussed the product goal with the product manager, analyzed users' mental models and usage scenarios, and redesigned the information architecture and UX. The final design provides a more open and tolerant product structure, creating a friendlier and more continuous experience.

02

Media 1.0 Problems

Media 1.0 was based on NIO OS 1.0, where users could customize their home screen media card. The general structure had several key shortcomings:

Media 1.0 — Demo

03

UX System

We analyzed usage data across different touchpoints — NOMI (voice assistant), ICS (in-car screen), and steering wheel — to place functions properly and build a consistent interaction model.

UX system across touchpoints

04

Goals for Media 2.0

Based on research, we reset the design goals for the Media experience — moving from a utility tool to an emotional companion.

🎵
Easy Access to Rich Content

The core need is listening to music with rich content and easy interactions. How to help users quickly find content they love while driving was the central challenge.

💛
Emotional Companion

Media is not just a tool — it's an emotional companion. Almost 70% of users stayed in the car listening after a drive. The media experience should feel warm, not just functional.

📡
Connecting NIO Users

NIO Radio provides community content — users' stories, community news, local news. Media 2.0 needed to give this content a proper home and surface more for users to explore.

05

Information Architecture

The information structure of Media 1.0 was complex and couldn't bear future updates. Media 2.0 simplified interactions into 2 layers, reducing cognitive load while creating space for rich content exploration.

"A more open and tolerant product structure — letting users access content directly, regardless of source."

NIO OS 2.0 Media final design

06

Prototypes

I proposed several design concepts and tested with prototypes. The selected solution included four key improvements:

Prototype — NOMI Voice + ICS Integration

07

Outcomes

The final design published together with NIO OS 2.0. Though some concepts were not developed in this release, we had a clearer plan for Media's evolution. After this version, I continued reflecting and followed through on several subsequent updates.

NIO OS 2.0 — Media App in Car
🏆 NIO OS 2.0 — IF Design Award & Red Dot Design Award (2020)