myousic

A lot of casual musicians want to progress beyond playing by themselves at home. myousic is an app to help get these people off the couch and go play music with other people.

This is my General Assembly 10-week solo UX project.

Final Prototype on InVision Class Presentation PDF

The Process

1. The Problem

Casual or beginner musicians want to find others of similar abilities and tastes, but current methods of connecting musicians don't suit their needs.

2. User Interviews

Interviews among target users, covering a wide range of gender self-identification and age, showed a common theme that proves my hypothesis to be flawed.

3. The Real Problem

This population of musicians is most interested in finding kindred spirits to play music with. This factor outweighed all other concerns.

4. Competitive Analysis

Existing technological solutions for connecting musicians do little or nothing to help these people find the kindred spirits they're looking for.

5. Idea!

What exists to connect kindreds spirits? Dating apps. I'll borrow from that world and make a dating app for musicians, without the dating.

6. Affinity Map

Interview insights are mapped using up-to-date Post-It technology. Data vary with regard to secondary preferences for gender, musical tastes and abilities.

7. Persona

Squint at the affinity map and Jen comes into focus. What are her goals, motivations, and frustrations?
Tool: Sketch.

8. User Stories

What will Jen want to do to achieve her goals? As an unregistered user? A registered user? A new user?

9. User Flow

User stories inform a user flow that will allow Jen to achieve her goals.
Tool: Draw.io.

10. Feature Prioritization

Target users are asked to prioritize possible features on a 2x2 matrix. Data prove my preconceptions wrong again.

11. Feature Card Sort

Open card sort by target users to test feature set, information archtecture, and how users see themselves accomplishing their goals.

12. Site Map

Card sort helps to inform a site map.
Tool: Sketch.

13. Paper Prototype

Screens are sketched out according to feature prioritization and commonly understood design patterns, and then tested.
Tools: Pentel P205, paper.

14. Wireframes

Test data from paper prototype are incorporated into low-fideltiy wireframes
Tool: Sketch.

15. Wireframe Testing

I expand the number of wireframes and build a prototype to test eight specific tasks.
Tools: Sketch, InVision.

16. Hi-Fi Prototypes

Incorporate test data, test again, then polish it up and test again.
Tools: Sketch, InVision.

What's Missing

What was shown to be lacking in previous round of testing? What would I add to the MVP in the next iteration?

Pivot?

What if we build it and they don't come? What could this project become with a nudge in different direction?

The Problem

Many amateur musicians would like to play music with others, but they have trouble finding others who are musically compatible, so they stay home and play music alone.

These folks:

  • lack experience and/or confidence
  • are beginners, or their skills have plateaued
  • love music but are not ambitious in that regard
  • lean towards introversion

The problem, I suspect: They do not have a good way of finding musicians of similar abilities, musical tastes and levels of ambition.

User Interviews

I interviewed four musicians from the perceived target market, men and women ages 18-48. A common theme emerged among all interviewees:

A kindred spirit far outweighs concerns about compatible skill levels and musical tastes.

“[Playing music is] an intimate activity.”

“Life is too short to hang out with people I don’t really like.”

“[Playing music is] kind of like our bowling night: hang out, drink a beer, play a show once a month or so.”

This was not the expected result.

The Real Problem

With research data in hand, I revised my hypothesis:

The less experienced musician does not have an easy way to find kindred spirits to play music with, so they stay home and play music alone on the couch.

Competitive Analysis

Competitive Analysis chart

I identified and analyzed three technological solutions for musicians to connect with each other: two websites and an app.

  • None of the competitors offer insight into personalities or compatibility, beyond the user's own self-description.
  • They’re geared towards people with more drive and ambition than our users, people who want to be in a band rather than just play music.

They can be extremely thorough and detailed ways to find a musician, but not a kindred spirit.

Idea

What else out there specializes in connecting kindred spirits? Dating apps.

myousic will collect as much insight as possible about someone's personality, tendencies, preferences, what they like and don't like, both music- and non-music-related, then crunch that data and compare it to others to find kindred spirits.

A dating app for musicians, without the dating.

(Ideally I would have tested the validity of this idea before further development, but for the purposes of this class project I had to assume it was brilliant and proceed accordingly.)

Affinity Map

Affinity Map photo

I mapped insights from user interviews to distill the target users' goals, motivations, and frustrations.

All interviewees placed greatest importance on finding a kindred spirit. Data varied with regard to desire for finding others with:

  • similar abilities
  • similar musical tastes
  • a particular gender

These attributes are commonly part of a user's profile description, so I decided not to make special accommodations for these.

Persona

Persona: Jen image

Meet Jen, born from the user interview affinity map. I focused on Jen as I addressed user goals, motivations, and frustrations.

Tool: Sketch

User Stories

What will Jen want to do to meet her goals?

A partial list:

  1. As an unregistered user, I want to test the app by searching and browsing among the registered users, so I can decide if I want to register.
  2. As a new user, I want to complete the new user questionnaire so the app can find compatibility matches for me.
  3. As a new user, I want to provide access to sound and video files so other users can hear what I sound like.
  4. As a registered user, I want to see who the app finds to be compatible with me.
  5. As a registered user, I want to search by keyword so I can quickly find a “tribe called quest” fan who plays “bassoon.”
  6. As a registered user, I want to view another user’s public profile, photo, audio, and video so I can determine compatibility for myself.
  7. As a registered user, I want to contact another user so I can inquire about playing music together.

User Flow

User Flow diagram

User stories begin to delineate a user flow. From this flow I can start to extrapolate a feature set for a Minimum Viable Product.

This was my first opportunity to simplify, by setting aside user stories that weren't directly applicable to the MVP.

Tool: Draw.io

Feature Prioritization

Feature Prioritization 2-by-2 Matrix photo

For the MVP I want features that users most expect and have the highest impact. On the 2x2 matrix, I asked two potential users to rate each of these features accordingly.

I was surprised that showing other users' locations on a map was neither expected nor high impact. Score another point for research vs. assumptions. Also score a point for personal privacy and security.

Feature Card Sort

Open Card Sort photo

Testing feature set, information architecture, pain points, and how users see themselves accomplishing their goals. This was an open sort of MVP features with blank cards provided so the testers could add features as deemed important.

Problems discovered:

  • What is the main page? Where does the app's primary function take place? There is no obvious Go button to make the app do what it exists to do.
  • What are these advanced search boxes and how are they different from Search Preferences?

Solutions:

  • Change language and appearance to convey that the app's default page (also the list of results following any change in search parameters) is the app's Main Page, its reason for being.
  • Simplify: remove advanced search from the MVP until a need for it becomes evident.

Results: In subsequent rounds of testing, users were observed using the prototype as intended without showing or reporting these problems.

Site Map

Site Map diagram

Sections:

  • Profile: divided into public/private areas
  • Results: the app's main screen continues down through individual profiles
  • Admin: divided between routine vs. onboarding tasks

Tool: Sketch

Paper Prototype

Screens are laid out according to feature prioritization and commonly understood design patterns.

Paper prototype usability test tasks:

  • Register.
  • Add a profile photo.
  • Find the guitarist with the highest match percentage and contact that person.

Tested by three users with paper sketches in hand. Results raised no red flags! Functionality was clear, and features were where they needed to be.

Tools: Pentel P205 with 4B lead, paper

Wireframes

Annotated Wireframes image

I cleaned up the basic layout in the sketches, annotated them, established a pattern from which to expand the number of screens for testing.

Revisions: added obvious Home button to global nav (app logo) so user can access main results screen from anywhere.

Tool: Sketch

Wireframe Usability Test

Wireframe Usability Test Results chart

I created 25 more screens and enlisted testers.

Usability testing tasks:

  • Register and answer five initial questions from the questionnaire.
  • Browse matches, find a sax player and try to contact that person (but user can't contact someone until user's profile is filled out).
  • Fill out profile, with profile photo.
  • Go back to matches, find closest musician, view profile.
  • That person doesn’t do it for you. You want to meet a banjo player who likes Loverboy. Find a banjo player who likes Loverboy (testing Search discoverability).
  • Contact banjo player who answers immediately. Read his reply.
  • LoverBanjoBoy creeps you out and you don’t want him to contact you again. Takes steps to prevent him from contacting you again.
  • Sign Out.

Problems: Noted in chart (right).

Decisions:

  • Make search more discoverable using size, color, and microinteractions.
  • Make Contact button more obviously aligned with user's profile photo.
  • Add cancel and back buttons at possible dead ends.
  • Make home button more clear using icon.
  • Move Register over Login on that page.
  • Rethink top nav on profile pages.

Hi-Fi Prototype

View hi-fi prototype on InVision

This step incorporates one subsequent wireframe iteration not shown, and adds a more polished final design.

Changes from first wireframes, other than visual design:

  • Put an unambiguous Home icon on the Home button.
  • Detach Contact button from the foot of the viewport, make it bigger and closer to the profile photo.
  • Remove user blurb from Search Results list. Simpler, cleaner, saves space.
  • Make Search box more prominent and add a microinteraction.
  • Remove advanced search criteria from main screen. Simpler, cleaner, removes a feature shown to be confusing and possibly unnecessary.
  • Decrease granularity in Instrument dropdown, until evidence supports such granularity.
  • Moved footer navigation to slide out menu.

Test showed improvement across the board. The glaring exception is the usefulness and/or placement of Search, still not always discovered when appropriate or even when it is the only option to get the desired results. This will be addressed in the onboarding process.

What's Missing?

  • Onboarding. Testing showed the app is mostly self-explanatory, but I would like to:
    • Draw attention to the Search box.
    • Explain what differentiates this app from the competition.
    • Explain the benefits of answering as many Questions as possible.
  • In the UI I did not account for browsing other users’ answers to the Questions. This is a must.
  • Ability to Like other user’s audio and video clips.
  • Hooks: notifications for Likes the user's audio and video clips, when someone the user has Liked adds new material, and when a new user with a high match percentage joins.
  • Social interaction, so fans of bands can gather and chat, talk about shows, go to shows, etc.

Pivot?

With greater social capabilities added, I could see this becoming primarily a social app for music fans: sections devoted to individual bands, group chats, discussions, meetups for shows, and the like.

Why?

  • There are many more fans of music than players of music, and relative to myousic's target audience, they're possibly a lot more enthusiastic.
  • It’s likely safer to meet strangers in places where there are lots of people around than in someone’s basement.
  • Revenue model: sell tickets to shows inside the app.