Photo credit: Unsplash
A fun & convenient way to help busy professionals learn vocabulary on the go.
Created as an introductory project in Career Foundry's Certified UX Designer Program. Duration 2 months.
UX Research, Information Architecture, Wireframes & Prototyping, UX Design, UI Design, User Testing.
The brief was to design a mobile flashcard app that empowers people to learn new vocabulary. I used the User Centered Design Process to guide me throughout the design process.
During the discovery phase of the project I wanted to get to know my target audience. I also wanted to understand the market so I preformed a competitive analysis of three competitors; Tiny Cards, Quizlet & Lexilize. I then created a problem statement to define the opportunity and keep the user focused design process on track.
I took an in-depth look at three other flashcard or language learning apps to get a better picture of the market
+ Friendly and approachable voice used throughout, consistent in language used, animations and colour palate.
- No onboarding process, although it is a simple interface some of the tools are initially unclear.
+ Clear onboarding process as soon as opening the app.
- Relies almost exclusively on text based games without visual imagery
+ Engaging landing page with a strong statistical message.
- Necessary to sign up on before using app including the additional step of Username / DOB.
See link for the full report.
"Our users need a way to improve their vocabulary that is flexible enough for a busy life but interesting and dynamic enough to keep them motivated."
To gain insights about the real needs of users in my target market (professionals aged 25-45) I conducted a series of in-person interviews.
- Finds it easier to learn languages informally with friends.
- Finds it annoying when apps don't reflect real world situations.
- Finds it difficult to concentrate for long periods of time.
- Feels energized by entertaining teachers and classmates.
- Would like to be able to learn in short bursts on-the-go.
- Feels discouraged when unable to progress any further on a language app.
- Likes to learn at least one new word per class and practice it in context.
See the link for the full report.
Based on the insights I collected from the interviews I created a User Persona to create empathy with the end user. This helped ensure I was designing with real needs and goals in mind and was a really useful resource throughout the design process.
I then created a Hypothesis statement as a way to define the primary problem of my persona as well as a way to solve it.
"We believe that creating an language learning app that uses image based learning as well as an online community of language learners will keep our users interested enough to develop their skills and have them conversing comfortably with natives in 3 months."
I then created user flows to study how my persona would move through the app. I chose signing up for the app and completing a group game as two critical tasks that the user would need to complete their goals.
I began sketching out the screens of the app, quickly and loosely testing out multiple different versions using the crazy 8s technique. I then decided on the best options using dot voting.
Mid & High Fidelity Wireframes
I then created Mid Fidelity Wireframes and linked them together to create a prototype.
After a round of User testing I refined the design of these screens and created high fidelity wireframes that included UI elements such as colour and typography.
Tools: Balsamiq, Sketch
See the evolution of the screens for signing up & onboarding below.
I organised a series of user tests to make sure the app was intuitive and easy to use. I was particularly looking for errors that meant the participants couldn't complete a particular task or found it difficult.
To assess the severity of the errors I used Jakob Nielsen’s error severity rating scale that ranks errors on a scale of 0-4 (0 not being a usability issue at all and 4 being a usability catastrophe). See the link for the full report including test plan and usability test report.
Error: Lack of back button
60% of the participants encountered frustration when there was a missing back button. This was a critical error and I corrected it in all instances
Error: Daily Goal unclear
Two of the participants didn't understand the meaning of Daily Goal in the onboarding sequence. To make it more clear I changed the language to "I want to study for ... per day".
After the user testing it was time to define the User Interface of the design and document elements like colour, typography and illustrations to ensure consistency across all devices.