The goal of this exercise is not to only create a user interface that puts simplicity, usability, and design consistency as top priorities but a product that would be meaningful to users and Facebook as a whole.
Why Music?
Music plays an integral part in our culture, whenever humans come together for any reason, music is there. It brings people together, creates relationships, and hardens bonds—what could be more meaningful than that?
Remember those 'music DJ rooms' that popped up five years ago? — plug.dj and Turntable.fm — where you stream music together live with friends. They were great ideas on paper, but what they were lacking, was the social integration; people didn't continue using it, it was just a fad.
Why Facebook?
One thing that is now become apparent: the advantage of integration with an already strong base. As we're on the topic of Facebook, look to the introduction of 'Stories' in Instagram, the FB App, and Messenger. Facebook has whats needed for most of the 'chicken and the egg' ideas to succeed. It has not just one of, but THE most concrete social media base there is. I believe that the concept of music sharing could be making a huge comeback— seeing the success of Facebook's Live platform—and the fact that some are creating 'music streams' with it. You should look to how your users are using and creating with your product to be able to plan your next step.
First, music streaming.
I like to begin initial designs in greyscale. This allows me to effectively create harmony between the shapes, positioning, and proportions themselves. Color should complement the experience not be it.
With the final touch of color and visual sugar, the final product has it all there: visual appeal, usability, and altogether harmony.
Overall, most of the interface should be self-explanatory as it was designed to have no learning curve, everything is where you'd expect it to be.
Motion is there to create emotion. The movement of the waves adds a unique and meaningful feel to the music listening experience. It's not just there to look pretty. The timing of the waves is to match the bpm of most of today's music, meaning it should be able to add feel and emotion to 90% of the music you play.
Again, as everything is where you'd expect it to be, no learning curve or explanations needed.
The Artist profile screen. One problem I've had with other music streaming services is that Singles, Albums, and Remixes are all jumbled up into the 'albums' tab, which makes it extremely confusing to find the one you want.
A simple solution, that surprisingly no one has done — is separate them into the three categories. Which is not difficult to do at all.
Now onto Live Radio.
Live radio works on the principle that anyone can be a DJ. In your live radio feed, you have a mixture of friends' currently live streams and sponsored streams. You have the ability to comment live, exactly like a standard FB Live.
The addition of sponsored radio stations will allow for revenue from the service, artists can also sponsor their albums/tracks to be placed on the front of the browse page or recommended to users.
With its direct integration in Messenger, it's one less app to use, and music listeners will end up using Messenger more often, not to mention sending music to friends, etc. Especially encouraging teens to use Messenger more.
This also opens up another medium for advertisement that Facebook can use. It already has targeted ads, this can be integrated into the system so when you're listening to a radio station hosted across the world you still get targeted ads. This is beneficial to the advertiser massively as they expand their ad reach to people that don't typically listen to local radio.
Features to be added soon:
Group/Party rooms — which allows everyone in a messenger group to add to a live playlist and listen together. And the interface for the DJ hosting the live stream.
Radio Host Interface — Be a live radio host where you can play music from the library on a playlist, speak through a microphone/input or both.
Advertising Interface — Targeted radio ads, a person does not have to be listening to a station hosted locally to receive local ads.
More Detail on Artist Page — Albums, etc.
Ninja Update! iPhone X version, updating the design to make use of the new screen.
Designed in Sketch. Prototyped in Origami.
