The AudioRealm app offers an innovative, seamless listening experience tailored for multitaskers and busy professionals like, all wrapped in a uniquely designed interface.
My reseach revealed that users struggle with the current rewind and fast-forward features, finding them imprecise, inefficient, and difficult to customize. This is a market opportunity I wanted to explore and therefore I designed several features for a fictional app called Audiorealm that make scrolling and bookmarking easy, improving the listening experience for users and decreasing user frustration.
Role: Ux/Ui Designer and Brand Designer
Skills: User Research, Research Synthesis, High and Low Fidelity Prototyping, Ideation, Useability testing
Toolkit: Figma, FigJam, InDesign
Product outcome
I designed an app with intuitive controls, customizable features, and a user-centric design which eliminates common fast forward and rewind frustrations and enhances the way users engage with audiobooks and audio content.
Player Menu
I created a unique player menu, inspired by an old fashioned radio dial, that uses an intuitive circular way of scrolling back and forth.
The centralized player menu gives users several customization options without having to navigate away from the player menu.
StarSync
I have created an innovative feature called StarSync for Audiorealm. This feature automatically creates a bookmark when it detects a change in the listener’s physical behavior.
Users can easily choose to resume listening at this point in their listening experience.
Search through Text
I developed a new search feature using text. If users get distracted, they can simply scroll back through the text or type in a few remembered words, and Audiorealm will instantly jump to that spot, resuming their listening experience.
Bookmarks
I enhanced the bookmarking functionality. With a simple click, users can access an extensive range of options through the bookmarks pop-up, allowing them to easily edit selected quotes, add notes, and create custom titles.
Research
The research topic for the Audiorealm app was “Improving audio rewind and fast forward functionality in audiobook apps”.
My research revealed that users struggle with the current rewind and fast-forward features, finding them imprecise, inefficient, and difficult to customize.
To research this topic I conducted one on one and a competitor analysis.
I interviewed frequent users of similar audiobook apps with an age range of 20-40 years old. In these interviews I delved into user experiences frustrations and desires regarding audio navigation in audiobook apps.
In the competitor analysis I mapped weaknesses and strengths of Audiorealms main competitors including, Everand, Spotify and Audible. I analyzed which features sets Audiorealm apar from its competitors and performed a gap analysis.
“I would like more granular ways of skipping back, not just the 30 seconds or the chapters. It would be great if I could skip a paragraph or a sentence so that when I jump back into listening it makes sense.”
- Interviewee
Research Synthesis
My research highlighted several areas for improvement in audiobook apps, including issues with UI clarity, accessibility, and functionality customization.
To synthesize all the research data I created through methodologies like journey mapping, empathy mapping, affinity mapping creating and creating persona’s. These methodologies highlighted the following areas of improvement.
UI: Users state that general use of audiobook apps is easy but UI need improvements in visual communication and accesibility. Icons do not communicate clearly what their function is and some features and their customization are hidden behind menu’s and are therefore underutilized and cause user frustration.
Usage patterns: Users mainly listen while multitasking and relaxing and get distracted several times during their listening experience.
Listening experience: Rewind functionality is not granular enough, hard to customuze and inefficient in use. Some features have to be used multiple times to get the desired result and are imprecise in their scrolling use making it hard for users to have a seamless listening experience.
My research led to the following design principles:
Visibility
UI should clearly communicate options to user.
Mobility
UI needs to be operable on the go.
Efficiency
Getting a user to where they need to be in the minimum number of interactions
Granularity
Providing detailed customer interactions.
Ideation and design
Informed by the logo I wanted the visual strategy to evoke notions of new realms with calming colors that aid the listening experience.
Based on the design principles I created in my research. I aimed to centralize the information architecture, allowing users to access most features directly from the player menu. We focused on the following key points: Bookmarking, scrolling, behaviour and pop ups.
This appraoch lowers the interaction cost, makes the apps features easily accessible and promotes feature awareness in users.
To achieve this, we incorporated bookmarks and pop-ups, enhanced fast-forward and rewind precision with a more efficient scroll bar, and added a feature that tracks user behavior changes and bookmarks when distractions occur.
Prototypes and useability testing
I conducted useabilty testing with several people who frequently use audiobook apps aged 20-40. I asked participants to perform several tasks in a high fidelity protoype and observed their behaviour.
During usability testing, it became evident that some buttons and icons did not effectively communicate user options. Participants found it challenging to navigate between pop-ups and the player menu, and the scrolling granularity still needed improvement.
After two rounds of testing, I implemented several changes to the user interface (UI). The UI was redesigned to better reflect the logo and create more space for an improved text search feature. The StarSync toggle was replaced with an icon that better aligns visually with the app’s design. Scrolling granularity was enhanced by adding a circular, detailed scroll bar that provides more room for manual scrolling. Additionally, bookmarks are now more clearly linked to their corresponding markers on the timeline.