Assignment Two

Design a User Flow for Accessibility

Related OER Reading: https://www.interaction-design.org/literature/article/flow-design-processes-focusing-on-the-user-s-needs


Assignment Overview

This assignment asks you to be the advocate for a particular user or set of users with a specific disability or learning style. You'll work through a scenario, choose a user group, and then redesign some elements and systems to make them more accessible.


Stuff to Read

What is a User Flow?

"User flow is the path taken by a prototypical user on a website or app to complete a task. The user flow takes them from their entry point through a set of steps towards a successful outcome and final action, such as purchasing a product" (Optimizely.com, 2017).

Similar to a journey map, a user flow is, in essence, a flowchart for usability. It shows, typically in diagram form, the way that a user flows through a user experience. For a website, this means that it serves as a diagram to see how and where users "flow" through a site.

To learn more, please read the following:

Lastly, review the following article about helpful tools for creating user flows: How to Create a User Experience Flow Chart (UX Flow Chart) by Will Little.


Stuff to Do

Step 1: Choose a Scenario

To begin, pick a scenario from the following list. If you don’t like any of the below you’re welcome to pick your own; these can get you started:

    1. Choose and purchase a new pair of shoes online that are comfortable, stylish, in a specific size and color, and ready to ship within 1-2 days.
    2. Research the top five smartphones of 2017, then choose a mobile phone carrier and figure out the best deal on the best phone – that is eligible to be purchased on Boise and is in stock to buy today.
    3. Find an event coming up within the next 1-2 months that looks interesting and requires tickets to attend. Try to locate tickets and then determine a) how much they’ll cost; b) whether you can find seats that are accessible for you (see Step 2, below); and figure out where you’ll park for the event and/or how you’ll get a ride to attend.
    4. Locate a free online course in a topic relating to technical communication (e.g., XML, HTML, CSS, writing, editing, design, and so on), research its credibility, and register for one that you find interesting and that you feel would work well with your learning style and/or ability level.

Step 2: Choose a User

Now that you have your scenario, decide on your user persona. Choose at least one of the following:

    1. A user who is deaf or hearing impaired.
    2. A user who is colorblind, blind, or sight impaired.
    3. A user who is elderly and/or not familiar with using the Internet.
    4. A user who is gender non-conforming.
    5. A user who is under the age of 13.
    6. A user who reads at a second-grade level.
    7. A user who can only use one hand to operate the computer.
    8. A user who has ADHD (attention deficit hyperactivity disorder).
    9. A user who has dyslexia.
    10. A user who has a seizure disorder, such as epilepsy or migraines.
    11. A user with a memory impairment.
    12. A user who has muscle weakness, chronic pain, and/or poor hand-eye coordination.
    13. A user who is a visual learner (prefers photos and videos to comprehend information).
    14. A user who is a hands-on (kinesthetic) learner (needs to physically use something to fully understand it).
    15. A user who is a verbal learner (prefers writing and/or speaking when learning or researching new information).
    16. A user who is an auditory learner (learns best with sound, music, and audio).
    17. A user for whom English is a second language.
    18. A user for whom sign language is their first language.

Note: You will navigate your chosen scenario from Step 1 from the viewpoint of at least one of these user groups.

Step 3: Run Through the Scenario and Take Notes

Using the above scenario and user profiles, go through each scenario. Observe and note the following, at a minimum:

    • Where you go and click.
    • What action(s) you take.
    • When and where you have trouble finding something or navigating the site.
    • How you feel and when, and if you demonstrate strong emotion; e.g., frustration, excitement, joy, anger.

Note: You may also do this exercise with a classmate or friend, taking turns acting as user(s) and observers/recorders.

Step 4: Document the User Flow

As you work, write down as much as you can about the experience. In addition, briefly sketch anything you think may need additional explanation. Finally, use a diagram and arrows to indicate what the user does first, then second, then third, and so on.

The result of your note-taking is what is called a user flow, or the flow pattern that a user takes from start to finish while visiting a website, purchasing a product, or completing some other series of tasks (see the example at the bottom of this page).

Step 5: Devise Some Solutions

Finally, with the above in mind, read through the below handout “Things to Look for When Critiquing or Designing Universal User Experiences.” Using the Metrics for Judging Accessibility and the appropriate Common Accessibility Issues that relate to your chosen scenario and user, identify ways that the website could improve its accessibility. Write down 3-5 specific recommendations that you would give to the site’s owners to help them improve. (Note: If you can’t come up with anything, write down specific things that the site is doing right with notes on why they are already exceeding common accessibility standards and doing an exemplary job for their users.)

User Flow_Things to Look for.pdf

Turning in This Assignment (up to 150 points)

To turn in this assignment, write up a short (1-3 page) memo that includes the following information:

    1. Which scenario and user you picked.
    2. A copy of the notes you jotted down (if you did it by hand, you can take pictures).
    3. A copy of the user flow diagram you created.
    4. A description of the revisions or design solutions you’d recommend.
    5. A brief reflection on the exercise (e.g., what you learned).

To receive points for your assignment, email your instructor with the copy of your memo. Please indicate "User Flow" in the email subject line.

Bonus: Publish Your Work as an Open Educational Resource (up to 25 points)

Openly share your work -- and get published! License your work with Creative Commons and I will host it as part of a future textbook and/or asset library linked to a future textbook about technical communication, interaction design, and user experience. Your work will serve as an example for other students at Boise State and elsewhere.

If you would like to contribute to the project, email me with a copy of the work you'd like to openly license (or tell me when you turn it in that you'd like to do so). You will earn 10 extra credit points for sharing your initial work, and up to 5 extra credit points for sharing additional, updated versions throughout the semester (up to a maximum total of 25 bonus points per submitted assignment/deliverable). Every iteration should present a richer example for future students to benefit from.

For this bonus opportunity, you will also be recognized as a co-author of the open textbook, once it has been published.

Example of User Flow Diagrams

User Flow Diagram (CC BY 4.0) by Andrea Courtright, technical communication student at Boise State University.

User Flow Diagram (CC BY 4.0) by Andrea Courtright, technical communication student at Boise State University.