SiriusXM
SiriusXM
SiriusXM
Enhancing user experience by creating efficient navigation solutions of a stream in the SiriusXM app.
Tasks
Research
UX UI Design
Prototyping
Usability Testing
Timeline
May - June 2024
(8 weeks)
Overview
The SiriusXM app offers users a comprehensive platform for streaming music, live sports, podcasts, and exclusive talk shows. Recently, while enjoying a stream on the app, I encountered a navigation issue that hindered my seamless experience. While experiencing this pain point I found myself having to scrub through a stream to find specific sections of content and losing time for listening enjoyment.
The SiriusXM app offers users a comprehensive platform for streaming music, live sports, podcasts, and exclusive talk shows. Recently, while enjoying a stream on the app, I encountered a navigation issue that hindered my seamless experience. I found myself having to scrub through a stream to find specific sections of content and losing time for listening enjoyment.
The SiriusXM app offers users a comprehensive platform for streaming music, live sports, podcasts, and exclusive talk shows. Recently, while enjoying a stream on the app, I encountered a navigation issue that hindered my seamless experience. I found myself having to scrub through a stream to find specific sections of content and losing time for listening enjoyment.
Problem
Statement
Problem statement
SiriusXM app does not allow users to find, or jump to, specific sections of a streamed show. Without this integration, we are restricting the ability to find relevant content causing existing and new subscribers to spend more time searching through audio than listening to what they want, when they want to.
"As a SiriusXM user I want audio streams to be labeled and segmented, so I can listen to a specific section of a stream when I want to."
"As a SiriusXM user I want audio streams to be labeled and segmented, so I can listen to a specific section of a stream when I want to."
"I want to be able to see the most replayed section of a stream, so I know which section of a stream other users listen back to often."
"I want to be able to see the most replayed section of a stream, so I know which section of a stream other users listen back to often."
"I want to know all artists’ names and song titles in a music stream so I can use the SiriusXM app as way to discover new music."
"I want to know all artists’ names and song titles in a music stream so I can use the SiriusXM app as way to discover new music."
Wireframes
Low fidelty wireframes were created to help determine main interactions and component placement.
Design Library
Design
Library
Following the Atomic Design System, I created the following design system to create the templates and pages.
Final Prototype
Using the low fidelity wireframes as a template and connecting the design system anatomy, the high fidelity prototype was created.
Exploring episode segments in a show's landing page
Page tabs: Episode landing pages have been updated to include an “About” tab, “Segments” tab, and “More episodes” tab to reduce vertical scroll and create organization.
Page tabs: Episode landing pages have been updated to include an “About” tab, “Segments” tab, and “More episodes” tab to reduce vertical scroll.
Segment lists: Users now have the option to start from any section of a show. Segment titles change state when clicked to indicate what is currently playing.
Finding relevant content with the progress bar
Progress bar overlay: User can hold and drag the progress bar to bring up an isolated search screen. When the progress bar is dragged right or left, the segment list will indicate what is currently being played.
Users can also click on the segment list to start playing.
Progress bar overlay: User can hold and drag the progress bar to bring up an isolated search screen. The segment list will indicate what is currently being played.
Users can also click on the segment list to start playing.
Most replayed graph: A “Most Replayed” indicator will appear below the progress bar once the user reaches that point.
Finding relevant content with the progress bar
Progress bar overlay: User can hold and drag the progress bar to bring up an isolated search screen. When the progress bar is dragged right or left, the segment list will indicate what is currently being played.
Users can also click on the segment list to start playing.
Most replayed graph: A “Most Replayed” indicator will appear below the progress bar once the user reaches that point.
Discovering music with a track listing drawer
Now Playing CTA: If the user wants to listen to a specific song from a stream, the CTA below the “Now Playing” indicator will bring up the track list overlay.
Track list drawer: The track list drawer will allow the user to pick a specific song from the track list.
Shareable: After exiting the track list screen, the user can now share the episode, or song, with recent contacts or on other apps.
Discovering music with a track listing drawer
Now Playing CTA: If the user wants to listen to a specific song from a stream, the CTA below the “Now Playing” indicator will bring up the track list overlay.
Track list drawer: The track list drawer will allow the user to pick a specific song from the track list.
Shareable: After exiting the track list screen, the user can now share the episode, or song, with recent contacts or on other apps.
User Testing
User
Testing
To test the functionality of the prototype I spoke to 5 candidates over the course of 3 days with a mix of (3) males and (2) females. As a baseline, each candidate had experience using similar streaming apps to SiriusXM such as Spotify, Apple Music, and Youtube Music.
Results
The research aimed to assess user satisfaction on 3 cores areas: Discoverability, UI comprehension, and feature desirability.
Discoverability
100% of users were able to locate the new features.
Giving it an average rating
of 9 / 10
Discoverability
100% of users were able to locate the new features.
Giving it an average rating of 9 / 10
UI Comprehension
100% of user understood the UI of each feature.
The average rating the ease of use was a 9.3 / 10
UI Comprehension
100% of users understood the UI.
The average rating the ease of use was a 9.3 / 10
Desirability
4/5 users found the feature to be useful.
The average desirability rating was a 9 / 10
Based on user feedback, the following changes were made to form the final prototype.
· Enhanced episode segment tabs visibility by adjusting their hue.
· Incorporated a dynamic icon adjacent to the segment in play.
· Enhanced the interactability of progress bar by magnifying it by 15%.
· Rendered the segment list interactive.
· Incorporated a dynamic icon adjacent to the segment in play.
· Enhanced the interactability of progress bar by magnifying it by 15%.
· Rendered the segment list interactive.
· Incorporated a dynamic icon adjacent to the segment in play.
· Made Now Playing CTA more discoverable.
· Reordered naming convention track list to feature song title first.
· Made Now Playing CTA more discoverable.
· Reordered naming convention track list to feature song title first.
· Added a share feature for use as music discovery and share tool.
· Added a share feature for use as music discovery and share tool.
Looking Ahead
Looking
Ahead
· Discoverability is key. Continue to evolve the prototype and test for ways to make it easier for users to find the segments features.
· Bookmarking. Think of ways for users to bookmark their own favorite segments of an episode to build personalization.
· Make it shareable. Continue to evolve how a user can share episodes, or segments, with friends to grow SiriusXM as a media discovery tool.
Key Takeaway
Key
Takeaway
At first, I aimed to generate an innovative idea completely new to streaming services. However, I soon realized that originality isn't the sole focus. While unique concepts are valuable, achieving similar outcomes is feasible by introducing learned behaviors from other successful music streaming services. Throughout the process I learned the importance of keeping interactions clean and simple, maintaining a clean and organized design system, and the importance of user testing through every stage of prototyping.