How-To Design for Disabled Audiences
Illustrated a step-by-step tutorial for people with learning disabilities to enable them to learn how to make the perfect s’more.
Introduction & goal
Over 10% of the world’s population is affected by learning disabilities. These disabilities limit one's capability to read and learn, making even the daily mundane tasks hard to complete. I interviewed several learning impaired individuals to find the best method of communication to design a step-by-step tutorial on how to make the perfect s’more.
Bite-sized summary
- Recognized the challenges these disabilities pose, limiting ones ability to read and understand even the simplest instructions
- Researched how-to tutorials to find the best method of communication to teach skills needed to perform basic day to day tasks
- Created design goals and requirements for the poster and mobile tutorials
- Photographed the process of making a s’more at an angle that made it easy to visually understand the steps required
- Illustrated and created a how-to poster and mobile app prototype
- Performed user tests
Credit & Roles
Product Designer & Illustrator — Josie Morris
1. The Challenge
With no foreseeable cure to learning disabilities, those affected must learn to adapt to these challenges. Although advancements in technology including enhanced learning applications capable of adapting to individual needs have positively impacted these individuals, there is still a limited number of resources available to them.
Many disabled adults are highly functional and strive not to let their disabilities limit them. Having spent more hours around a campfire than I care to admit, I have grown fond of both making and eating s’mores. While attempting to teach my autistic uncle the steps to a perfect s’ more, I decided to create a tutorial for those struggling with similar disabilities.
2. Doing Research
To better understand my audience, I searched for current ways disabled adults learn how to complete their day to day tasks. Downloading app after app and making a complete mess of my kitchen, I attempted to follow professional how-to tutorials in an attempt to understand the icons and visual cues used to convey motions or tasks.
After attempting the tutorials myself, I sat down with my autistic uncle to test which instructions made sense. While running him through a variety of tutorials and how-to’s, I was able to identify tasks that proved too difficult and overly complex.
Since the majority of people with disabilities have a high school level of education, I also
The images above show examples of this research. These how-to tutorials convey the design styles, icons, images, and layouts that are used to design an easy to follow tutorial.
3. Design Goals & Process
Accounting for the illiterate, I needed to design a tutorial that used visuals and as little text as possible. To accommodate those with and without a mobile device, I designed both a mobile and poster tutorial.
After buying the items needed to make a s’more, I practiced sketching each item to find the best angle to draw it.
4. Photographing Steps
I photographed each ingredient as well as the assembly of a s’more from both the third person point of view and the first-person point of view. These photos helped me as I made the forms digitally.
5. Prototypes & User testing
As I initially prototyped the tutorials, I felt like I had to show everything that was happening in a step so that they would understand the instructions. However, once I had jammed all the information onto the poster, I noticed how hard it was to follow the instructions.
After user testing the layout of the poster, I soon found that it was confusing my users as well. The more information I crammed onto the page, the smaller the steps and important icons became. This made it hard to tell what actions they should be doing and what step they were on.
I decided to crop portions of the steps so that only the needed information was in a particular step.
Changing the perspective from which I was showing the s’more was the next step since it allowed the user to better understand the pieces and how they fit together.
I performed another round of user testing and found that users would follow the poster step by step, never once looking ahead at the final result to see what it should look like. This helped me ensure each step had all the instructions they needed before moving on, otherwise, they would have to backtrack to previous steps.
After multiple iterations and a final round of user testing, I compared my work with professional designs to make some final adjustments.
I threw a party and invited students from other countries that had never heard of s’mores before. I had them follow my instructions to make the perfect s’more, and was happy to see that they could follow the steps with little confusion.
6. Learnings
This project helped me realize the importance of white space, using images and graphics to convey information and, of course, user testing.
- White space — Earlier I had mentioned and shown examples of when I had tried cramming large graphics onto the same page. This made it near impossible to walk my users through the steps in the right order. Even after adding large numbers for them to follow, they got lost. Once I cropped each step down to only the vital information, the white space allowed the steps to stand out.
- Graphics and Images — The human brain processes images 60,000 times faster than text. As a designer, being able to leverage images to convey information allows me to pass information quicker. Whether the target audience is illiterate or not, being able to convey information in that way is a powerful tool.
- User Testing — Designers tend to get caught up in their designs and can forget just how non-user-friendly their designs can be. Decisions can be very biased when we jump to conclusions on what users will do. User testing allows us to eliminate assumptions and bias and get real feedback.
