A Conceptual Mobile Application



Project Overview





Study Break! is a native mobile application built to assist working adults and busy students who want to maximize the short opportunities they have to squeeze in a study session during the gaps in their packed schedules.


The goal was to create a flash-card based study aid that allowed for quick study sessions and quizzes to help students retain the content and practice for live exams. In order to gain a good understanding of where the current market is and a solid foundation of the features users would look for in a study aid, I performed a competitive analysis where I reviewed the apps: Quizlet, Flash Cards GO, and Flash Cards.


My roles for this project covered all aspect including UX Research, UX Design, Testing, and UI Design.

Tools used:

  • Affinity Designer
  • Affinity Photo
  • Marvel Protoyping
  • Zoom (interviews & live testing)


Competitive Analysis





During the competitive Analysis, I reviewed the initial usability of each app, paying close attention to how each app on-boarded me as the user and how easy it was or wasn’t to create, edit, and interact with study cards.


At the end of the competitive analysis, I had a list of several features to consider for my own study card application. Among those were:

  • Allow for a high number of cards within a deck
  • Allow the user to determine which side of the card shows
  • Create a study session feature where all edit features are hidden
  • Create a quiz feature that allows users to test themselves and view results
  • Separate paid features from free ones and minimize how many times a user is prompted to upgrade.


Flash Cards GO App



Quizlet App



Flash Cards App



User Interviews





User Interviews for this app began narrowing down the target audience to the demographic of working adults between the ages of 35-50. I focused in on people who were currently enrolled in or who had completed an educational program within the last 6 months. The goal for the User Interviews were to identify study habits of these working adults including where they primarily studied to retain information, how often they were able to study, how they currently use electronic aids in their studies, and how often they had study sessions before exams.


The question script was as follows with follow-up questions varying based on the interviewees responses:

  • Are you a professional, student, or both?

  • What was the reason for your recent need to study vocab?

  • If a current student, how often do your studies required you to learn new vocabulary?

  • What frustrated you most about learning new terms?

  • What software do you currently use to aid your studying? Why does it help? Is it missing anything?
  • For your most recent test, how many study sessions did you have? How long were they?

  • Where did you do most of your studying?

After completing the interviews and gaining a much clearer feel of user's study habits, motivations, and struggles while studying, I compiled this list of key points to implement:

  • Ways to make boring content more engaging
  • Study reminders based on previous sessions
  • Focused sessions based on accuracy of previous sessions
  • Options for various test formats like true/false, fill-in-the-blank, matching
  • Mini celebrations/ acknowledgements that users are doing well
  • A speech-to-text feature
  • Short process for creating cards for time efficiency


Proto-Persona





Based on the results of the user interviews, I sought to craft a pronto-persona that encapsulated the traits, struggles, and goals of our primary audience. With our persona in place, I began to craft stories to help creation of task analyses and user flows before creating our first round of wireframes. ​



Study Break! Proto-Persona



User Flows





After generating both User Stories and Job Stories from our primary persona, Alicia Stone, I began work on drafting the analyses on two of the most primary and essential tasks that would make this app function and be most useful to the user: Creating a Study Deck and Completed a Practice Quiz.



Study Break! User Flow



Wire-Framing





With the the user flows completed and an understanding of the basic features of the screens in mind, I began to sketch out wireframes for the following screens and scenarios:

  • On-boarding
  • Home Dashboard
  • New Deck/Create a Card
  • Practice Quiz
  • Pull Out Menu


Usability Testing





Before creating a working prototype for usability testing in Marvel, I made the effort to create low-fidelity digital screens for increased legibility during testing and ease in editing when feedback is received and applied.


The primary functions of Completing On-boarding, Creating a New Deck, and Completing a Practice were the focus of the usability tests.


The working prototype for this project can be viewed HERE.


The tests consisted of one, 10-15 minute session with the testers completing five main tasks:

  1. Complete On-boarding

  2. Create a new Study Deck
  3. Complete a Practice Quiz
  4. Enter Study Mode

  5. View Folders

During the test, these tasks were given in the following scenarios:

  • "You've just downloaded the app, now open it up and complete the on- boarding process to get to the home screen." 

  • "You have a test coming up and you want to create a new study deck with 2 cards." 

  • "After creating a deck, you now want to have a session in Study Mode." 

  • "You now feel confident enough to attempt a practice quiz."
  • "After creating a deck you now want to view folders you have available." 


Three users were tested via Zoom where the users interacted with the Marvel prototype while I watched on. Using the Jakob Nielsen Error scale, each mistake or comment made by the user was recorded and rated on a scale of 1-5. 1 being something to not consider very strongly and 5 being a very critical usability error.


Each user stumbled on the same three issues which I ranked as a 3 on each individual test. Looking back now and seeing that each user struggled with these areas, a rating of 4-5 may be more appropriate.


The three major usability errors were:

  • Completing the on-boarding process - Every user stopped clicking through on-boarding, not realizing they were in an on-boarding process
  • The correct action buttons for Study Mode and Quiz were forgotten by the user after going through on-boarding and there was no text to identify the buttons.
  • When trying to leave a study deck or practice quiz, they could not find the appropriate button to use - An “X” at the top left was provided, but largely ignored with two users going to the pull-out menu looking for a “Home” button

To improve usability in these three areas, the following changes were made:


On-boarding:

  • Prompts were added to the beginning of the process such as “Let’s show you around!”
  • The “how-to” screens for adding cards were removed from the initial on-boarding and added to when the user first choose “Create a Deck” from the home screen.

Action Buttons:

  • How-to prompts were added to this screen when the user first accesses it ensuring the directions are fresh in their minds.
  • Small descriptive text was added under the buttons to remind users of the functions.

Returning Home:

  • A standard “home” icon was added to the top left of the app so users know that takes them back to the home screen.
  • A “Home” option was added to the pull-out screen.



View Prototype on Marvel

Style Guide and User Interface





Sample screens and a style guide created.



Study Break! Style Guide



Study Break! Mobile Interface



nicklewisartanddesign@gmail.com