User Experience Designer

Busker

Busker

0.00

Brief: Create a tool allowing local musicians to collaborate with one another in the digital space. 
Timeline: 2 weeks
Teammates: Bo Fahs, Stacey Helmerich
Organization: Guitar Center, General Assembly User Experience Design Immersive
Process: User Interviews, Contextual Inquiry, Affinity Diagramming, Design Studio, User Flows, Wireframing, Usability Testing
My Role: During the course of the project, I was individually responsible for conducting a comparative analysis, concepting the natural language form, and wire framing, prototyping, and usability testing the Busker mobile app. I also collaborated with my team to conduct user interviews, perform a contextual inquiry, affinity diagram, and partake in a design studio exercise. 

Add To Cart
 



The Brief

Guitar Center is looking to provide tools for local musicians to connect and collaborate with one another. Their goal is to create a platform that would drive enough user engagement for Guitar Center to be considered a major player for musicians in the digital space.

User Interviews

Our team struggled with how open ended this brief was. With such a loose product definition, we knew it was integral to consult with musicians and determine how and why they collaborate. We performed user interviews of musicians in our respective friend networks, then reconvened to synthesize our feedback via an affinity diagramming session.

Our affinity diagram after a week of folding/unfolding. 

Our affinity diagram after a week of folding/unfolding. 

Key Takeaways:

  • Musicians define collaboration as making music with one another
    • Very few are interested in connecting to share business or industry knowledge
  • The process of finding bandmates and other collaborators is frequently compared to dating
    • The collaborations musicians cited as being the most fruitful stemmed from chance encounters, and blossomed out of personal chemistry 
  • Interviewees attributed their favorite collaborations to being in the right place at the right time, and seemed to be in a state of reverie when recounting these chance encounters 

These findings led my teammates and I to ask ourselves how we could create more opportunities for serendipity amongst musicians.

Contextual Inquiry

Armed with data from our user interviews, we headed to Guitar Center to see how our findings compared to the thoughts and motivations of musicians who frequent the store.

How networking takes place at Guitar Center.

How networking takes place at Guitar Center.

Our contextual inquiry revealed a lot about Guitar Center’s key demographic. We met and spoke with several customers, most of whom were local musicians. We also interviewed employees to get a better sense of Guitar Center’s business objectives.

Key Takeaways:

  • Local musicians will often visit the store and stay for hours playing instruments with their friends and bandmates
    • Collaboration hardly every happens between strangers meeting for the first time
  • In-store play is very performative, as if musicians are auditioning to join a band or signal their talent to other musicians 
  • There was a conflation between music and music gear
    • Employees and musicians alike are just as interested in talking about the instruments, pedals, amps, and other gear they use as they are about the music they make
  • Networking rarely happens in store
    • Bulletin board labeled “Musician’s Networking” was located in an uninviting, dark hallway leading to employee offices
Soul Food during one of their hours-long, in-store jam sessions.

Soul Food during one of their hours-long, in-store jam sessions.

Persona

The contextual inquiry process allowed develop our persona –The Amateur Musician. A teammate took the lead on fleshing this out, creating a realistic representation of our key audience to reference as we moved into ideation and design.   

The Amateur Musician:

  • Wants to meet like-minded musicians in his area and form a community
  • Is struggling to monetize his passion
  • Visits Guitar Center to try out new guitars, pedals, and other gear
  • Plays in store for long periods of time to facilitate chance encounters with other musicians
  • Is not interested in using a digital solution that would cut into the time he has to play music with others

Design Studio

With a persona and a clear set of needs identified, our team completed a rapid design studio exercise to brainstorm solutions. Though our final idea was not developed during this session, the process allowed us to understand constraints and gain a shared understanding of the business context and market opportunities. 

Breakthrough

Shortly after our design studio, one teammate had a thought:

What if we provided a platform, in a virtual space, for musicians to meet other musicians and collaborate with them in real time? They could broadcast their collaborations, and earn tips from fans.

He called it "Busker," the slang term for street musicians who perform for tips. From there, our team generated a robust set of features, including:

  • Random pairing of musicians based on desired criteria
    • Ex: Soul Food is looking for a drummer to round out their sound, so they log onto Busker, enter their desired instrument, and wait to be paired with a drummer who is also logged into the system
  • Private, virtual practice spaces to limit the impact physical distance has on collaboration
  • The formation of bands within the platform
    • Archives of past broadcasts would be housed on bands' profile pages
  • The ability to tag gear used in performances and link these items to Guitar Center's e-commerce site
  • Live chat where spectators can discuss performances and provide musicians with positive reinforcement in real-time
  • Sponsored participation from well-known musicians
    • Could happen via random pairing to drive usership
    • Could happen via private broadcast to paid viewers or contest winners

User Flows

With only a few days left to work on the project, we knew we'd have to pare our feature set down to an MVP. Our team took to the whiteboard and began mapping out user flows for Busker's core functionality: musicians meeting others and broadcasting music through the platform, and fans viewing these broadcasts.

Google Chrome -  - Screen Shot Jul 31 2015 1.24.16 PM.png

A teammate later created refined versions of these flows, allowing us to identify key screens to build prototypes of for user testing.

User flow for musicians being matched with one another and broadcasting a jam session.

User flow for musicians being matched with one another and broadcasting a jam session.

User flow for viewers logging into the system and finding a broadcast to watch.

User flow for viewers logging into the system and finding a broadcast to watch.

Comparative Analysis

With a clear direction and feature set defined, it was time to focus on design. I took the lead on performing a comparative analysis to investigate out of industry examples, comparing interfaces for displaying multiple video streams on a single screen, browsing through audio/video content, sending and receiving money, and chatting in real-time. 

Apps and services compared include:

  • Chatroulette
  • Twitch
  • Google Hangouts
  • Spotify
  • YouTube
I used Pinterest to create a visual representation of the findings from comparative analysis.

I used Pinterest to create a visual representation of the findings from comparative analysis.

These findings helped us determine that the Busker MVP would consist of a single-page web application for collaborating, broadcasting, and viewing content, with a companion app for viewing content and live-chatting with other users.

Sketching 

The comparative analysis fed into a collaborative whiteboard sketching session where we refined features and created a template for each of Busker’s key pages.

The early stages of the natural language form.

The early stages of the natural language form.

We struggled with the interface musicians would use to indicate who they were looking to collaborate with. Then I had an idea:

What if we used natural language? We could insert drop-down menus into an informal, conversational form, taking the complexity out of selecting multiple inputs (musical instruments and existing friends on the platform) to generate a collaboration session.

Our sketches outlined:

  • Items present in our main navigation
    • Search, Discover, Collaborate, and User Settings
  • A natural language form allowing musicians to input criteria for musicians they wanted to be matched with
  • The view for spectators of the performance
  • A chat menu where spectators could provide feedback on the performance and tip the artist(s)

Wireframing

After settling on the basic structure of key pages, I created a wireframe template in Omnigraffle of the site’s main navigation. This allowed us to divide work, and each wireframe an individual portion of the platform.

The Busker wireframe template.

Creating the Mobile App

After creating the master wireframe template for the web application, I switched gears and started working on fleshing out the Busker mobile app. I started by sketching out the most important screens.

Then I jumped into Sketch3 to create higher fidelity wireframes (selected screens shown below). 

Usability Testing


I used Invision to create a clickable prototype for usability testing, then ran a study with 3 participants. 

Key Takeaways

  • Tipping process needed additional confirmation to reduce error
  • The amount a user should tip was not readily apparent and users were uncomfortable determining an amount, leading to feature abandon
  • The artists’s bio should be consistent across all tabs to emphasize and reinforce the musician’s branding

I used the feedback from the usability testing sessions to create an improved prototype. Updates included:

  • An additional confirmation modal to confirm tip 
  • A default suggested amount to tip an artist
  • An update to the tabbed interface on artist pages allowing the bio to persist across all tabs

View Prototype →

Feedback & Next Steps

Feedback on Busker was overwhelmingly positive, with many users expressing their desire for our prototype to become an existing product.

This idea is gold! Maybe you should patent it?
— User Feedback

If I had more time to iterate on this project, I would work to incorporate broadcasting functionality from the desktop platform into the mobile app. Though mobile phones are less performant when it comes to capturing video content, I think musicians would appreciate being able to start an impromptu concert on the go.