biebel UX
John Biebel UX and Experience Design

Design: Flash Cards

Flash Cards: design for data memorization

A design challenge that includes pre-existing flash card decks and the ability for learners to create their own.

Pearson Writer: high level features

Flash cards and UX

Flash cards have become an important tool by which learners can study, memorize, and master data. Research shows that this data is most worthwhile when defined by the instructor and also when defined by the student (when he or she makes their own decks of flash cards.) The project involved the easy facilitation of assignment, creation, usage, and enjoyment while using the cards.


Finding the pre-created Flash Card decks that are available to the learner, and in some cases assigned for a course, is a flow that needed to be made as smooth as possible.


Making the actual process of receiving a question, choosing / writing a correct answer, getting feedback and help, was all part of a thoroughly researched and tested pattern that required a lot of nuanced decisions. The user flow is deceptively simple, but small cues can add to the user’s confidence while studying the flash cards.


Here is an example of a card that requires a typed or “fill in the blank” response, and the feedback that is received depending on the response.


Creating new cards is something that instructors can do for their students, or students may do for themselves. Here, a card is being created using terminology from a Wikipedia entry. Because many different screens are being accessed in order to make a card, it was important to keep the steps to a minimum so that the student wouldn’t get lost in the process.


The card is then added to a deck, and the deck is then uploaded to available decks online. Providing success messages was key due to the frequent screen switching that the creator would experience while making a card. This is a common mobile usage challenge, but one that we can be overcome by providing the best messaging at the right time.


Finally that deck is then copied by the user to his or her larger group of decks in their Flash Cards application.


This video takes you through a Flash Cards flow, points out some important accessibility changes made for the cards’ design, and some error states that were created to accommodate workflows.

Next Project: Auto-graded Writing Solutions