top of page
Nano Music Player
ROLE
UX Designer
TEAM
Individual
DATE
2020
RESULT / IMPACT
01
Boosted user engagement and retention by 30% through innovative emotional design
02
Successfully collaborated with Spotify, Tencent Music, and 4 other TOP music apps
03
Surpassed 8.4 million monthly active users on vivo Origin OS
OVERVIEW
Small but Significant - More than just something
Origin OS Nano Kits simplify human-computer interaction by providing one-click access to essential functions and removing unnecessary information for a smooth desktop experience.
As the UX designer of the Nano Music Player project, I streamlined the user experience by integrating various music applications into desktop widgets. By refining information and improving interactivity, users no longer face the hassle of constantly switching between apps. I was independently responsible for the entire design content of the project.
RESEAECH
According to a report by QuestMobile, as of December 2019, the average user in China had 2.3 music apps downloaded on their phone.
In China, it is likely that most people have encountered the issue of being unable to listen to non-copyrighted songs on their preferred music app. Due to copyright restrictions, digital music is distributed among various apps, and it is common for users to have at least 3 music apps installed on their phones and they may switch between them frequently to access different music libraries or features.
Research Methods:
01
Conducted user interviews and surveys to understand the needs and pain points of current music player users.
02
Analyzed competitor products to identify common features and areas for improvement.
Surveys
Sample size: 187 participants | Duration：3 days
How many music apps do you use on your phone?
1.
2.5
Music apps
What are the names of the music apps you use? Top 3
2.
-
Tencent Music - 31.4%
-
NetEase Cloud Music - 26.2%
-
KuGou Music - 11.5%
How often do you switch between music apps in a day?
3.
6-10
Times a day
Why do you switch music apps?
Top 3 answers
4.
-
Limited song selection - 36.4%
-
Different song list - 24.8%
-
Explore new music - 19.2%
Research Findings
01
02
03
Many users in China have multiple music apps on their phones, with popular apps including Tencent Music, NetEase Cloud Music, and KuGou Music. (strong potential for collaboration)
Users switch between music apps frequently, with 36.4% of them stating that they do so due to limited song choices available on their current app.
There is currently no platform available that can consolidate all music resources in one place.
CHALLENGES + SOLUTIONS
Challenge 1: Balancing Attractive Design with Complex Business Collaborations
Solution: The Nano Music Player maintained a sleek, user-friendly design while integrating multiple music platforms by securing licensing agreements with Spotify, Tencent Music, and 4 other TOP music apps. Using intuitive navigation and emotional design elements, we created a unified interface that increased user engagement and retention by 30%, benefiting both vivo and its partnered music platforms.
Challenge 2: Balancing Simplicity with Functionality
Solution: Prioritized essential features based on user feedback and implemented a clean, minimalist design. Used progressive disclosure to hide advanced features under secondary menus, maintaining a simple interface for basic users while still catering to power users.
Challenge 3: Ensuring Cross-Platform Consistency
Solution: Developed a design system with standardized UI components and guidelines. This ensured a consistent look and feel across different devices and platforms, enhancing the overall user experience.
Displayed on the vivo X100, launched on November 9, 2020.
DEFINE THE PROBLEM
Problem Statement
Listening to music plays an important role in the user's cell phone use scenarios, but in China, users face the frustration of constantly switching music apps due to copyright restrictions of different music applications.
Design Opportunity
Imagine having the ability to integrate the playback functions of various music apps through a streamlined desktop tool, allowing for seamless one-click playback and switching directly on the screen.
Design a desktop widget that consolidates popular music apps like Tencent Music, NetEase Cloud Music, and KuGou Music. This will address scattered music resources and limited song choices, providing a single platform for users to access their preferred music content.
The widget presents opportunities for collaboration among music apps, benefiting both users and app developers.
DESIGN IDEATION
Product Logic
After deciding to use the desktop widget as a carrier for the integration of different music resources, I thought about the product logic of the desktop widget from the system level and application level and clarified the functional properties and information display of different system modules.
User Flow Chart
Define the user process of "play" according to different situations.
With the interaction approach identified, my challenge was to provide an engaging user experience solution for the Nano Music Player.
Brainstormed various design ideas and functionalities that would enhance user experience
As a UX designer, my goal is to bridge the gap between the digital world and the physical world by creating an immersive experience for users. In the real world, objects are multi-dimensional and tangible, offering a rich sensory experience. However, in the digital world, many objects only offer a single surface and limited feedback.
With this in mind, I aim to bring a more engaging experience to digital interactions. My inspiration for this comes from my own childhood memories of listening to music on a Sony Walkman. The simple clicks and joy it brought me left a lasting impression, and I want to evoke those emotions in users through my design work.
MOOD BOARD
Created mood boards and sketches to visualize initial concepts.
Bringing the real-world music experience to life through design. Focusing on the connection between music and people, our design explores the three core elements of a traditional music player to create a closer, more meaningful connection with users.
PROTOTYPING
Defined the user process of "play" according to different situations and identified interaction approaches.
Trying to create a truly impactful product is difficult, and the prototyping process is both the most enjoyable and challenging phase.
I spent a month trying out various prototypes. In the beginning, I only made some very simple and rough prototypes. At this point, prototyping isn't just about solving an immediate problem, it also offers opportunities, even luck. When you start sketching or creating, you discover new possibilities.
01
Developed lo-fi wireframes to map out the basic structure and flow of the music player
02
Conducted multiple rounds of prototyping to explore various design possibilities
03
Animation-Progressed to hi-fi prototypes using tools like Figma, incorporating branding elements and detailed UI components
DESIGN TESTING
What’s working/not
01
Conducted usability testing sessions with target users to gather feedback on the prototype.
02
Refined the design based on user feedback, focusing on improving navigation and feature accessibility.
03
Discovered that almost 25% of users wanted a black theme, leading to the creation of a dark mode version.
FINAL DESIGN
01 Let the Music Dance
The play button features a dynamic design that visually responds to the music's rhythm, making the interface feel alive. The interplay of colors and shapes around the play button reflects the emotional journey of the music, enhancing user engagement through visual feedback.
Nano Music Player- Pause
Play
Loading
The color scheme for the music app is carefully curated to enhance the user experience. Each music app has a unique color palette that corresponds to its style and mood, adding excitement and expression to the users' musical journey.
This thoughtful use of color not only improves visual appeal but also reinforces the emotional connection users have with their music.
02 Change a Record Way to Play
Drawing inspiration from the nostalgic experience of switching records and CDs, a simple tap on the CD icon on the left reveals a column of switchable discs representing different music apps. This intuitive interaction design offers users an easy and familiar way to switch between music sources.
CD in the Album Cover
Disc Drive
A CD
03 Some Rational Romance
Fermat's spiral
With the Fermat spiral incorporated into the speaker holes, the design creates a unique and visually stunning aesthetic.
This mathematical masterpiece adds an extra layer of beauty to the user experience, showcasing the interplay of science and art in the design.
04 Dark Style
Nano music player conducted testing resulting in valuable feedback that led to the development of a dark mode option, enhancing the visual experience for users who prefer a black theme.
With a design change to resemble a vinyl record, the dark mode provides an immersive and visually stunning experience. This mode not only reduces eye strain in low-light environments but also enhances the overall aesthetic, making the interface feel modern and engaging.
TAKE AWAY
In April 2021,
the monthly active users of Nano Music Player on vivo Origin OS are over 8.4 million.
From 0 to 1
The Ultimate Question:
Designing a product involves more than just functionality and aesthetics. The most crucial question I ask myself is, "How can I create a product that forges a lifelong connection with the user?"
The Solution:
The solution lies in a change of perspective. Instead of relying solely on conventional 2D projections, I aimed to capture the nuances of the physical world in 3D. This approach balances between 2D and 3D, creating emotional experiences that go beyond words and images, allowing users to form a deeper connection with the product.
Making it Unique:
The Nano Music Player is not just a digital tool; it integrates into the user's life with its sense of space, movement, and interaction. It transcends conventional styles, aiming to become a memorable and special part of the user’s emotional landscape.
Embrace the Magic of Music
The human quest for discovery can be divided into two paths: exploring the universe and exploring our hearts. Music belongs to the latter.
Since childhood, Jay Chou's music has been the soundtrack of my life. When you love something deeply, you want to share it with others. This inspired the creation of the Nano Music Player - to offer not just a smooth user experience, but to bring a touch of emotion to people's lives and leave a lasting impression through innovative design.
bottom of page