NIO OS 2.0
Media Redesign

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.

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:

• 01Unnecessary options. Users rarely changed the default home screen layout, and customization was complex. Too many quick-play buttons on one page.
• 02Extra steps for most scenarios. Most users opened a source's content page directly, but always had to go through the home page first.
• 03Discourages exploration. NIO Radio only offered a play/pause button with no content page — not meeting users' needs or company strategy.
• 04Inconsistent mental models. NIO Radio and Bluetooth had no landing page while other sources did — creating confusion across the app.

Media is a platform connecting source suppliers and users. For users, they want to continue their mobile device experience and easily switch between sources. For source suppliers like QQ Music and Himalaya, the car platform represents a major business opportunity. For NIO Radio, as a key community touchpoint, it needed a richer product structure.

I conducted a workshop with the NIO Radio team and product managers to understand the full cooperation model and stakeholder needs.

Mental model mapping is a powerful way to jump out of the existing design and build understanding bottom-up from users. Based on user interviews and data analysis, I worked with researchers to map a mental model combining usage patterns and pain points from Media 1.0.

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.

• 🎤NOMI was most frequently used for searching, but the experience wasn't good enough when users wanted to dig deeper.
• 📱ICS was used to open the player, search when NOMI failed, and explore content.
• 🎛Steering wheel was used for frequent controls (prev/next, play/pause, volume) due to its speed while driving.

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

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.

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

• 01

  Built a bridge between NOMI & ICS

  Users can continue selecting specific content after a voice request through NOMI. ICS search history also includes NOMI results.

• 02

  Simplified mental model

  Users switch sources and continue last-played via the home screen media card. Tapping the card enters the source content page directly. The mental model is now identical for all sources.

• 03

  Presented rich new content

  QQ Music, Ximalaya, and NIO Radio surface more content with clear grouping of personal and new content. On NIO Radio, users can see friends and listen to related content.

• 04

  A more emotional player

  Emphasized lyrics. Full-screen mode with soft animation as emotional background activates when no interaction for a few seconds.

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.