';

Streaming Music UI

Recommend
  • Facebook
  • Twitter
  • Google Plus
  • LinkedIN
  • Pinterest
Share
Tagged in
Description
Overview:
Marketing and metadata reached out to me to create a streaming music UI proof of concept. The goal was to showcase the depth and value of our music metadata. Over the course of one month, I conceived and designed over 20 screens that not only featured an alluring UI for the user, but a back-end UI as well. This showed potential customers that not only was this immense amount of data at their finger-tips, but that they could manage it with ease.

Process:
In mid-2016 I was approached by our metadata and marketing teams to help them pitch their music data to potential business customers. While the team had thought about what aspects they wanted to showcase, they needed stories to tell at the trade show. To me, this is just a simple task flow, but they would want to make a few stops along the way. I worked closely with a team that was on the other side of the country via a few phone calls to hash out these stories. The focus was two-fold: what do the end-users want to see and what do providers want to leverage?

With a four-week deadline I had little time for research and resorted to chatting with collegues from other projects about their consumption of music and the associated data. I allowed them to talk freely about their preferred streaming services and often steered the conversation towards finding out what data was important and what they found important in a UI. With a handful of notes and some stories to guide me, I was able to start by assembling some moderately detailed wireframes. Between the decision-making, task flows, user research and wireframe creation, I spend about two weeks (half of my allotted time).

My metadata contact was on the ball and provided me with some great feedback and praise from his department. Having a certain level of fidelity to the wireframes allowed me to basically 'color by number' and apply a visual design that directly correlated with the layout specified in the wireframes. With only two quick rounds of changes, I was able to deliver high quality comps on time. The sales and marketing people were thrilled to have such an attractive set of images to showcase the capabilities of our metadata. These results and acquired trust lead to many future projects with their departments.

Fast forward about 9 months and I'm called upon once more to update the demo for CES. Again, there's a short turnaround and a lot of hustle involved. This time, they wanted a clickable demo to guide their customers through the stories. The stories themselves received a few tweaks as did the UI. The data being showcased needed some updates as well to show relevance. Having confidence in the stories and the direction based on feedback from earlier in the year, the main task at this point was to scale the web design to a retina iPad screen and get it into Axure RP for interactivity. Theses are two of my strong suits. I enjoyed the effort and delivered ahead of time with several last minute additions requested by the team.