Hack Your Course: Advanced Teaching and Education

A case study on facilitating tutor-student match

Draft · 9 min read

Client Brief

Hack Your Course is a tutoring company focused on providing in-house one-on-one tutoring service based in West and North Vancouver, BC. The company strives to support tutors by paying wages higher than the market price, and parents with reasonable pricing. The website will allow users to better understand the values of the company, in order to capture more business.

Hack Your Course homepage

The Opportunity

In 3 weeks, our goal was to redesign the current Hack Your course website adopting a user-centred approach, an approach that essentially allows the user to drive our design.

Meet The Team

Vicky Cheng, Stephan Idemori, Taylor Moon and Julian Tomlin

My Role : UX Designer
I conduct quantitative and qualitative user research throughout the design process to ensure functionality and usability of the product

Design Methods & Tools

Responsive Web Design Principles, Content Audit, Content Strategy, Design Studio, A/B testing, User Testing, InVision, Sketch

01 Research

To begin, we conducted user testing with the current website.

Current Website Testing

The objective was to see how some of the parents (our primary users) feel about the current Hack Your Course website. We asked them to articulate their thought process while browsing. We found that majority of the users liked the usage of images, however felt the amount of text is a little bit too overwhelming hence were not able to find the exact information immediately. The feedback were important to show how we can further improve the design of the website.

Survey + Interviews

The objective was to identify the general trends and patterns of private 1-on-1 tutoring from students and parents. Our questions were inspired by the current website testing and the features of several popular private tutoring services from our Competitive and Comparative Analysis. We collected a total of 159 survey responses and conducted 7 interviews.

Some common quotes from a mix of previous and current clients include:

These findings were supplemented by our survey results. From 159 survey responses:

  • 93% said a positive or negative review from a previous client would definitely affect their decision on picking a tutor
  • Over 50% ranked knowing the education/ qualifications as important when finding a tutor
  • Word of mouth is the most popular means when finding a tutor

This information validated some of our interview insights, specifically on the motivations, needs and behaviours when considering a private tutor. It also points us to holistic design thinking, a design approach that considers both the online and offline experience of the user. For example, users who utilize the website usually do not have referrals (something that happens offline), and therefore have the need to reply more on testimonials online.

Affinity Diagram

Using an affinity diagram, we categorized our survey and interview responses into meaningful categories. We created two affinity diagrams — one for parents and another for students. They include approach in looking for tutors, reasons for getting tutors, what they want from tutors and bad tutoring experience.

Competitive and Comparative Analysis

Driven by our survey responses and some of our client’s previous research, we compared the features of 5 tutoring companies’ websites, including 3 private tutoring services and 2 learning centres. Clearly, two features that were common among tutoring companies are How We Work, which encompasses the on-boarding process and Teaching Methodology.

We also considered the potential of adding some of the less common features e.g. Tutor Profiles to tackle our users’ concern on trusting a tutor’s quality.

Google Analytics Insights

We were able to access the Google Analytics of the current website with the help from our client. With a better sense of the users behaviour, we could build a more relevant product catered to the needs of our users.

There are two major user groups, one between the age range of 25–34 and 35–44. Since it is an even split between the gender, we concluded that many of the users are young parents. In terms of devices, 2/3 of the users use mobile, followed by desktop and tablet. For the scope of this project, we would be designing the mobile and desktop version only. Lastly, looking at the most commonly viewed pages helped us understand what content people like to see and sets the basis for developing our site map.

Business Goal & User Goal: The Sweet Spot

As mentioned, our goal was to redesign the current website adopting a user-centred approach. This requires us to consider both the business and users’ goals, and to find the overlapping point — also known as the sweet spot to achieve marketing goals in a user friendly way. Hack Your Course hopes to attract more students with its website, which will allow them to pay their tutor wages higher than the market price. The users, on the other hand, is looking for a qualified tutor with flexible schedule and reasonable pricing. Although the business goals and user goals seem to wage a war against each other, they both value tutor-student match. This would be something we’d like to achieve through features prioritization and content strategy.

The Sweet Spot

02 Planning

Customer Journey Map

Our research shows that word of mouth is the most common means of finding a tutor. Based on that, we mapped out the process of connecting with a tutor through word of mouth.

However, the process is often very direct and does not involve any forms of online activities. We therefore came up with the customer journey map of parents connecting with a tutor when they do not have any referrals, and is more likely to learn about a tutoring service via search engines.

Our survey and interview responses suggest that our users struggle with trusting tutors’ quality when considering a private tutoring service, something they would come across upon reviewing the Testimonial section of a website. We’d like Hack Your Course to address this pain point by increasing the credibility of testimonials. More details would be discussed later.

User Personas

Based on our research, we’ve come up with two personas — frustrated Fei’s mom and Bookish Ben’s dad, as a guide to help create our design.

Frustrated Fei’s mom has a daughter who goes to a public elementary school and is recently struggling with her math homework. Fei’s mom want to help her daughter from feeling discouraged by falling behind school. Her goal is to raise Fei’s interest in learning.

Bookish Ben’s dad has a son who goes to a private high school, preparing to go to a good university. As Ben requested to get a tutor, Ben’s dad want to help his son to get prepared for his provincial exam. His goal is to ensure Ben achieve academic excellence to get into a good university.

Site Map

Building off the 4 pain points and solutions, we came up with the sitemap, showing the structure of the website. From the homepage, we have the top navigation including What We Offer, How We Work, Testimonials, About Us and Contact Us. The 5 headings each leads to an individual page.

User Flow

We created a user flow that allows Fei’s mom and Ben’s dad to gather enough information to make a decision — that is, to eventually contact Hack Your Course. Our Google Analytics shows that Programs is the most viewed page, which we incorporate in our primary flow.

We decided to add a secondary flow in response to one of the major challenges our users face when finding a tutor. As one of the pain points is trusting tutor’s quality, we believe that a flow that brings the users the testimonial page could alleviate this problem.

Ideally, our users would only have to go through 3 pages — highlighted in blue — to gather sufficient information to make a decision hence take an action.

03 Design

Design Studio

With research insights and user personas in mind, we explored a wide set of ideas from 7 rounds of rapid paper prototyping. We took turns to explain our design, gave each other feedback and voted on the best design. This helped us create a shared vision of the general design direction to move forward within a short amount of time. The sketches are then refined into mid-fidelity wireframes.

Design Studio

04 Testing

Due to the budget and technical constraint, Hack Your Course currently wishes to only use the website as a simple landing page to increase its online presence. With no integration of an e-commerce platform, the website is straightforward and the testing results have been straightforward. The biggest change that we made was changing the testimonials from one column carousel to three columns.

8/10 testers expressed concern over the distracting carousel. Most didn’t have enough time to go through all the copy. Hence, we decided to change one column into three columns instead.

Mid-Fidelity Wireframes

Once the paper prototype is finalized, we created our mid-fidelity wireframe using Sketch for more testings.

The following are the solutions to our 3 main challenges:

Challenge #1 Trusting Tutor’s Quality
Challenge #2 Tutor-Student Match
Challenge #3 Confusion about Tutor’s Price and Availability

Mobile vs Desktop

Our website is responsive, meaning that it would respond to the users’ behaviours based on screen size. For example, the Contact Us button on desktop would appear as a CALL button on mobile. We determined the that primary Call To Action of desktop is filling in the contact form — which is easier with a physical keyboard, whereas the primary Call To Action on mobile is calling.

05 Prototype

Scenario: Imagine you are a parent with a daughter in high school. She came to you one day asking for a private tutor so that she can improve her math grades. You think it’s a good time to get a private tutor as she is preparing for college. you have no referrals and you happen to land on Hack Your Course through a search engine.

The clickable high-fidelity prototype was created with InVision. View mobile or desktop prototype.

Future Considerations

Considering the timeframe of the project, we were selective with our features and catered the needs of parents only. For future considerations, we’d like to include:

  • Teaching methodologies and standardized strategies utilized by tutors to further differentiate Hack Your Course from other tutoring services.
  • Case studies of how Hack Your Course design lesson plans and exercise materials to address the needs of different students. This may include the challenges, the approach and the results.
  • Online registration to improve efficiency and reduce unnecessary paperwork.

Key Takeaways

  • As a UX Designer, my job is to be an advocate for the users. It is up to the UX Designers to manage both the business and user goals. While it is important to show the client that we are brining value in what they look for, the goal is to create the best user experience possible.
  • A responsive website is not about creating different versions for different screen sizes, but creating a consistent experience tailored to the user’s unique context.
  • Design is storytelling. The goal is to create meaningful, engaging, unambiguous and sustainable content.