Every word counts.
nēdl, a native mobile app, allows users to search over 120,000 live radio stations by keyword, song or artist.
Case Study - Redesigning the nēdl App to be Usable While Driving
What is nēdl?
nēdl is an app that lets radio listeners search live broadcasts as easily as they search the web - by keyword. It is currently available on iOS and Alexa.
Why is nēdl different?
Unlike other music apps and services, nēdl, through its A.I. technology, has the ability to return search results based on what is being said or played in real time. For example: search for Jay-Z and nēdl will return a list of radio stations currently playing a Jay-Z song.
What's the challenge?
nēdl wants to grow it's user base
but is currently missing out on a
large segment of the radio
listening market - automobile drivers.
What are the obstacles?
nēdl is not safe to use while driving.
Design "Car Mode", an interface that gives engaged drivers access to nēdl in a safe and enjoyable way.
Original version of nēdl
Primary Role: UX Designer
Secondary Role: Art Director and Copywriter
My team shared duties throughout the UX process and took on additional roles as needed. I wore many hats and with my background in art direction and copywriting, I took on those roles and did most of the graphic design and asset production work. Software used: Sketch, Photoshop, InVision, and Google Suite.
We used design thinking and agile methodologies throughout the full UX process, which I've documented in the case study below.
The UX process is not linear. This case study is arranged in a linear fashion but that's not the full story. Design thinking and agile UX are iterative and flexible.
In-car listening still makes up
a majority of the radio
We surveyed and interviewed over 40 people revealing that when they listen to live radio, it’s primarily when they are driving, and that aligns with this Edison Research Report.
In order to grow their user base, the focus must be to make nēdl safe and enjoyable for engaged drivers to use.
In general, it's not safe to handle a phone while driving.
The focus of an engaged driver needs to be on driving. Through Heuristic evaluation and observational analysis we identified issues with the current design of nedl that make it unsafe to use while driving, including:
• Small text is hard to read quickly
• Only way to search is to type
• Typing into a text field is
dangerous when driving (and is
• May require two hands
• Content and navigation elements
are not quickly scannable
Original nēdl design
nēdl has the core functionality to provide the content drivers want but the current interface is distracting and dangerous.
How might we create a safe, intuitive and delightful way for drivers to discover and play radio content with nēdl?
Most people listen to live radio in the car, a significant amount of them listen in the car exclusively.
Survey was conducted over 3 days with 40 respondents.
Interviews were conducted over 7 days and were conducted in-person with 10 interview subjects. Answers were recorded on audio. Subjects were drivers based in Los Angeles, who listened to the radio and were aged 22-35.
Features of Mobile Apps Designed for Engaged Automobile Drivers
We wanted to understand some of the best practices from other apps made for use while driving. We learned that simplified interfaces and quick, easy access to information and content are common among apps made to be used in a car.
An app that aggregates and simplifies all distracting technologies during driving such as calling, texting, music, maps, and social media and it simplifies the interface while incorporating voice command.
We conducted 10 in-person interviews and surveyed over 40 people to develop personas that represents the physical and emotional needs of our target as they listen to the radio while driving.
Only listens to radio in the car
Always changes station during commercials
Chooses stations based on mood
Likes a wide variety of radio content
Get’s easily distracted while driving
Has a daily 1 hour commute to school
"I'M AN AVID RADIO STATION SURFER"
MoSCoW METHOD: We can now map features to the needs of our persona as illustrated in the journey map.
I chose to use the MoSCoW(Must, Should, Could, Won't) method because it allows me to quickly organize the features I want to include by order of importance.
Ability to add/edit presets
Clear, large buttons
Vertical & horizontal view
Based on our learnings that there is wide variation in the orientation that people use their phones in the car and nearly everyone uses preset buttons to navigate radio stations, the nēdl app should work in both vertical and horizontal screen configuration and preset buttons should be a key feature.
Vertical Layout: Full Featured Mode - Play and Edit Presets
Access all other parts of app.
Create New Preset:
Tap to create new
Current Station Info:
Station name and other relevant info such as current song, time code, and number of current listeners.
Navigate Station List:
Tap or swipe to navigate next/previous station.
Add to Favorites:
Tap to add to favorites list.
Numbered to appear similar to physical preset buttons on a radio but also labeled. Press and hold to edit.
Highlighted below, usability testing with paper prototypes helped identify problems and led to solutions. We conducted in-person testing and recorded the results on video so we could compare and focus on the most common issues first.
The interface as we tested it was interpreted more as a static playlist not as a preset in car radio.
Don’t call it a preset button, come up with a new, descriptive name - Smart Scan.
Mood Board - Expanding the Visual Language
Based on the needs of our persona to be able to quickly and easily scan and select content, it was necessary to expand the color palette. For way finding, it was also important to make content visually distinct from interface elements. Introducing an “active” color to highlight navigation elements would help our persona quickly and safely use the app while commuting.
Reference: Spotify uses colors to visually separate content from navigation
Reference: Example of active color to highlight navigation
The New nēdl
Featuring Smart Scans, which are really customized live searches that users can create and edit. All current app functionality is accessible in the global navigation. We also introduced highlight colors to improve visibility. Turning the phone horizontally activates "Car Mode", a play-only mode that has bigger buttons and a simplified interface.
Two Modes of Operation
While we started out thinking Smart Scans would be for Car Mode only, it turned out to be a more practical and effective way to listen to the radio, not just in the car. Car mode is simply a focused and safe way to listen to the radio while driving.
All features available:
Play Smart Scans
Edit Smart Scans
New Smart Scans
Scroll to see more Smart Scans
Full global nav access
Play Smart Scans
Play Favorites List
Voice Control Search
Swipe to see more smart scans
Experience and Insights Gained from this Project
• Managing the demands and expectations of a client
• Acting as a team leader in a design sprint
• The understanding that it's ok to fail because failure provides valuable insights
• Insight: Don't get emotionally attached to a design, it can affect the whole UX process