top of page

HelloWorld,

Language Learning App Concept, 2017

I needed to create a prototype for a mobile app that empowers people to learn new foreign language vocabulary. This was a Career Foundry course project designed to teach the fundamentals of UX design. 

Required features
An onboarding page, a way to sign-up and login that allows users to input and save their personal information, an admin area where users can access their information, a menu that allows users to navigate the application, a way to upload new vocabulary words and definitions that allows users to input their own definitions, written or otherwise, and a means of reviewing vocabulary that allows users to study efficienty and effectively.

​

Play with the prototype!

Team

UX Designer

Role

As an individual project for coursework, I assumed all roles including strategist, researcher, and designer.

Tools

Photoshop, Prott, Notecards, Google Suite, Premiere Pro, Skype

Deliverables

Competitive Research Analysis, User Research Key Findings, Proto Persona, Key User Flows, Application Map, Interactive Wireframe Sketches Prototype, Usability Test Reports, Presentation 

Competitive Research and Analysis

I downloaded and analyzed four popular mobile applications for learning a foreign language vocabulary. For each one, I thoroughly identified the positive and negative UI and UX elements for each screen, then summarized my findings. 

​

Apps: Memrise, DuoLingo, Quizlet, SuperFlashCard

User Research

I defined my target users, wrote a brief interview script, and conducted concise interviews with 4 people in my target demographic. I then synthesized their responses into categories and extracted key insights based on "Do, Think, Feel".

User Needs

I summarized my findings by creating an empathy map and storyboard. I also created a primary proto persona and restated the project brief utilizing user stories, job stories and a problem/hypothesis statement. 

Problem Statement 
Rachel needs a way to customize her learning experience to work for her because if she doesn't feel like she's successfully learning anything, she will lose motivation and quit. 


Hypothesis Statement 
We believe that by creating a foreign language flashcard app with options for user-generated content, ability to upload or draw images, access to video clips of native speakers saying words, ability to easily categorize terms, and the ability to select the desired learning activity for Rachel, we will achieve having Rachel maintain motivation to continue using the app until her goals are met and continually as she wants to learn more words.

Information Architecture

Next, I identified the main tasks this persona would need to accomplish their goals and outlined the steps for each one. I then created user flow diagrams to visualize the processes.

​

I conducted a card sorting exercise with 3 test users on optimalworkshop.com to help me figure out the best way to organize the basic app structure. 

Wireframing and Prototyping

I used notecards and a sharpie to do a rapid ideation exercise in order to get some initial ideas out. Then I defined the basic application structure and sketched some rough wireframe ideas, which I made into an interactive prototype using Prott.


Try out the prototype!  

Usability Testing

Once I had a usability test plan and script, I conducted a usability test with 3 participants, taking detailed notes on any issues they had completing the tasks provided. These tests took about 10-15 minutes each. The results were synthesized into a usability test report and improvements were made to the wireframes. I then conducted a second round of testing with 3 new participants and created another report from those, outlining next steps.

Challenges

Limitations of a Lo-Fidelity Prototype

The majority of the issues users ran into had to do with the low-fidelity nature of the prototype. Many screens were still missing and the UI elements were difficult to discern. The game mechanics and interstitial screens especially needed further development to make the prototype feel more realistic and make sense to users.

 

In the second round of testing, I enhanced the fine details of the screens, but still kept it in a low-fidelity sketch format for quick iteration. This along with some other task-specific fixes appeared to help my next group of users.

User Interviews and Testing

Trying to conduct an interview and take notes at the same time was less than ideal. It was even more difficult during usability testing. Despite letting them know that they could be 100% honest in their feedback, I suspect most of the users held some of their punches due to their relationship to me or because they knew I was the designer.

 

Lessons learned! I would make the effort to record future usability test sessions (with the users’ consent). For real world usability tests, it would be best to find target users outside of my personal network whenever possible. I also believed that practice would improve my interviewing skills, which would put testers at ease to say what they are really thinking.

Outcome

At the end, I created a presentation of the process and my key findings. The assumption was that the presentation was for an audience of my colleagues at work. I received a highly positive review from my instructor. If I were to build on this project, next steps would be to create a higher-fidelity computer-generated prototype for a new round of usability testing. 

​

Prototype  |  Presentation

bottom of page