top of page

Vocabulary App
Case Study 

Admin.png
Add New Word.png
Sign UP.png
Vocab Page.png
Reminder Settings.png

Meet Vocab

Vocab is a low fidelity mock up of a mobile app that helps user learn new vocabulary words in a fun and engaging way. 

Overview

The Challenge 

Create and test a low fidelity mock up of an app that will help empower people to learn new vocabulary. 

The Problem 

How might we design a mobile app that empowers people to learn new vocabulary?

The Goal

Create a low fidelity vocabulary app that meets the users needs and goals in a fun and engaging way. 

Timeline & My Role

Role: UX Designer            Timeline: 3 weeks 

The Process 

1) Research
Creating Vocab began with generative research, which included a competitive analysis, understanding business requirements, and gaining insights into the problems Vocab aimed to solve. 
Group 1 (3)_edited.jpg
Image: Example of completive analysis for one competitor.  
2) Understanding the User 

To better understand potential users, I conducted user research that included user interviews and the creation of a proto persona. Creating a persona helped me design with user needs, behaviors, and pain points in mind, fostering empathy and providing clear guidance.

​

Meet Nicole, Vocab's primary user. As a busy professional, she needs a way to use the app on the go and easily add new words. Nicole was developed based on insights from user interviews.

Layout 2.png
Image: Proto Persona Nicole
Wireframes.png
3) User Flows, Wireframes and First Prototype 
Keeping Nicole in mind, I developed user flows to determine the best structure for Vocab. After finalizing the user flows, I created both paper and digital wireframes. I began with quick pen-and-paper iterations to explore and test various navigation flows and organizational structures, then moved to Figma for further refinement.
PXL_20240803_232923130 1.png
Image: Paper Wireframes 
Video: Digital Prototype 
User Testing.png
4) User Testing
With the low fidelity prototype ready to go, it was time for user testing. The initial round of user testing consisted of creating a test objective, plan, script, and of course, the testing itself.
                                                                 Test Goals:
The primary goal of this usability test is to assess how effectively the user interacts with Vocab to help determine the app's usability. Areas of focus include, identifying usability issues, measuring task completion success rate and evaluating overall user satisfaction with Olive. 
Methodology:

The usability test will follow a moderated and remote moderated usability testing method. Participants will be asked to complete predefined tasks with thinking aloud and verbalizing their actions. 

Participants:

The number of participants will be 5-6. The participant profile will consist of healthcare workers and those who have frequent healthcare needs.

Group 3.png
Group 2.png
Results:

After gathering the data from the user testing I was able to identify errors and suggest recommendations on solutions. The errors were also ranked by severity.  

Results .jpg
Results:

After gathering the data from the user testing I was able to identify errors and suggest recommendations on solutions. The errors were also ranked by severity.  

Wireframes.png
5) Updating Wireframes & Prototype 
Based off of the errors identified and their severity Vocab was updated. I selected the design solutions based off of the recommendations and willingness to do another round of user testing. 
Improvements that were made included , new home nav bar, 3rd party log in and restoring the search icon to all screens.
Previous 
 
Video:  First Digital Prototype 
Updated 
 
Video:  Updated Digital Prototype 
Next Steps for Vocab:

  •  Continue to developed the remaining features for Vocab. 

  • An additional round of user testing and designer feedback. 

  • Create a High Fidelity mock up and Prototype. 

  • Create a style guide and Vocabs design deliverables. 

​

Summary Of  Creating Vocab
&
My Learning Journey. 

Creating Vocab was an educational experience that contributed significantly to my growth as a designer and problem solver. I discovered that successful design requires a combination of technical skills and creativity.

 
Key Takeaways:
  • User Testing: The data and feedback I gained from engaging real users was invaluable. Their feedback helped refine the functionality of Vocab and helped create a more user friendly experience.  
​
  • User Personas: User personas helped me design with empathy and make design choices that would better impact the user rather than personal preference. 
 
  • Paper Prototypes: Utilizing and optimizing paper protypes help contribute quick iterations and quick design solutions. 
Key Learnings About Myself: 
  • Functionality through Simplicity : I learned how to streamline and make my designs more simple and effective through the user mental models and site maps. Not overwhelming the user with options or features helped keep the app easy to navigate.   
​
  • Research is key: By utilizing research such as a competitive analysis and user testing I was able to come up with solutions to Vocabs problems. Sifting through all the raw data can lead to some very impactful insights. 
​
​
Overall, creating a low fidelity mock up of Vocab taught me the fundamentals of UX Design. I learned the value of research, user experience and staying open to feedback. If you would like a more in depth UX project, please  visit Olive. Olive is my main deep dive into UX. 
bottom of page