Empowering people to learn new languages easier.
“A sketch is the architect’s language.” is a common quote in the architecture scene. In this low fidelity case study for a vocabulary flashcard app, I only worked with pen and paper. The key learning from this study is how to gain first user insights in an early product phase with user testings and rapid prototyping.
Purpose and Context
This project was part of my UX Design Fundamentals course in early spring 2018. I wasn’t sure about presenting a project without shiny high fidelity wireframes. I learned that evaluating an idea fast and without wasting too many resources is crucial for making great UX Design. Rapid prototyping in combination with user testing can be a powerful tool to gather first insights about user needs and markets. That’s why this project is not finished. I designed a low fidelity concept for a vocabulary training app.
- User Research
- Competitive Analysis
- Rapid Prototyping
- Usability Testing
- Project Recap
After initial research and understanding the problem space, I did some generative user research. According to my assumptions my target audience is female, interested in languages and new technologies. Before designing anything I collected data on user needs and behavior around the topic of vocabulary learning apps. In addition to that, I wanted to learn about pain points around learning a new language. I conducted 3 interviews.
User Research Questions:
What are you doing for a living? Are you a student or a professional?
What are you currently doing in order to learn a new language/ vocabulary?
What are your biggest challenges in learning a new language/ vocabulary?
What makes you feel good learning a new language/ vocabulary?
What are you missing / or like at your current learning experience?
What media tools are you using in order to learn new vocabulary/ or learn a new language? What are you enjoying/ not enjoying?
How do you feel about using your phone or tablet for learning a new language/or vocabulary?
In order to gather all attitudes and needs from my user interviews, I created my persona, Linda.
Linda’s challenges and struggles
- I want to learn vocabulary like native people.
- After a language class, she wants to add new vocabulary to her app – but she doesn’t like to have for every detail a separate app. I appreciate a one-fits-all solution.
- As a busy person, Linda has a good feeling when her learning experience is well planned out, so she doesn’t feel stressed.
Linda needs a way to stay motivated about her language learning goals. A vocabulary training app should keep her on track because her daily routine sometimes doesn’t provide the space she needs to practicing vocabulary.
Iterative Competitive Analysis
Usually, I conduct a competitive analysis at the beginning of a project. However, during user research, I learned about some of the favorite apps of my users. Everyone either uses Duolingo, Tiny Card or Cram.
Whenever I design software I try to use elements that are familiar for my users. That’s why I decided my app should have a similar UI structure as Cram, a flash card app for learning vocabulary. The dashboard provides an overview at a glance and is easy to understand. Exactly what Linda needs to stay focused on learning new vocabulary.
My highest priority was to create as quickly a possible a Minimum Viable Product in order to get feedback with real users. With the problem statement in hand, I designed with pen and paper some basic user flows and translated them into low fidelity prototypes. The beauty of low fidelity prototyping is that it’s easy to build, and they don’t make users focus on unnecessary details on the UI.
I created a clickable prototype with Prot. It can be found here: https://prottapp.com/p/d5195f
Prototype for Adding New Flashcards
Prototype for Starting A Language Course
With a clickable low fidelity prototype ready, I tested my design assumptions right away. I conducted 3 usability tests, and recruited my users according to my user persona. All participants had to run through following tasks;
Task 1: Onboard and run through the English A1 course on the app.
Task 2: Review learned vocabulary.
Task 3: Create your own Flashcard Deck.
Task 4: Check your personal profile and review achievements.
- 2 of 3 users had problems identifying unlocked card decks from locked card decks.
- 2 of 3 users didn’t know how to go back to the home screen.
- 1 of 3 users clicked on “Add Language” instead of “Card Decks”.
- Removed the locked card decks.
- Extended the main navigation bar into the Card Deck Screen.
- Replaced the Plus-Sign with a Language-Bubble at the main navigation bar.
Maybe it has something to do with my background in architecture, but I still use pen and paper every time I design a new interface.
It is fascinating how quickly you can generate first insights from real users with rapid prototyping and pen and paper. The next phase would certainly include mid- or high fidelity wireframes. However, low fidelity prototyping helped us to be more confident with design decisions in the next phase. Now, the risk is much lower that we design something that nobody will use.
In an ideal world, we have the time and resources to do user testings after each design phase. As projects are moving fast we have to build our own individual user testing strategy that are working well with the needs of the business as well as the product.