Apple Music
Making Apple Music more social!
Project Overview
Apple Music is a streaming service that allows you to listen to over 70 million songs and puts the entire Apple Music catalog at your fingertips across your favorite devices. Its great features include the ability to download your favorite tracks and play them offline, lyrics in real time, listening across all your favorite devices, new music personalized just for you, curated playlists from our editors, exclusive & original content and much more. For this reason, they want to improve engagement and retention in the app. In order to do so, they want to expand on their social capabilities.
Project Scope
Mobile Application Feature Integration
Speculative project.
Role & Responsibilities
UX Designer
User Research, Visual Design, Interaction Design, Usability Testing
Timeline
1.5 Weeks
Tools
Design: Figma
Organization: Whimsical, Miro
Workshop: Zoom, Google Docs
Understanding the Users
First things first, there is an evident awareness that there is a special connection between humans and music. Apple Music wants to take that connection further. It already has some core social capabilities, like following friends and seeing what friends are listening to. However, there’s much more that can be done, so it’s essential for me to conduct research to get a better understanding of the users.
My Research Goals were to:
Gain an in depth understanding of Apple Music streaming services
Identify music streaming trends and important facts from competitors
Identify Apple Music target audience and their overall experience
Learn more about Apple Music users’ goals, needs, frustrations, and motivations
Secondary Research
Market Research
I started with market research to learn the facts and obtain statistics about Apple Music and music streaming services/industry. The market research will contribute to two areas; my competitive analysis and developing the persona. In depth research can be read here.
Competitive Analysis
Following up on market research, I assessed the competitors in the industry to help identify opportunities, threats and patterns that users have through music streaming services.
Based on my market research findings, I was able to develop the provisional personas which I used for finding those to interview for my primary research.
Heuristic Evaluation
Based on the scope of this project, I evaluated Apple Music’s mobile app by referencing Jakob Neilson 10 Usability Heuristics for User Interface Design. By conducting heuristic evaluation, I was able to notice both strengths and weaknesses with the app’s usability. Being able to keep a mental note when moving forward with the overall UX process.
Primary Research
After the secondary research was conducted, I wanted to gain direct insight through user interviews. (See the interview guide here.)
I interviewed 9 participants; 6 female, 3 male between the ages of 19-27. From these interviews, I was able to make note of the users habits, their experience, and any frustrations they had.
Keeping the User in Mind
Being that secondary research essentially comes synthesized. We need to synthesize our primary research, which allows me to further empathize with the user. The method I chose to do so was through an empathy map which enables me to identify the users needs and insights through patterns.
Insights
Needs
5/8 Users prefer to share playlists instead of single songs
3/8 Users discover music through other providers
6/8 Users like the recommendations offered in the Browse feature
Users need to be able to personalize their library
Users need Apple Music to better communicate song availability
Users need the Listen Now feature to be more user friendly in displaying personalized recommendations
Meet Jamie
As a result of the research conducted, we now have our persona Jamie, a student and casual listener. The persona will serve as the user we are catering to when integrating the new feature.
Define the Problem,
Taking the insights from the primary research and needs of the user, we are able to create the POV statement. The POV allowed us to look through a user lens and ask HMW questions in order to form the solution.
then ideate!
Taking it a step further: Group Brainstorm
To expand on the ideate phase as well as implement more empathy, I conducted a group brainstorm to gain potential solutions from other users. This was done after my individual brainstorm, to ensure my mental flow was not swayed by other ideas as the sole designer as well as being able to see where ideas overlapped.
Brainwriting in Google docs
5 Participants
Ages: 26-30
Simplified HMW Questions
How can you share your playlist with friends while personalizing your libraries?
How can you promote ways to discover music within Apple Music?
Strategy
After ideating as many solutions we can come up with, it is important to come back around to the business goals and user goals. With this information, I was able to find the mutual goals between both parties to ensure I’m going in the right direction for the content of the design.
Referencing the above goals, and user needs, a product roadmap was created to have an organized list of features in Apple Music. Listed by priority, confidence, goal, and effort levels to help prioritize what to work on first. Considering my role in this project, I listed the integrated features as the first priority, and then included all of the current features.
Information Architecture
With the goals and a concrete view of features in mind, it is important to continue building on the structure. This was done through an application map; showcasing parent screens, child screens, and the integrated feature.
Back to basics
When moving into IxD, there are fundamentals to get through first before going straight into the design. Taking my research and even elements from the ideate stage, I developed a UI Requirements Document as an overview of the screens to design based on different tasks and additional requirements to help with this process. Full document here.
Using the tasks from this document, a task & user flow was created with multiple flows that the user would potentially take which will contribute to the design of the wireframes.
Wireframes
Low Fidelity Sketches
Now that the fundamentals to a successful design process are completed, I began sketching low-fidelity wireframes. Sketching enables me to examine what the integrated features can potentially look like before jumping into the digitization process.
Creating the Prototype
After designing the screens required, I created a prototype through Figma for usability testing. Having the test done on a High-Fidelity wireframe allows me to get realistic insights from subscribers on their experience with the new features. I can also detect any errors in the flows, and design thus far.
Testing it out!
Before conducting the usability test, it is important to create a Usability Test Plan with objectives, methodologies, questions, and tasks listed to measure the best results. The objectives are:
To evaluate the interactions the users have with the Apple Music’s mobile application
To observe users habits once given a task
To identify any pain points the user may have
To empathize and ask follow up questions to get deeper insight on what makes the experience best for them
The test was conducted remotely & in person with 6 participants and 3 scenarios/tasks, which were all recorded and transcribed. The methodology was Evaluative Research taking a Think-Aloud Testing technique. I made sure to have the participants verbalize their thoughts and processes.
The completion and error-free rate did waver based on a few factors. So, guidance was provided. It was made apparent there was an error on an important feature so I informed them of the proper action to take. This information was provided to allow the user to see the end goal of the feature, which invited conversation and positive emotions.
Affinity Map
After the testing, I organized my findings into an affinity map to identify patterns, insights, and the priority revisions in moving forward. To organize this map, I had to extensively review my transcribed notes which helped me fully notice all of the patterns the users had and what urgently needed work.
Insights
Upon tapping the Ellipsis on the playlist screen, 3 out of 6 users thought there would be an options to scroll for more options not correlating ‘Edit’ with adding friends
3 out of 6 users thought to access an artists profile to gain information about a live event rather than go to Listen Now screen
3 out of 6 users were confused on what artist they were looking for making Task 2 harder than expected
4 out of 6 users had errors with the exit screen from music video
Patterns
5 out of 6 users had issues adding friends to playlists, due to sensitive screen/design
For Task 3, 90% of users tapped the Playlist We Love section on the Browse screen when looking for subscriber created content
5 out of 6 users thought adding a friend(s) to their playlist made the Apple Music experience much easier
100% of users tapped Library to access playlists
5 out of 6 users thought to tap the Share button when it came to adding friends
Priority Revisions
In compiling the revisions, I implemented major patterns, insights and any other error/pain points on a second version of high fidelity prototype. To determine the priority of the revisions, I created a matrix considering the Value to the User and Feasibility of the task.
Branding
Wrapping up the testing, I went into branding. As Apple Music has an established Brand Identity, there was nothing to design only listing the integrated features where necessary. I started with a mood board in Pinterest, to have a visual confirmation of the current logo, color palettes, imagery styles, and typography.
Logo + Style Tile
From there, I created a Style Tile with what was gathered on my mood board and added a few UI elements. The Style Tile is essentially a mood board directly towards the UI design. It is important to have a visual point of reference as a guide for designers in addition to catering to clients needs.
The logo was not tampered with, and I made sure to obtain the necessary information regarding Apple Music and their logo guidelines.
UI Kit
The UI Kit is a compilation of existing UI elements on the application that provides references for future design and collaboration for the design team. Specifically for Apple Music, it was great to display design patterns, new elements, proper iconography, etc. This is also a living document and can be updated whenever there is an iteration of the design.
High-Fidelity Wireframes & Prototype
I revised the high-fidelity wireframes from highest to lowest priority to design the MVP for the business and users. Luckily, I was able to touch on each revision as well as things I personally noticed.
Final Thoughts
When I heard ‘seamlessly integrate a feature’, initially I thought it would be a seamless process. Not quite! This project had different loopholes and approaches that were required to be successful. I enjoyed the research & brainstorm phase most, because it was interesting to hear users current experiences and what they would like to see.
The most challenging part was developing the POV Statements + HMW Questions. It required a level of critical thinking that I did not experience in my Responsive Web Design process. I believe this was due to the app & brand already existing, so I had to think past the obvious and truly dissect my interview findings. However, with guidance and serious diligence I was able to compile the correct information.
Next steps
Design implementation & handoff:
Since the design has been tested and revised, it is ready to enter the development phase.
Maintenance:
Apple Music will be observing the updates activity, and revisions will continue, where necessary.