Project Scope

Timeline

5 weeks, February 2021

Duration

80 hours

Team

Individual project with feedback from client, peers and mentors

Client

TB Winds

Deliverables

Responsive Redesign, UX Research, Web UI Design (because most participants shopped for instruments and accessories on their computers, Prototyping, Usability testing

01| Define

Industry

Musical instruments, accessories and repair

Differentiation

Woodwind specialization with focus on saxophone and clarinet

Target audience

Serious musicians who are able and willing to invest in their instrument

Locations

Denton, TX

Reputation

High quality instruments, accessories and repairs; employees with degrees in the instruments of focus

Story

After completing post-graduate degrees in the instruments mentioned above, husband and wife - Tony and Jen, decided they wanted to open a local shop to help musicians gain access to high quality instruments, accessories and repairs.

Jen created a business plan while completing her doctorate in Clarinet Performance for a University of North Texas Music Entrepreneurship competition. This step gained recognition and peaked the interest of an investor.  With this aid, Tony and Jen decided to move forward and open their shop.

TB Winds quickly grew very popular. In part due to the local colleges with music programs, and the quality of their work and expertise.

While their repairs have grown increasingly popular, they wanted to bring awareness to their instruments and accessories.

With this goal in mind, I began user testing to see how users viewed their site and their shopping experiences buying instruments and accessories online.

Goals

  • To bring attention to products for sale
  • Discover user behavior patterns and their likes and dislikes to guide prioritization of features
  • Use findings to create a user-centered platform

Challenges

  • Balance the goals of the business with the goals of the user
  • Meeting musicians needs and methods of purchase
  • Explore and implement visual thinking strategies to redesign an existing site

02| Research

Research Goals

Methods

  • Secondary Research
  • Interviews
  • Context Inquiry

Interviews & Context Inquiry

Interviews

  • I interviewed 5 subjects who were musicians inquiring about what they wanted from an online shopping experience, what motivated their purchases and their previous online shopping habits
  • The majority of the subjects were male, as that is the typical makeup of professional musicians
  • The participant age raged from 27-27
  • The participant were either music students, professional musicians or both

Context Inquiry

  • I asked the same participants mentioned above to share their screen as they worked through the TB Winds website, following their journey to purchase a saxophone, asking them unbiased questions along the way

Findings

  • All participants liked to look at reviews, 2/5 would want the reviews to be current
  • All participants thought the main purpose of the site was repairs and accessories
  • 4/5 Musicians want to try an instrument before buying
  • 4/5 participants shop on their laptops
  • 4/5 participants liked the homepage
  • 3/5 participants liked that the prices were easy to find, the same amount said they will always look for deals or discounts
  • 3/5 want the site to feel like a human experience, though the same amount felt that the TB Winds site had a personal feel
  • "I can see that this company cares"
  • 3/5 participants liked that you could filter categories by subcategories
  • 3/5 participants said their online shopping habits increased since the onset of the pandemic
  • 3/5 participants said they'll typically shop online for accessories

Surprises During the Context Inquiry

  • One participant pointed out that the add to cart option and Paypal option were available at the same time, making it a bit confusing as to whether or not they could buy more than one item. 2/5 participants were confused at this step
  • 2/5 participants clicked the main dropdown menu which took them to all things saxophone, not the actual instrument

Implications

  • Putting reviews throughout the site would help ensure confidence in the company and the product
  • Participants did not realize that the site also sold accessories: changing the branding to be less specific and featuring instruments on the homepage would decrease this confusion
  • Users should be able to book a trial appointment directly from the site to increase probability of purchase
  • The site should be primarily optimized for laptop screens
  • The site's layout should maintain a clean aesthetic with easy to find prices
  • The site should continue to have areas for feedback, contact and direct communication to maintain that human experience
  • Filters should remain part of the experience, perhaps adding more
  • Accessories should remain a major part of the site, considering musicians will typically shop online for accessories before shopping online for instruments
  • Switching up the order of payment options would make it less confusing for users to understand that they can purchase multiple items
  • The main dropdown should not be clickable, instead having an instrument option that differentiates from the main category could decrease confusion

03|

Synthesized Findings & Implications

User Persona

Using the research I had conducted, I created a persona to represent the user. This allowed me to design with an actual person in mind.

Sitemap

A map of the website that accounts for the user's goals, based on my research findings.

User Flow

Paths that the user might take to complete their goals. Click the link to see all flows.

Insights

  • The user is generally very serious about music and looking for knowledgable, high quality service and products
  • The user wants to find a good deal
  • The user wants access to quick shipping
  • The user likes supporting local businesses
  • The user will shop online from their laptop
  • The user will need to make a trial appointment

04| Development & Design

Sketching

  • With pencil, I drew multiple options for the layout of each page
  • Each design decision was based off of observations and implications derived from the aforementioned research methods

Wireframes

Full Set of Wireframes

High-Fidelity Designs & Prototype

05| Testing & Iteration

Once the prototype was completed, I used it to conduct remote usability tests with users via Maze. They completed a list of prompts and responded to questions about their likes, dislikes and experience.

Task 1: Purchase a Saxophone from the Homepage

Findings

  • Most users found the task straight forward and completed the task
  • Two users gave up on the task: One tried to complete it on their phone, which was confusing because I had optimized for a desktop screen
  • 83% of users successfully moved on to the expected path, while 16.7% navigated back to the homepage
  • 80% of the users successfully moved from the product page to the next screen, while 20% went back to the category page
  • 4 users of the 8 users completed the entire task through the expected path
  • Users expected to be able to personalize each page, but without guidance, there were many misclicks on the product page, add to cart and order confirmation page
  • Users generally found the design to be clear and the task easy to complete

Task 2:

Book a Repair Consultation & Return to the Homepage

Findings

  • This task involved too much prompting and led a lot of participants to be comfused
  • 14.3%, an unusually high percentage of testers left the expected path or gave up on the mission
  • The misclick rate was high, 66.7%
  • People tried to book directly from the hero image instead of scrolling down to the "need a repair" section
  • 1 user gave up on the first page
  • 4 users found themselves on an unexpected path
  • Only 2 Users successfully moved on to the next screen from here
  • Only 1 user made it back to the Homepage
  • Users wanted to go through to the Calendly App to continue the process, which also led to confusion

Implications

  • Have more than one path to booking a repair on the homepage for testing
  • Make the task smaller and directly to the point

Task 3:

Find a Saxophone and Book a Trial Appointment

Findings

  • A significant percentage. of testers dropped off from the expected paths
  • The missions misclick rate was low at 1.4%
  • 100% of the users made it to the category page
  • 80% of users moved to the product details page, while 20% went back to the homepage
  • 4 users made it to the Calendly overlay, while one went back to the category page
  • 1 user didn't know they needed to go to the instrument first to find the trial option
  • 4 users found the process and button clear

Implications

  • No need to have users repeat the same task of getting to the product details page
  • Make the task smaller and directly to the point

Overall Comments

  • "Some text could be larger"
  • "The quiz is confusing me or not working properly on my phone, but the website is straightforward and attractive"
  • "I like that everything is visible from the homepage"
  • "There should be an explanation about what a trial appointment is"
  • "I prefer buttons and pictures to drop down menus"
  • "Love the website"
  • "A way to book a trial appointment... outside of the instrument purchase page might be helpful if someone is looking for that first without knowing what specific instrument they want"

Revisions

  • Have a trial option available outside of the product details page
  • Make the quiz less confusing by having smaller tasks

Conclusions

What went wrong and why?

What did I learn?

What I could have done better?

Next Steps