User Research, Visual Design, UIUX, Prototype, Wireframe, Storyboard
Role:
Team:
Rio_jiang, Justin_chai, Qianshi zhen
Tools:
Sketch, Figma, Illustrator, Photoshop, After Effects
Time:
Six weeks (2020)
Introduction
At California College of the Art, I've been working on many projects. Some projects are small, like redesigning some existing features: filters, search bars. And some projects are large, like the collaborative playlist that I will be sharing, which is a hands-on project with the Apple design team in our school's Valve Systems class. It covered multiple design phases and involved multiple stakeholders and cross-functional partners. It allowed me to better learn and practice product thinking and systems thinking


PROBLEM
PROBLEM
I want to add and share my favorite songs to the party music playlist.
Collaboration homepage
Invited friends
WHAT PEOPLE PROBLEM ARE WE TRY TO SOLVE ?
Imagine being at a friend's party where you are
not familiar with many people, however the
music you don't like either, would you be eager to
run away?
Problem Statement
I want to add and share my favorite songs to the party music playlist. Also want to make friends at party




WHAT IS COLLABORATION PLAYLIST ?

Apple Music User
-
18 Years And Older [18-24 (17%), 25-34 (23%), 35-44 (22%), 45-54 (15%), 55+ (23%) ].
-
Hosts or participants who like party and own Apple products
User Problem
-
User want to add and share favorite songs to the party music playlist.
-
User want to make friends at party.
Success metric
-
Increase Business KPIs
-
Solve User Problem
Final Design



Turn regular into collaborative, helping users invite friends to joying
Categorized collaboration function on the playlist sub-page.This function enables users to turn regular playlists into collaborative playlists by inviting friends to join. Users can also use an existing playlist for this purpose.
People can add songs remotely according to their preferences and find others with similar tastes through music
Users will get a notification when they receive the collaboration invitation. User can add songs through the add music button Also, user can select the song to view who added it, as well as view the owner’s profile and following information.




Allow users to manage collaborative playlists
Users will get a notification from Apple Music When friends join collaboration playlists. It ensures users know who’s joining. Users have the right to remove someone from the name list.

COLLABORATION PLAYLIST
Remotely "Collaborate" with friends and family on a same playlist


Disclaimer:
The concept was proposed before the launch of IOS14, then we followed up with a new version on the IOS14

HOW WILL WE SOLVE THIS PROBLEM ?
Process

Competitors, User Journey, Previous Research
So the first thing I did was competitor research, and I looked at how different designers designed their collaboration features on the app. Directly and indirectly, to help me think about this. in order to help me think this problem out of the box. Then I start my finding with my team of members, to see their reactions and options about couple of specific directions.
01
01
03
02
03
04

02
04
Understanding Our User
As a team, we first looked into our own experiences and found issues that we had encountered. By doing so, we were able to ask tailored questions to other users throughout each phase of product development and iteration to be sure that we were designing for voices other than our own.
Here are some questions:
​
-
What is the story of the experience that we want people to have?
-
What improves a party experience?
-
What are people feeling and thinking at a party?
-
What do users need from music at parties?
-
What change would make apple music valuable to the users?
What They Tell Us

Analyze & Category



Initially, we thought users would have little interest in managing the music at the party simply because it is commonly understood that the music choice was the responsibility of the host. However, we found that users were losing interest because they were unable to participate.
As a result, we learned that there was a lot of interest in collaborating on public playlists, not only as an audience but also as a participant.

KEY LEARNINGS
-
Hosts control the playlist at party, Lack of musical consensus.
-
Music (artist, name, style) helps people break the ice in conversation.
-
People like to share music with their small group of friends.



DESIGN PRINCIPLES

Invited people to add music
The function to invite people to add music remotely

Utilize the visual cues
User icons are key to helping users connect

Customized sharing actions
Customizable sharing options for users
Challenges & Constraints


Hard to change layout
Current layout has been proven effective, including:
​
-
Download & Three Dots on Top
-
Playlist Cover Detail Obviously
-
Play and Shuffle Feature
-
Music List & Play Now
•
​
Diverse Integration
Covering how to integrate new features of collaboration into Apple Music product systems.
Concepts Testing
Concept 01


Create a New Collaborative Playlist
Concept 02


Turn a Normal Playlist into a Collaborative Playlist

Idea Direction
Turn a Normal Playlist into a Collaborative Playlist
-
Large compatibility for different scenarios
-
More efficiency for user use


After chatting with team and made some refinements, we all felt this direction could be an ideal experience if we can implement correctly with great data support, even though it’s hard to achieve in a near future.
The whole team really felt excited about this design, we quickly prototype to present this concept.
User Flow
After constructing the user flow task analysis, we needed to find a way to implement a “collaborative” feature that does not disturb users, but also appears quickly when needed.

Wireframes
User send an invitation to friends

User collaboration on playlist

Tracking

Break Into A/B Testing

Because the apple is very data driven company. That evering has to be A / B tested before putting into the site. So next thing I did is I worked with our PM, and members , we did try to break the idea concept into some testable hypothesis.
Prioritization

We also did a prioritization meeting, with the purpose of mapping different testing ideas into the impact VS effort matrix.

A/B TESTING
Because Apple is data-driven for each feature, we invited 10 Apple Music users to do an AB testing. We divided them into two groups to see user feedback .
Goal
-
The user easy to know each page of features and guide user into next step.
-
It is not only in line with Apple systems, but also meets the behavior of Apple Music users.
Task
-
Invited friends collaborate a playlist.
-
Manage the collaboration playlist.
-
Following People who share the same taste in music.
Action Button Test
Highlighting Collaborative Action Buttons


Option 2 - Wining Direction
​
“collaborative” with the icon and integration into existing categories, not only does not disturb users but also appears in time when needed.
Add People Test
Highlight Invitation Page by Visualization


Option 2 - Wining Direction
​
Most of user think the option 02 more clear to know the feature of this page.
Sharing Options Test
Suggested Sharing Options for Different Situations


Option 2 - Wining Direction
​
”Can Change and Invite Others" will confuse users, from the participants' point of view, they just receive the invitation message and join it, very small probability to share it twice.
Collaboration Homepage Test
Group the Participants Profile Image


Option 1 - Wining Direction
​
Testers feel that option 01 presents a clearer way to let users know the features of the playlist, while also increasing socialization by making it easier to click on the participant's icon.
Prioritization


COLLABORATION PLAYLIST
Final Design
Personal
Justin - Host
Justin loves to socialize and share fun things.
Tomorrow is his birthday, In order to give everyone a good music experience at his birthday party, he tried the new feature of apple music "collaboration".

Stella - Participant
Stella is Justin's best friend and the night before his birthday, she received a notification of a collaborative music playlist invitation from Justin.
_gif.gif)




Scenario 01
Justin creates a collaborative playlist and invite friends to join party




Scenario 01
Justin get a notification from Apple Music when stella join
_gif.gif)



Scenario 02
Stella received an invitation and add music on playlist and explore others
Reflection
Keep Learning, Keep Iterating.
As a product builder, the journey is 1% finished, you know there are always new blind spots to learn, new people problems to discover, and new work to iterate on to make our products great. I think the best product work comes from always being in close contact with the people we're trying to develop for, understanding what they really care about and what problems they have.
​
​
Quick Wins + Big Picture
Break large design to small testable experiments
​
​
Collaboration
Bring stakeholders along the way
Next Steps
Prototype & User Testing:
Collect user feedback for further iterations. Analyze detailed performance data as a reference for the next version.
​
​
Scalable on Any Screen:
Being able to make all the elements of our content fit on any screen; Make it flexible.
​
​