Overview: As an extension to the AI Ethics study, I took on a 3 day design challenge. The purpose of this challenge was to prioritize accessibility when presenting the podcast as a website. Within 72 hours, I created my own version of what this site would look like and made sure to incorporate my research findings on following accessibility guidelines.
Goals: Gain insight into common barriers that may prevent users from interacting with websites; create a working prototype to display navigation of modules
Strategy: literature review, qualitative research analysis, visual mapping
After doing a thorough online search on accessibility guidelines, I discovered the World Wide Web Consortium (W3C). This is an organization that commits to researching users that face barriers on the web given their disabilities. As I reviewed some of their studies, I ran across user interviews which included videos of users sharing their experiences with navigating websites. Some of these questions included...
I then studied these interviews to consult my designs. There was quite a bit of information given the diversity in experiences. To aid with this, I created affinity maps and user personas to have a visual of pain points, positive features and commonalities among users.
This visual mapping of user information was extremely helpful as I was able to have an easier time synthesizing the important features of developing this site. This was a very interesting process as these users had different barriers and tools when interacting with websites. I was able to make note of some key takeaways across their experiences which eventually led to a brain storming session. These takeaways included...
- We can group some of these pain points in relation to these impairments: Motor, Cognitive, Visual, Auditory
- Common tools that were lacking alignment with design included: keyboards, screen readers, joysticks
- Common complaints included: Issues with pop-ups, inconsistent layouts, inability to select or distinguish buttons, lack of directness with language, overuse of images
Based off the information I gathered from studying the user interviews, I was able to do a brain storming session. This allowed me to bring together all my ideas after processing user information. In addition to this, I created some lo-mid fi prototypes to start visualizing my designs. Some of these ideas included...
1. Layout should be simple with clear indication of progress.
2. Each component of the screen should have a very clear explanation/ intention.
3. Audio transcript is easier to depend as opposed to distracting captions on video.
4. Buttons should be large and exist to indicate movement.
5. Headers should be clear and layout should be simple for screen reader nav.
Based on some of the research I'd done, it was best to go with a font that was easily adjustable and clear to read. The Bootstrap 5 UI Design Kit appeared to be a great choice as there is a large emphasis on accessibility within its development. It also met the requirements of adjusting well at various sized and still maintaining a consistent and cohesive appearance. In terms of the primary and secondary color selection, I decided to stay on theme with the colors of the UR Health Lab. Since this is supposed to be a series of training modules led by them, it made the most sense.
1. A simple layout with buttons, easy-to-read text and magnification levels allow for more control.
2. Layout is pretty consistent.
3. Video doesn't start right away and instead gives the user to start.
4. Audio transcript can be navigated like a video.
5. Buttons are present for easier navigation of screen readers and keyboards.
6. Headers are emphasized.
This was my first real design challenge where I was trying to get into the heads of such diverse users. Accessibility design is extremely valuable and I wish there was more of an opportunity to personally reach out to users with similar barriers to consult my designs even more. However, given how comprehensive the video interviews were, along with the resources provided by W3C, I have a greater understanding of features that I should emphasize more as a designer. During this challenge I have learned a lot more about accessibility design systems and how important it is to be more cognizant of making webpages align more with tools such as keyboards and screen readers. If I had more time and resources, I would try to get more feedback on my current designs and continue to build upon them.
Role: Researcher | Duration: 4 Months | Tools: Qualtrics, SPSS, R Studio
Team: Abby Rosenberg, Stefani Kinzy, Ramisa Maliyat