JAM JAM:
NYU ITP THESIS PROJECT : presentation video


A multi-user mobile app that shuffles multiple music playlists automatically through a simple competitive game.

Interaction Design, Prototyping, App Development

Tool: Sketch, Invision, JavaScript 



BRIEF

This is a mobile app that solves the world’s greatest problem…who gets to control the music playlist?
Jam-Jam is a playful and democratic music player that helps create a mixed playlist that everybody can enjoy.



INSPIRATION

I love music and we all love music.

Music is always on in our lives. 
Music is powerful as it can change  the mood of the environment and the people that reside in it. 



These shared musical spaces bring out strong emotional connections between each listener.
Hip-hop, jazz, classical;
All these different genres deliver all different emotions and moods, depending on where we are and who we are with.






PROBLEM

However, sometimes an annoying situation happens when we are listening to music together with friends.
Someone needs to control the music but it is hard to satisfy everyone because we all have different musical tastes. 
If there are more than two people in the same room who have different musical tastes, 

Who will control the music?





OTHER APPLICATION RESEARCH

There are several music services that people usually use these days: Spotify, apple music, youtube.
They all have their own way to collaborate music list with others.
For example, Spotify’s collaboration feature provides the ability to let your friends add their own tracks to your playlist.
And any collaborators can add or delete tracks at any time...

But I wanted more fun and dynamic interaction and make people to participate in a real time.
These thought led to my next question.







GOAL


How can I shuffle music playlists in a fair and equal way? Based on this question, my goal was to find an answer to this small dilemma in my own playful way.
So I ended up with two key words,


"Competition"  +  "Shuffle"

Making people to compete for their music! But I wanted the users to focus on the music-listening experience rather than the competitive action.



So I chose a simple and dynamic “shaking” interaction for the game. It is fast and dynamic,
so that users may quickly associate this action with the process of mixing music.






USER CASE


Just imagine you are chilling with your friends in your place having a home party or relaxing in Central Park
or driving to somewhere.


You guys want to turn on some music, but whose music?
There must be some people who want to control the music or maybe no one.



They can use this app in these cases.

Make everyone to participate to share their music tastes.
If someone wants to play his/her music more, than they should win the game,
and if someone doesn’t want to play his/her music, than let them just relax.




USER FLOW




GAME CONCEPT
Here is an example of how the game works.


1. There are 3 players playing this app. 
Each player has 10 songs in their list.



2. The game will start and they will have to shake
their phone as fast as they can within 5 seconds .
3. Based on the score of each player,
they will get different numbers of music to play.



4. the app will shuffle the songs that the players created
in the beginning and play the music automatically.



the main concept is
“IF YOU WANT TO PLAY YOUR MUSIC MORE, SHAKE IT MORE”,the highest scores from the game will get more opportunities to play his/her music.



TECHNOLOGY

Spotify API for the music  +  accelerometer sensor value for the game  +  Socket.io to connect the players in a realtime.


USER TEST

1. PAPER PLAY TESTING

At the very first beginning, when I only had a very rough idea, I did a paper play test to see
how the concept works to other people and see how the situation flows.




2. INVISION PROTOTYPE

Next, I made a prototype using Invision that I can simulate my design like a real app,
so users can actually interact with the page and see how it works without my explanation.




3. JAVASCRIPT PROTOTYPE
At the end, I tested with updated Invision app and working prototype.



WIRE FRAME
( I revised some of the user flow based on the feedbacks from the user tests )



VISUAL DESIGN