1
2
3
4
There is usually initial excitement about starting a new piece; however, this sentiment is soon replaced by frustrations.
Practicing something new is often associated with negative emotions
What makes practicing difficult or ineffective
What makes their current practicing effective
What motivates a musician to practice
Not being intentional and not having a clear game plan greatly impacts a practice session. Lack of commitment in terms of patience, energy, time, and focus was also among top reasons for an inefficient use of practice time.
Users cited incorporating metronome in their practice routine and isolating problem areas as their most common techniques for effective practicing.
Users expressed that just enjoying the act of playing music alone provides motivation. Additionally, users look forward to sharing their progress with their peers and seeing their own improvement over time.
Following user interviews, I gathered quotes from user interviews and organized them into recurring key themes. The findings below allowed me to understand the trend of user experiences and visualize potential solutions to help alleviate the pain points.
Key Insights
Andante
Free version
Subscription
One-time payment
Mood & Focus Tracker
Practice log
Activity Tracker
Mindfulness
Android app
Real-time, AI-powered
pitch and rhythm correction
I conducted a competitive analysis to understand and compare the two major available tools designed for musical practice — Andante and Modacity.
The missing factors in these apps included price accessibility, the ability to incorporate mindfulness, as well as the ability to correct intonation and rhythm in real time during practice. Seeing that there is room for improvement in these areas, I felt that I could be address them through my design.
Competitive Analysis
Practice Room
Practice Room is a mobile-first responsive website designed with the goal of creating an intuitive, friendly, encouraging tool for musicians to practice their music, track their practice progress, and stay motivated with their practice routine.
ROLE
TOOLS
User Research, Visual Design, Interactive Design, Branding
Figma, FigJam, Optimal Workshop
5 weeks (Oct - Nov 2023)
DURATION
BACKGROUND
Practice is where musicians find their heart, soul, and drive for excellence. It is a deliberate, personal, and creative process of self-improvement and self-discovery of musical ability, all of which takes place in a practice room.
As musical practice is a highly independent and sometimes solitary activity, practicing for new repertoire can be intimidating, overwhelming, and messy.
As a UX designer, I saw an opportunity to create a solution that could empower individuals to simultaneously improve and build confidence in their musical practice and abilities.
INITIAL PROBLEM STATEMENT
Musicians are learning new repertoire all the time for various reasons, and learning new music could be fun and exciting. But without the necessary tools, practicing can be overwhelming and even unproductive.
How might we come up with a way to help musicians practice?
USER RESEARCH
I outlined what the research plan would look like in order to determine the scope and scale of this mobile-responsive website. The primary research plan included a competitive analysis and user interviews to achieve the research goal below:
Research Goal
The research goal of this case study is to identify user needs and pain points related to musical practice among musicians of varied ages and proficiencies, and to develop a user-centric solution that enables focused, motivated, and effective practice while cultivating a positive attitude toward practicing and instilling confidence in musicians.
I conducted 45-minute user interviews with five participants between the ages of 16 and 58 with varying musical abilities, who have experiences with learning a new piece of music on their respective instrument. The purpose of these interviews is to better understand the following:
How a musician approaches a new piece of music
What factors contribute to productive practicing
What factors contribute to inefficient or ineffective practicing
What inspires practicing and makes it sustainable
User Interviews
With the findings gathered from the user interviews and the competitive analysis, I developed two personas who express the same user needs and pain points as shared by the users from
my interviews.
User Personas
Lia “The Sage”
Background
Age
31 years old
Location
Boston, MA
Music Proficiency
Novice
Occupation
Senior Software Engineer
User Needs & Goals
User Pain Points & Frustrations
Lia is a busy senior software engineer and she picked up the guitar on her own two years ago.
She loves playing songs by her favorite artists,
and nothing relaxes her more than some karaoke therapy on weeknights after work.
Lia took some piano lessons when she was in elementary school for 3 years, but hasn’t had any other formal musical training. She considers herself a self-taught novice on the guitar and she learns by watching Youtube tutorial videos.
Needs to have a better grasp on musical concepts, specifically rhythms and meters
Needs to figure out a way to correct herself when she makes a mistake during practice
Needs to be able to play her favorite songs more accurately
She doesn’t have time to commit to in-person guitar lessons after work
She has trouble grasping tricky rhythms in certain songs, no matter how much she listens to the song or watches tutorial videos on Youtube
Mike “The Everyman”
Background
Age
28 years old
Location
Asheville, NC
Music Proficiency
Professional
Occupation
Graphic Designer
User Needs & Goals
User Pain Points & Frustrations
Mike works full time as a graphic designer and he plays the cello. He is classically trained and used to play in a professional touring string quartet. To keep up his musical passion and skills, Mike regularly plays music gigs whenever he can. His weekends (and occasionally weeknights) are booked with gigs with several different groups.
Needs to make the best use of his limited practice time
Needs to effectively work through as much music as possible in a session
He has limited time to cover all the music he needs to learn
He is often tired after work and isn’t as focused in his practicing
POV STATEMENTS & HMW QUESTIONS
I’d like to explore ways to help musicians who are learning music independently to play more accurately because they have no clear way of knowing whether they are playing their music right since they don’t have an instructor.
How might we support independent music learners in their practicing and build their confidence?
I’d like to explore ways to help musicians who struggle with practicing, but love the idea of learning new music, enjoy and look forward to practicing again because they feel discouraged and frustrated as soon as they start practicing.
How might we make practicing rewarding and motivating for
musicians who dread practicing?
How might we help busy musicians minimize distractions during practice and maximize their practice time to achieve the best results?
I’d like to explore ways to help busy musicians make the most out of their practice sessions and achieve their practice goals, because they get distracted when they practice.
After gaining more insight from qualitative research data, I wrote out Point of View Statements
that helped create How Might We Questions in order to open up the opportunities of how to address
user pain points.
Point of View
How Might We...?
FEATURE IDEATION
Prioritized Features
I ideated on possible product features and prioritized them based on what are must-have features to have a successful launch, nice-to-have if time allows, and later for future product updates.
DEFINING THE STRUCTURE
Information Architecture
I conducted a closed card sort with 5 participants, ages 16-59, where they were presented with 36 cards, which they were to place into 5 categories: Dashboard, Settings, Account, Stats, and Support.
Most users expressed that “Dashboard” and “Stats” were redundant as they seemed to indicate the same thing and suggested that “Settings” and “Account” should be grouped together.
REFLECTION
Final Thoughts
This project has been incredibly fulfilling for me, as it allowed me to combine my passion for UX design with my music background. Practice Room was designed with the aim to create a positive music practice experience for musicians, and overall, the website achieved its intended goals.
The most significant challenges I faced while designing this website were prioritizing user preferences over my own assumptions and working within a given timeframe.
BRANDING
Defining The Brand
I started the branding process with a list of values that would define the brand, with user needs in mind: friendly, approachable, personal, fun, and bright. From there, inspiration images were then collected on a mood board to start generating a cohesive brand. This included the UI design, color palette, typography, icons, and logo.
I decided on the name “Practice Room” as it is the space where musicians take deliberate actions to better themselves and find growth. At the same time, the name is also reminiscent of the personal and approachable branding that I was trying to establish. The logo design involved several versions
of the letter "P" with the intention of bringing in musical elements as well as keeping it simple, recognizable, and scalable. I ultimately landed on a letter P stylized as a grand piano, as piano is
often a staple instrument present in music practice rooms.
As for typography, Quicksand was chosen due to its geometric parameters, rounded ends, and modern design. The rounded terminals create a soft, open, friendly, and approachable feeling, which are all attributes in line with Practice Room’s branding. Lastly, Quicksand’s ideal x-height makes it highly readable.
PROTOTYPING
High-Fidelity Wireframes
I incorporated visual elements from branding, such as the color palette, typography, logo, and icons, into the high-fidelity wireframes and then conducted a second round of moderated usability testing.
Starting a Practice Session
Building a Practice Plan
Rhythm and Intonation Practice
WIREFRAMING
Low-Fidelity Wireframes
I developed low and mid-fidelity wireframes to establish the foundations for the website’s interface. These screens were used in the initial usability testing to ensure that the structure of the design is sound before adding on visual and branding elements.
USABILITY TESTING
Testing...Again
Feedback Prioritization
Five users tested the website and were asked to complete the same three tasks in the initial testing.
96% successful task completion rate
100% of participants found the concept to be useful
The additional user feedback and suggestions from the testing were then grouped into common themes. To organize and make sense of the feedback and results from the usability testing,
I prioritized the ideas that would be directly implemented to the design.
1
2
3
4
60% of users mentioned that they intuitively wanted to see the practice features first on the Practice home page rather than the recent practice sessions.
Practice features should be more visibly prominent
Practice items shouldn’t move automatically from one to the next
The instrument icon’s purpose needs to be more clear
“Start a session” action should be more direct or prominent
40% of users mentioned that they would like to see a “Next Item” button on their screen when going through the automatic guided practice session because they need time to prepare for the next item in the practice plan.
40% of users expressed that they desired the instrument icon to have a more obvious design that indicates the ability to toggle between instruments.
60% of users mentioned that they would like to see the “Start a session” button immediately on the Practice home page without having to scroll.
Result
Iterations
The above iterations were made to refine the final product. Below is a comparison of the before and after, detailing the specific changes:
Before
Before
After Iterations
After Iterations
“Start New Session” button is moved to the top to be more visibly prominent
Practice features are moved up to be shown above the recent sessions
The instrument icon now has the instrument name with a drop down arrow to let the user know that they can tap to toggle between their instruments
Following the “Time’s up!” notification, the website will now show “Next item” to prompt the user to tap in order to move on to the next practice item
Before
After Iterations
Mid-Fidelity Wireframes
Task Flow #1: Start a Rhythm and Intonation Practice Session
Task Flow #2: Set up Automatic Practice Blocks
Task Flows
After the site map was created, task flows were mapped out to model logical sequences of what the user experience would be like. The main task flows that I focused on building were 1) starting a rhythm and intonation practice session, where the user will either scan or upload their sheet music, practice with the AI-powered pitch and rhythm corrector, in order to improve their intonation and rhythm in real time, and 2) setting up automatic practice blocks (to be renamed to practice plan after wireframing and initial usability testing), where the user can input their practice items for the session and have the website automatically guide them through each item to minimize distractions.
Site Map
Based on the results and feedback from the card sort, I ended up creating a site map with four main categories: Dashboard, Practice, Account, and Support, which became items in the navigation for the website. The site map provided a general structure and helped me visualize what my music practice website would entail.
INITIAL TESTING & RESULTS
To get initial feedback on the mid-fidelity website and address any confusion, four users between ages 22-42 participated in a moderated usability test. Testing was completed on both desktop and Figma’s mobile prototype app. The testing procedure involved completing three tasks and lasted approximately 7 minutes in total. The three tasks were: 1) starting a practice session, 2) starting a Rhythm and Intonation session, and 3) building practice blocks. Based on user feedback, the following changes were made to the design:
Users were confused by the name “Practice Blocks” .
Users weren’t sure if they were able to tap on the cards on the dashboard to see more information.
Users wanted to know if they can practice rhythm and intonation at the same time.
Insights
Improvements
Practice Blocks are now called “Practice Plans”.
Now there is a “View Details” on each card so the users can learn more about their practice stats.
Added a rhythm toggle so
the users can practice the rhythm with intonation simultaneously.
Dashboard
Practice Session
Rhythm and Intonation
Building a Practice Plan
