My First UX Design Project

I was challenged to design a vocabulary/flashcard app for my training at Career Foundry.

The deliverables included:

  • An onboarding page

  • A way to sign up and log in 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

  • A means of reviewing vocabulary that allows users to study efficiently and effectively

These were all to be built on the foundation of market and user research and were subject to testing and revision after user-testing the key-feature prototypes.


ROLE

UX Team of One: UX Research, UX Design, UX Writing, Content Strategy, UI/Graphic Design.


SETTING

UX Design student with CareerFoundry.


DURATION

February - March 2022

The Process

Competitive Analysis & User Interviews

I downloaded the top 3 flashcard apps in the App Store and thoroughly familiarized myself with them. Once I felt comfortable with what was on the market, I interviewed three professionals that have to know and recall a large amount of information for their jobs. They had all come to the conclusion years ago that there is not a single tool that will help them in this endeavor, and all of the interviewees had created a system using a combination of physical and digital tools.

Creating a Persona

From the interviews, I was able to create a persona. Her name is Michelle Johnson, a District-Wide Special Education Coordinator in a large school district. A native Texan, Michelle now lives in Chicago with her fiancee, Jessica, and their two black labs. Both she and Jessica are quite competitive and enjoy board games together. She has a Batchelor of Arts in Psychology, as well as 18 hours of graduate courses in Education Administration.

Identifying Michelle's Problem

Michelle has been a teacher in the Chicago area since 2004 but moved to special education in 2019. In addition to all of the difficulties brought on by COVID, her new role has her constantly reviewing large amounts of new and rapidly changing information. She is a busy but committed professional who needs a more trustworthy system to organize her information than a battered old notebook.

The Motivation

Here, Michelle sums up her problem in her own words. The stress of knowing that it is critical for her to know all of these things while also knowing that she cannot seem to learn it must be overwhelming. This became the primary motivation in the design process... How do I design a solution that helps users like Michelle remember and access information in a secure, easy-to-use, fun format?

Michelle's Wants & Needs

Her roles dictate the type of product she needs, and her personality dictates what kind of product she wants. The product she uses must not only serve her well, it must also delight her.

As an educator, she NEEDS to know all of this information to better serve her students, and as a Special Education Coordinator, she NEEDS to stay on top of current legal and technical jargon, as well as the legal processes in place to protect her students.

But, as a human, she WANTS and DESERVES something that is not simply utilitarian.

She deserves something fun.

Initial Sketches & Low-Fidelity Wireframes

Since I couldn't find anything to recommend to Michelle that would sufficiently meet her needs, I began sketching some crude designs for a new app called Brain Fog. The basic idea was a flashcard app, a notes app, and a game… all rolled into one. A one-stop solution for learning and accessing large amounts of information on the go. All with a way to make memorizing and quizzing yourself fun.

Prototyping & User Testing

Once I tweaked and tuned the prototype to my liking, I was ready to do live user testing.

If you ever need or want to be humbled, I recommend spending hours designing an app, and then letting an 18-year-old college student test it in front of you. Phew. That hurt.

But it was a good hurt because let’s be honest, Brain Fog needed some real help, which you can see below. I gained some valuable insights from my round of user tests that will only serve to make Brain Fog an attractive, usable, and desirable app for users, should it ever make it to development.

Usability Test Report

I addressed the key issues in my wireframes and updated my prototype, and began brainstorming ideas for addressing the major usability problem. The process ended here, but if this was a project destined for publication, I would have conducted more interviews, done card sorting exercises to make sure buttons were labeled correctly and tested until the app was ready for hand-off.

Takeaways

This has been a fun but challenging introduction to the UX Design process.

Struggles:

  • Not hearing criticism as an attack on me personally

  • Anticipating user reaction is much more difficult than anticipated

Joys:

  • The wireframing and prototyping process was very rewarding

  • I loved the Marvel App

  • Seeing users use something I put so much energy into is EXTREMELY rewarding

  • Learning and employing the various aspects of UX Design for the 1st time

"I wish this was a real app!"

~ My wife (and user testing participant)