SPEAKLY

Experince
Low-fidelity Prototype

7 app thumbnail

A language learning app that teaches you to speak like a native.

 

Role: UX Designer

Tools: Pen & Paper, Adobe XD, Skype

 

 


Methodologies:

Competitive Analysis, User Surveys, User Interviews, Personas, Task Analysis, User Flows, Usability Testing, and Rapid Prototyping.

 

 

 

Problem Statement:

Struggling to learn a new language.

 

 

 

Solution:

I wanted to solve this problem by creating the app “SPEAKLY”. SPEAKLY is an app that teaches grammar, words, and slang by keeping in mind what native speakers use every day. That could improve the retention of information, the feeling of confidence, and just keep learning without quitting.

 

 

THE DESIGN THINKING PROCESS:

 

1- EMPATHISE:

Competitive Analysis:

First, I wanted to gather more information about the already existing similar apps. I did a competitive analysis that gave me a broader idea of what users like and what they don’t. I’ve analyzed 3 different apps:

– Memorise

– Anki

– Wordup

ANKI APP:

It is a famous flashcard app. Users have a lot of options for creating flashcards and flashcard decks. This makes the app feel like the user is in total control. Starting to learn is easy. You pick the deck and then press play. Furthermore, users receive great information about the success rate and the number of reviews.

Pros:

– A lot of options

– The feeling of control over the app

– Starting to learn is easy

Cons:

– Unpleasant and old UI

– Need prior knowledge

anki

WORDUP:

Wordup is a well-optimized app with a pleasing UX. It uses the space repetition algorithm like Anki in conjunction with gamification. It doesn’t have decks. The software will automatically create a list of words that the user needs to learn and review.

Pros:

– Questions about what users want to learn

– Numerous media used to learn new words

– Daily objectives

– Clear progress

– No need to create an account

Cons:

– Nothing

wordup

MEMRISE:

Memrise is a well-structured app but the UX can sometimes feel confusing. It has too many options and modalities to learn, but sometimes the user, especially new, can feel overwhelmed.

Pros:

– Great visual design

– Object recognition

– Language course structure

Cons:

– Too many learning options

– Features aren’t easy to understand

Memrise-new-logo

Analysis:

1- These 3 apps were interesting, each in its way. Anki and WordUp have several learning methods, not too many(like Memrise) and not too few. I like this balance.

2- The ease of use and the clear progress bars/stats of both Anki and WordUp is something to keep in mind while designing SPEAKLY.

3- There needs to have a good onboarding that can properly introduce the users to its features.

4- Using the app without creating the account can increase the feeling of control and enjoyment from users. By starting to practice right away, there would be less friction to create an account and stick with the product.


LEARNING APP INTERVIEW SCRIPT

By Numair Naeem

 

Introduction:

Hi, X. My name is Numair Naeem. I’m going to be walking you through this session today. I’m conducting interviews to better understand how people approach learning a new subject and vocabulary. This session won’t take more than 15 minutes.

1st thing I want to make clear right away is that this is not a test. You can’t do or say anything wrong here. This is the place where you don’t have to worry about making mistakes. If you have any questions as we go along, don’t be shy to ask.

Let’s get started. I’d like to ask you just a few questions for a project I’m working on about education and learning new vocabulary.

 

Interview Questions:

  1. Are you a student, a professional, or both?
  2. When was the last time that you had to learn new vocabulary? Why you did do that? Were you successful?
  3. How did you approach the process of learning new vocabulary?
  4. What are the biggest challenges you faced?
  5. What worked well when learning new vocabulary?
  6. From your experience, what would be the perfect solution for learning new vocabulary? Why?
  7. Is there anything else you want to share?

User Interviews:

I have a better idea of what I’m dealing with. Now it’s time to talk with humans. For that, I’ve reached out to three people that already learned new languages and used software for that.

This is an important step in UX: If you want to design experiences for users, you need to talk to users.

I’ve created an interview script to have a general path to follow so that I can also have the freedom to dive into some follow-up questions without losing sight of the main path.

User interviews were super insightful but also complicated at 1st. You need to give space to breathe and speak, without losing focus on the right topic. Follow the script and you can’t go wrong!

 

Takeaways:

– They consume different types of media (music, videos, articles, books, podcasts).

– They believe that grammar and vocabulary are easy to learn, but speaking and writing is the most difficult part.

– They try to speak or chat with native speakers as soon as possible.

– They use context to understand new words.

– They don’t want the false perception of improving by using the app.

That gave me a lot of information on how to structure the app. They need multiple types of media to learn vocabulary and words through contest and logic. They want to speak and chat with natives as soon as possible and they don’t want the false perception of improving.

After the interviews, I organized the data into three different categories:

Doing, Thinking, Feeling

 

Doing:

– I write the word on paper with the translation and context.

– I watch videos, movies, and TV series to better learn the language.

– I search online for the translation, then I re-read the sentence where I found the word.

– I listen to podcasts to hear the pronunciation and the rhythm of the language.

– I change settings on my devices with the language that I want to learn.

– I use apps that help me learn the basics of a language.

– I try to speak the language as much as I can and as often as I can.

 

Thinking:

– I believe that having a way to speak with natives could be beneficial for my progress

– I believe that context is fundamental to learning the meaning of a word.

– I believe that it is important to learn daily how natives speak the language.

– I believe that using words is fundamental.

– I believe that speaking the language is the most important thing to do.

– I believe that I need to be more aware of time.

– I believe that listening to natives is important to absorb the language.

– I believe that reading is a great way to learn new vocabulary.

– I believe that learning a new language is important, both personally and professionally.

– I believe that avoiding looking for translation is the best way to learn a word. Context is fundamental in this.

– I believe that learning grammar and vocabulary is the easiest part. Learning to use them is complicated.

 

Feeling:

– I feel frustrated when I can’t review all words that I’ve learned.

– I feel challenged when I have to use the words instead of learning them by heart.

– I feel stressed when I can’t find a way to practice speaking with natives or advanced speakers.

– I feel sad when I speak with natives and they use some slang words or idioms that I’ve never heard.

That helped me to immerse myself in the user’s POV and through that, my persona came alive!

 

Define:

Persona

Meet Bella Jadeed.

To better empathize with Bella, I gave a context and a background so that I could feel Bella and her needs.

Bella Jadeed:

“By learning a language, I meet new cultures”

 

Demographics:

24 y/o

Saudi Arabia

Bachelor’s graduate

Not living in her hometown

Arabic, English, Spanish

Behaviors

She is a graduate looking for a job.

As someone, who always like to learn, she reads both fictional and non-fictional books.

She is passionate about movies and music, and she uses these passions to learn new languages. Traveling is a fundamental aspect of herself. She likes learning about new cultures. The approach to learning is multimodal.

 

Needs and Goals:

She needs to be aware of time

She needs an app that allows her to review vocabulary without being too repetitive.

Learning based on context.

Using a multimodal approach.

Speaking the language

Needs to be aware of the actual progress

She wants to learn the language to speak like and with the natives.

User Stories: (As Bella)

I want to learn a new language so that I can communicate with more people.

I want to use more resources so that I can acquire more knowledge.

I want to learn how people speak the language so that I can interact with natives seamlessly.

I want to see my actual progress so that I can improve in the aspects where I’m still weak.

 

Job Stories:

When I meet with natives, I want to be able to understand them, so that we can have a better conversation.

When I learn a new language, I want to use multiple learning methods, so that I can find the perfect combination for my learning style.

When I’m with natives, I want to show them that the language is not a barrier, so that we can forget that we have different mother tongues.

 

Problem Statement:

Bella needs a way to speak the language practically because that is the most important thing to her. We’ll know this to be true when we’ll see that she is capable to understand 90% of the words from natives.

 

Hypothesis Statement:

I believe that by creating a vocabulary learning app with a built-in chat with natives, we’ll allow user to feel more comfortable speaking and understanding natives.

 

Thanks to user flows, I got a deeper understanding of how Bella needs to use the app.
The two biggest tasks are to “Add a new language” and “see the progress”.

user flow 2 tasks

IDEATE-PROTOTYPE

I started rapid prototyping imagining how Bella would use the app.

I tried to leave the interface as lean as possible. Learning a language is already complicated, there is no need to build a complex app.

I want users to keep learning and using the app, not rage-quitting because of overcomplicated interactions.

Also, I want to reinforce and praise their achievements by showing them where they’re in the language-learning journey.

PROTOTYPING:

After a few iterations, I wanted to try these wireframes.

I took pictures of every screen and linked the wireframes into a prototype. Let’s see if I’m on the right track!


TEST:

Usability Testing:

That is an important step. Here you can see your prototype at work and you can evaluate if it’s useful for achieving the objectives of users or if they’re just some fancy designs without usability and ease of use.

To evaluate that, I’ve created a Usability Test Script, where I stated some main tasks and follow-up questions. Like during the user interviews, you want to leave space without losing focus. And so I did.

I’ve recruited 5 potential users via Skype. Through the screen share feature, I had the chance to see in real-time how they were interacting with their thought process thanks to the “think aloud” protocol.

speakly prototype

SPEAKLY USABILITY TEST SCRIPT

Introduction:

Hi X. My name is Numair, and I’m going to be walking you through this session today. We’re conducting usability tests to better evaluate how well our prototype empowers people to learn new vocabulary. These sessions should take approximately 10-15 minutes. The first thing I want to make clear right away is that this is not a test. You can’t do or say anything wrong here. You’ll be testing an incomplete prototype that likely has errors and mistakes- that is why we’re testing it out. If you have any questions, as we go along, just ask them.

Okay, let’s get started. I’d like to ask you just a few quick questions about yourself before we get started with completing a few tasks.

 

Scenario Tasks:

  1. You have to download a new learning app that a friend of yours uses. Open the app and create a new account.
  2. During the account creation, you add only 1 language. In reality, you also wanted to learn another language at the same time. Go add 2nd language.
  3. You know that learning a language and speaking a language are 2 different things. For that reason, you want to learn to speak like a native.
    Go learn some slang.
  4. After a long day, you have no energy for a quick study session. Suddenly, you become curious about your progress. You want to see your progress and for that, you open your vocabulary app. Find your progress stats.

I’ve analyzed the usability test data by summarizing the observation and ranking the severity of errors through the Jakob Nielson scale (scale ranging from 0-4).

After that, I found some recommendations on how to solve these problems.

 

SPEAKLY Usability Test Results

 

Metrics:

Jakob Nielson’s error severity rating scale.

0=I don’t agree that this is a usability problem at all.

1=Cosmetic problem only: needs to be fixed unless extra time is available

2=Minor usability problem: fixing this should be given low priority

3=Major usability problem: important to fix, so should be given high priority.

4=usability catastrophe: imperative to fix this before the product can be released

jakob nielson testing

Participants:

1: Noreen, 23 y/0

2: Micheal, 23 y/o

3: Mustafa: 24 y/o

4:Tayyeb: 25 y/o

5: Karen: 27 y/o

TAKEAWAYS:

The main takeaways from this test are:

3 out of 5 participants didn’t find it intuitive to find “add a new language” on the profile page.

The similarities between pages cause orientation and usability problems.

Usability Testing

Changes:

This process is great because I can dive again into my persona and try to see the product as she sees it. I know Bella is happy with these results.

To be sure that the prototype is helping users to achieve their goals, I’ve reached out to three other potential users. They never had the problems that the first usability test brought to light. They said to be satisfied and they would use a product like this one.

Future Steps:

From here, I’d design more features:

One of the features is pronunciation training where users can speak and the software can understand and say exactly what users are doing wrong and what could be done to improve.

A social media aspect would be beneficial to allow users to interact with each other, where people can share their accomplishments and discuss the best ways to learn, speak, etc.

And lastly, I’d implement motivational reminders that randomly notify users during the day of their accomplishments and how great are they doing. That could be beneficial both to users’ satisfaction and user engagement.

It would be great to let people use this potential product and see how much of an improvement they gain from using this.

1st of all, I’ve made changes to the homepage of the sketches. I’ve added a progress bar that can help users see their progress without changing pages.

The same applies to the learning page, where now users can have an overview of the progress, by clicking it, they will be redirected to the profile page where all the information about the progress is stored.

Here you can see the changes on the main pages:

usability testing wireframe changes
1 app start screen
3 login details
5 user profile
2 choose language
4 home
6 learning language