XO

Mobile App

 

Client: Personal Project
Role: UI/UX Design

Music Discovery - Simplified

I designed XO to make that discovery as simple as possible; just listen. If you want to interact, you can. If you want more depth in what is or is not surfaced to you; that control is there too. If you want to know more about the music you're listening to or share it or save it for later, all there. But not omnipresent. Simply, easily, discover music how you want to.

Problem: Finding the music you already know is easy. Discovery of new music could be improved. Soundcloud search/next music is limited. Pandora is also limited but in different ways. The user has to make a playlist via song, artist, genre, or other predetermined information. I generally don't know where to start and end up playing the same lists over and over.

 

Simple Research

Diving into some really basic competitor research I downloaded and tested a few apps under the search term "music discovery." Apps included Museeker Music Discovery, Spotify Music, Beats Music, 7Digital, XBox Music, Soundcloud, Indie Shuffle, Google Play Music, and Shazam. I also read through some nielsen industry research.

Sound Cloud: I like the recommendations once you search for and start playing something and I like the simplicity of the music player interface for android tablet. But again you have to start somewhere with direct input. You can't mix and match genres, and the iOS app still feels difficult to navigate.Like how do you get back to your "stream" once you've searched for a different genre? (this is a bug, it should be the top item on the drop down list, but the list gets weird after using the app for a bit). It also looks like Soundcloud has a developer SDK and various other useful goodies that would potentially make an MVP product easier to implement.

Google Play Music: What's up with the orange? Looks like no one learned Home Depot's lesson about women not liking orange. I'm assuming music propagation skews female along with much of consumer behavior. An assumption that I would like more information on, but am limiting research time on this project intentionally. And a 10 minute googleing didn't yield anything specifically useful.

Spotify: I set up an account some time ago but haven't used it beyond that first day. So perhaps Spotify got an unfair advantage in providing content. Then again, looking through their music is all lists. Terrible lists that make me pick something randomly.

Beats Music: Total failure, couldn't log in. Despite the website having a pretty video and some interesting screenshots claiming to be great at playing the right music at the right time I could not get past trying to create an account on my tablet. Perhaps it thinks I didn't really want to listen to any music?

Scribbles of ideas, more research, and making the beginnings of a logo. It needs some refinement, but will do for now. Working through some ideas and looking over other apps the idea of broadcasting music to others came to mind. I think the "feed" list style of showing what others have shared or showing all the music in a genre is just to much to process and leads to indecision or random decision making by the user. So, let's nix the idea of listing music and just play something. Given the yes/no of the design concept it's become a bit of 'Tinder for music discovery' (not sure why it's the popular thing to call that the tinder model when other people did the exact same thing before. "Let's Date" for example).

Alright, let's talk about core functionality and features. I think the core feature is the user experience from the first app launch to discovering new music seamlessly with as little user input as possible. Going as far as only having to tap the launcher icon. Beyond that, narrowing listening choices by various criteria (maybe genre and mood to start) is probably something users will want. Saving songs to play lists, playing those lists (shuffle multiple lists?), skipping songs, and re-playing songs would also be useful. Perhaps a social component but I'll leave that alone for now and see what evolves from some initial designs.

Ok, translating those sketches into something prettier in photoshop. Iterating on positioning of various elements, user flow, and visual design along the way. Including propagating the logo XO throughout the app where appropriate.

Mockups of the initial listening screen, first not playing. Then the same screen showing user comments pulled from soundcloud, which I think they need to surface more visibly. Minimal progress bar and mini visualizer. There is also the xo button on the top left for an options menu. I was also considering a play/pause button in the top right corner, but I'm not convinced it's needed. No instructions should be needed, but eluding to interaction by showing the O animate from a circle to the visualizer form would be interesting. Dev thoughts, for the 'home' music judging screen we probably need to pre-load 10 seconds of the next song (possibly two) so that it can play seamlessly when the X is hit.

While you could just listen to songs on the home screen, taping the O, because you like the song, will bring up the song information, the rest of the app functions, and transform the O into a cool animated visualizer. First, the user info if the song was socially broadcast from your social contacts. Then icons to save to a playlist, like, and broadcast the song (add cool visual of broadcasting). The song and artist title at the bottom is on a card that can be pulled up to see more info and the album art. Long user comments should all start at the same point and run off the screen then scroll left.

Mockup of the full song info card. Background should fade in as the card slides up into place and is simply a blurred version of the album art at 100% height and center cropped.

Menu options: I wanted this to be bold and simple like the rest of the app, and still be powerful for super users to have lots more control. From the top, broadcasts from your friends (number is the amount of pending broadcasts). The X or O shows wether each is on or off. Slide each item left/right to set the relative percent of each section to play. 

Taping into each item brings up it's options in card similar to the album art card.  Some of these need more love, but you get the idea. At the bottom of the side bar, account info, sign in/out etc. all the functions users don't need daily but still need to be in the app.