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.