Hablo: Learning a new language with a perfect match!

Hablo: Learning a new language with a perfect match!

Hablo: Learning a new language with a perfect match!

What if you could learn another language with a tutor that feels more like a friend?

What if you could learn another language with a tutor that feels more like a friend?

Client

Client

Personal Project

Personal Project

Scope

Scope

Research, UX Design, UI Design, Branding, User Testing, Prototyping

Research, UX Design, UI Design, Branding, User Testing, Prototyping

Duration

Duration

13 Weeks

13 Weeks

Overview

Overview

The Problem

The Problem

Learning Spanish sometimes requires attending group classes; which can be inconvenient and intimidating for many people. While there are a lot of existing gamified, solo experiences out there; speaking with native speakers is a key factor in how fast people learn. Other online tools assign you a random tutor, but what if there was a better approach? 

Learning Spanish sometimes requires attending group classes; which can be inconvenient and intimidating for many people. While there are a lot of existing gamified, solo experiences out there; speaking with native speakers is a key factor in how fast people learn. Other online tools assign you a random tutor, but what if there was a better approach? 

The Solution

The Solution

What if there was a tool that could match people with a tutor who shares their interests? By filling in their interests and preferences on our tool, people can be efficiently matched with a tutor that feels more like a friend. Having already prebuilt subjects to talk about decreases enormously the anxiety that meeting with a new person can cause—all of this plus the convenience and the privacy of learning in your own space.

What if there was a tool that could match people with a tutor that shares their interests? By filling in their interests and preferences on our tool, people can be efficiently matched with a tutor that feels more like a friend. Having already prebuilt subjects to talk about decreases enormously the anxiety that meeting with a new person can cause. All of this plus the convenience and the privacy of learning in your own space.

Research

Research

User Interviews

User Interviews

In-person and remote user interviews were conducted with subjects who previously learned a second language. These interviews were key in understanding the user's wants, mindset and motivations of their own process. Some of the most vital questions were:

In-person and remote user interviews were conducted with subjects who previously learned a second language. These interviews were key in understanding the user's wants, mindset and motivations of their own process. Some of the most vital questions were:

Why

Why

did you want to learn a new language?

did you want to learn a new language?

What

What

resources helped you achieve your goal?

resources helped you achieve your goal?

How

How

did learning a new language fit in your schedule?

did learning a new language fit in your schedule?

User Interviews

After a few minutes talking, the participants made some clear remarks about their experiences:

After a few minutes talking, the participants made some clear remarks about their experiences:

User Interviews

“My main motivation is to connect with
other people and their culture” -KP

“My main motivation is to connect with
other people and their culture” -KP

User Interviews

“I had to make my schedule fit my lessons because I had to travel to get to class” - PZ.

“I had to make my schedule fit my lessons because I had to travel to get to class” - PZ.

User Interviews

“Talking with native speakers was more efficient than learning from an app ” - BH

“Talking with native speakers was more efficient than learning from an app ” - BH

User Interviews

“I was embarrassed the first time I tried
speaking with a native speaker” - MS

“I was embarrassed the first time I tried
speaking with a native speaker” - MS

User Interviews

One thing in common that all participants said, was that they learned best once they were submerged in the culture and the language. Practicing their language skills with native speakers was what made them feel more confident in their skills because they got to learn day-to-day words and also got to get used to the pace of the language a bit quicker.

One thing in common that all participants said, was that they learned best once they were submerged in the culture and the language. Practicing their language skills with native speakers was what made them feel more confident in their skills because they got to learn day-to-day words and also got to get used to the pace of the language a bit quicker.

Defining

Defining

Almost there!

Almost there!

Coming up with a solution that checks all the boxes was quite difficult. A few ideas were fun, but not quite right. If the solutions don't fit all the needs that were uncovered by the research, the solution simply wouldn't work.

The product need to connect people to native speakers, foster an environment of confidence, be convenient.

Coming up with a solution that checks all the boxes was quite difficult. A few ideas were fun, but not quite right. If the solutions don't fit all the needs that were uncovered by the research, the solution simply wouldn't work.

The product need to connect people to native speakers, foster an environment of confidence, be convenient.

Checking all the boxes

Checking all the boxes

After a few rounds of ideas, it was pretty clear that there was a winner:

After a few rounds of ideas, it was pretty clear that there was a winner:

Early Concepts

Early Concepts

Early sketches that were developed for this idea:

Early sketches that were developed for this idea:

Designing & Branding

Designing & Branding

Translating to mid-fidelity

Translating to mid-fidelity

The process of translating early sketches to mid-fidelity was swiftly made as multiple iterations were made to the early, hand-drawn sketches.

The process of translating early sketches to mid-fidelity was swiftly made as multiple iterations were made to the early, hand-drawn sketches.

Sign up-Flow

Sign up-Flow

The process of translating early sketches to mid-fidelity was swiftly made as multiple iterations were made to the early, hand-drawn sketches.

Getting Matched Flow

Getting Matched Flow

The process of translating early sketches to mid-fidelity was swiftly made as multiple iterations were made to the early, hand-drawn sketches.

Scheduling a Meeting Flow

Scheduling a Meeting Flow

The process of translating early sketches to mid-fidelity was swiftly made as multiple iterations were made to the early, hand-drawn sketches.

Developing a Brand

Developing a Brand

With the mod-fidelity sketches made, it was time to bring the brand's identity to life!

With the mod-fidelity sketches made, it was time to bring the brand's identity to life!

High- Fidelity Wireframes

High- Fidelity Wireframes

With the branding and a few components, the high-fidelity components came to life:

With the branding and a few components, the high-fidelity components came to life:

Testing

Testing

User Testing

User Testing

Usability tests were performed with 5 participants on the following flows: Onboarding, Getting matched, and Scheduling a Meeting.

The metrics used to assess the success of the website were:

Usability tests were performed with 5 participants on the following flows: Onboarding, Getting matched, and Scheduling a Meeting.

The metrics used to assess the success of the website were:

Completion

of all tasks

Signing Up: ✔️ Getting Matched: ✔️ Scheduling:✔️

Average

time of completion

Signing Up: 53 secs Getting Matched: 3:01 mins Scheduling: 2:17mins

Completion

Ease

Completion

of all tasks

of navigation (out of 5)

of all tasks


Signing Up: ✔️
Getting Matched: ✔️
Scheduling:✔️

Signing Up: 5 Getting Matched: 4.8 Scheduling: 4.6


Signing Up: ✔️
Getting Matched: ✔️
Scheduling:✔️

Average

Average

time of completion

time of completion


Signing Up: 53 secs
Getting Matched: 3:01 mins
Scheduling: 2:17mins


Signing Up: 53 secs
Getting Matched: 3:01 mins
Scheduling: 2:17mins

Ease

Ease

of navigation (out of 5)

of navigation (out of 5)


Signing Up: 5
Getting Matched: 4.8
Scheduling: 4.6


Signing Up: 5
Getting Matched: 4.8
Scheduling: 4.6

What the participants said

What the participants said

What the participants said

The particpants expressed their opinions freely, here is what they had to say:

The particpants expressed their opinions freely, here is what they had to say:

“Choosing attributes was easy!” - GB

“Where do I tap to set the appointment?” - KP

“Choosing attributes was easy!” - GB

“Where do I tap to set the appointment?” - KP

“Confirming the date feels out of place”-BH

“Checkboxes are hard to tap” - PZ

“Confirming the date feels out of place”-BH

“Confirming the date feels out of place”- BH

“Checkboxes are hard to tap” - PZ

Insights from Testing

Insights from Testing

Based on user testing feedback and metrics, a couple of issues were evident. The scheduling process was a bit difficult to follow, the tap boxes were too small, and the CTA could use more visibility.

Based on user testing feedback and metrics, a couple of issues were evident. The scheduling process was a bit difficult to follow, the tap boxes were too small, and the CTA could use more visibility.

Insights from Testing

On the landing page, the CTA button lived under the paragraph explaining what the product was. This created some confusion with some of the participants since it wasn't evident that they could scroll down to access it. This ended up in participants going to the hamburger button, or trying to hit the login link instead of signing up.
The need to reposition the button was evident. Bringing it up on the screen, so it was more evident on arrival, improved the visibility and engagement.

On the landing page, the CTA button lived under the paragraph explaining what the product was. This created some confusion with some of the participants since it wasn't evident that they could scroll down to access it. This ended up in participants going to the hamburger button, or trying to hit the login link instead of signing up.
The need to reposition the button was evident. Bringing it up on the screen, so it was more evident on arrival, improved the visibility and engagement.

Before CTA repositioning

Before CTA repositioning

After CTA repositioning

After CTA repositioning

Insights from Testing

On the Getting Matched flow, particpants had a visibly hard time selecting the boxes with the characteristics that defined the personalities of the tutors. Many tried tapping on the text and not the box itself, which led to some frustration. A change in box size was needed, but also an increase on the tappable size of the item.

On the Getting Matched flow, particpants had a visibly hard time selecting the boxes with the characteristics that defined the personalities of the tutors. Many tried tapping on the text and not the box itself, which led to some frustration. A change in box size was needed, but also an increase on the tappable size of the item.

Before increasing size and tappable size

Before increasing size and tappable size

After increasing size and tappable size

After increasing size and tappable size

Insights from Testing

At the time of scheduling their first meeting, some participants struggled to figure out how to start the process. The interface was lacking clues to indicate tappability and interaction.
Adding a slight shadow and a more consistent color state, the buttons were more recognizable for their tappability and their state.

At the time of scheduling their first meeting, some participants struggled to figure out how to start the process. The interface was lacking clues to indicate tappability and interaction.
Adding a slight shadow and a more consistent color state, the buttons were more recognizable for their tappability and their state.

Date Selection Before Improvements

Date Selection Before Improvements

After increasing size and tappable size

Date Selection After Improvements

Date Selection After Improvements

After increasing size and tappable size

Final Product

Final Product

Go to Live Prototype

Go to Live Prototype

Insights from Testing

Arriving at the final product after conducting several rounds of testing and iterations, was a very fulfilling moment as a designer. I was able to effectively hear the users on their pain points, and use that to figure out the best solution for their needs.
The final product helps the intended audience practice their Spanish with native speakers in a way that fosters more confidence, privacy, and convenience.

Arriving at the final product after conducting several rounds of testing and iterations, was a very fulfilling moment as a designer. I was able to effectively hear the users on their pain points, and use that to figure out the best solution for their needs.
The final product helps the intended audience practice their Spanish with native speakers in a way that fosters more confidence, privacy, and convenience.