My Guitare

Problem Statements.

MyGuitare’s redesign was very much overdue. New features were built on top of temporary structures, and was chaotic. Their online guitar courses grew for their pedagogy and unique approach to teaching guitar online, but their outdated platform was a hindrance to their growth, deterring less tolerant users when faced with frustrating experiences.

Research.

We began with understanding the context of the problem. Before we interviewed anyone, we outlined the objectives for our research.

1. User needs: Who are the users? What are their needs, and their existing pain points?
2. Business needs: What is the core offering of online learning? What is MyGuitare’s unique value proposition and their competitive edge?
3. Competitor analysis: What is the competitive landscape and how can MyGuitare standout?

We conducted 9 contextual interviews, 3 client discovery sessions, and 5 competitor analysis.

Understanding user needs

We outlined three guiding questions for users...

1. Who are the users?
2. What are their needs?
3. What pain points do they have?

We scheduled remote unstructured interviews with regular and power users to an open-ended conversation to probe for insights. As we approached our 9th user interview, we began to identify pattern in their response and gained confidence in moving on with our data.

Based on our findings, we created a target user to identify primary users and their needs. This target user would be referred to as Sébastien, which served as a reference for making design decisions and aligning internal discussions.

Top pain points were:

• "Too many clicks to get to where I want to go" (poor information architecture)
• "Website on mobile doesn't work properly" (unresponsive design)
• "Don’t know whether a lesson is watched" (Poor lesson status visibility)
• "Cannot see what lessons are included in the course" (poor lesson content visibility)
• Slow load time (large content volume per page)

Understanding business needs

MyGuitare helps guitarists reach their goals. We interviewed our client team to find out their strengths and weaknesses of their offering to ensure their strengths are reflected on the platform.

This surfaced critical features for a successful platform:

• Educate new users of unique teaching approach at the earliest opportunity.
• Encourage new users to engage with MyGuitare's community.
• Help users get "unstuck" as fast as possible.
• Reduce user anxiety of finding the right course.
• Encourage practicing challenging lessons.

Competitor analysis

We audited 5 competitor platforms to learn from industry standards, and identify unique advantage we may be able to achieve for users like Sébastien. Our insights are summarized below.

• Navigation—Clear and legible, skim-able layout, and video/image rich pages.
• Community—A community of peer learners are commonplace on e-learning platforms. Our research suggests that a user's community engagement is a strong predictor of user retention and improvements.
• Omnipresent—Follow ups and email reminders help users stay on track towards their goal.
• Gamification—Some learners need affirmation and approval to reach their potential. Especially Sébastien, who believes they have passed their peak. To make up for the lack of encouragements compared to traditional 1-on-1 teaching, e-learning platforms put emphasis on the sense of accomplishment through gamifying the learning experience.

Define.

Our scope sets realistic expectations for all stakeholders and avoids planning for failure. We surfaced constraints and limitations early in the project to bring up for discussions and plan ahead. With our research synthesized, all stakeholders agreed on the following scope for our first deliverable. We believed that if we get the fundamental features right, the rest will follow.

Project scope

1. Redesign the information architecture (IA)
   Both, client team and users, indicated a disconnect between user's expectation and the platform IA.
2. Redesign fundamental user flows
   We prioritized our efforts on the fundamental userflows (onboarding, course navigation, resuming a lesson) and backlogged luxurious features to later iterations.

Design.

At the design phase Michael, Marika and Liam began by drafting the IA, which then informed the userflows. For each flow, we iterated on wireframes, only then we moved on to created interactive prototypes.

Information Architecture

The design team start to reorganized the information architecture based on a common pain point that it takes "too many clicks to get to where I want to go" from research phase.

Redesigning 3 fundamental userflows

1. Onboarding
2. Course navigation
3. Resuming a lesson

Liam took the lead in distilling each userflow down to its essence, and sketched wireframes to accommodate the actions. The goal was to optimize between minimizing the number of steps without over crowding any single page with too many options.

Because userflows are fundamental in the platform, each interactions that accommodates the flows were designed to be one of the most prominent in each screen.

1. Onboarding

Onboarding is many user's first impression so it's important. Our team focused on creating an engaging and streamlined experience to find the right course for users, who are eager to look for a course and start practicing.

With much discussion among all stakeholders, we decided to onboard new users with a short quiz to suggest personalized course recommendations based on guitar experience and music preferences. This is designed to show new users only what is necessary and streamline the steps to finding a suitable course and begin practicing.

2. Course navigation

Course navigation include steps users take to progress through a course from one lesson to the next. Although this flow could be a simple click of a button, the challenge were to implement MyGuitare's pedagogy which requires users to meet two conditions before moving on to the next lesson. The two conditions are:

• Spend a week practicing the materials.
• Mark the current lesson as either "Mastered" or "need more practice".

3. Resuming a lesson

Having established the core activity as watching lesson videos, we needed to design the shortest path to pick up where users left off in a previous session.

As a solution, we introduced a dashboard menu with shortcuts to the previous lesson as the most prominent feature, eliminating the need to shuffle through all courses available. Since users often need to wait for the next lesson to become available, a quick route to the previous lesson would greatly reduce the number of clicks needed.

Final deliverable.

Our handoff were challenging. We had to deliver design assets to client's development team across time zones, language barriers, and with different collaborative expectations.

We prefer the hot potato process, a handoff process with frequent communications to unblock any issues, compared to a traditional waterfall process. Unfortunately, our team and the client's development team had different expectations. However, luckily, both parties were transparent and resolved any development issues in a timely manner.

Course navigation

Onboarding quiz

Instructor chat