Type of Project:
UX Research + Accessibility + Web Design

Role:
UX Researcher, Web Designer, Documentation

Platform:
Wordpress

Tools:
WEB (AIM)
Google Audits
SilkTide
Adobe XD

Deliverables
Website

The motivation for this project was a NYU student who was visually impaired and interested in the arts. One of the challenges this student faced was having verbal descriptions for art hosted in NYU galleries. Verbal descriptions provide accessibility to visually impaired and blind individuals.

VIEW WEBSITE

About Crip
Imponderabilia

In response to the lack of verbal descriptions, this student began planning an accessible exhibit which would feature artists from the disabilities community and several verbal descriptions options. The student was also looking to make the exhibit more accessible by creating a website. In order to achieve designing an accessible website, I was sought out for my expertise on web design and digital accessibility implementation. The goal of the project was to create an accessible website that provided recorded verbal descriptions, to allow visually impaired visitors to have deeper engagements with the artwork.

Audience

Who can benefit from this?

PRIMARY USERS

Users that have a vision impairment or are blind that are visiting the NYU Gallatin gallery.

SECONDARY USERS

People from the NYU Community that can tangentially benefit.

The Problem

How to make our website as accessible as possible.

Our design approach for the website was to focus our efforts on designing for screen readers, while not compromising on the aesthetic. We wanted to ensure that the site was easy to navigate and provided a good user experience. In order to make sure we were on the right path, we started to map out the important components that would help us achieve this before the exhibit opens.

Number one

Choosing a Platform that enables us to create a website that is ADA compliant and flexible for us to redesign to our needs.

Number 2

Getting real user feedback from people who are visually impaired or blind to test our website using a screen reader.

Number 3

Going above and beyond the required W3C Accessibility standards to make our digital content accessible.

Methodology

Website Implementation

The design plan for this project was broken down into two parts: website usability (with web accessibility in mind) and connecting the art gallery experience to the website. We were looking to answer if the website we created for the gallery was accessible and usable for all types of users.

For the website, we broke it down to a few pages in the site map below.

Sitemap for the website in blue colors showing the hierarchy of the web pages.

Based on the above site structure, we started to design the site and adding all the content. The goal was to make the website playful and bold in color. All images featured on the site have descriptive ALT text, an Accessible PDF of the promotional flyer, audio/written transcripts of the each artwork, and an accessible contact form. Below you can find the design we created.

Crip Imponderabilia artist page with a grid of artists and photos of their artwork.Crip Imponderabilia Artist page featuring artist thumbnails and names in a 3-up grid formatCrip Imponderabilia About page featuring a quote and text about the exhibitionCrip Imponderabilia Artist detail page featuring the artist statement, a slideshow, audio description and transcripts.

User Feedback

Website Usability

We were looking to answer if the website we created for the gallery was accessible and usable. We first checked website usability through an internal and external review process on the pilot site.

Internal Group Review

We used JAWS and Apple’s VoiceOver to check for website usability, then we documented the feedback in a spreadsheet. By testing the website with the software, we were able identify and address any compliance issues.

External Review

For the external review process we included a few users from the disability community. These users were asked to follow three steps in the pilot website review process.

Step 1
They were asked to go through the site on their desktop computer.

Step 2
Each participant filled out a survey that questioned: their comfort with assistive technology while browsing their mobile device and/or desktop. Participants noted any frustrations and errors as well as their overall experience on the site.

Step 3
Alert the group when they had completed their feedback.

This process led to valuable feedback that informed our final site. Some of the crucial feedback from visually impaired users includes things such as the alternative text being too long, and to consider having shorter text. That it's best to keep it within 140 characters. As well as consider designing for mobile overall, because that’s how the screen reader reads through a website. 

Conclusion

Connecting with the Art Gallery Experience

Connecting the art gallery experience to the website was executed on the gallery reception day in an interviewlike format where participants talke about their experience.

We were looking to answer: how does augmenting the experience in the physical space of the gallery connect to the verbal descriptions offered from the website? This was done by asking people that finished touring the exhibit to step aside to answer some questions.

The questions focused on people describing their experience in the gallery, interacting with the art, using the the verbal descriptions in the physical space, and how it compared to the online environment. These interviews yielded more suggestions on how to improve the website and the impact the exhibit had on the gallery experience. 

In conclusion, providing verbal descriptions both through the website and in the gallery space (using assistive technology) were helpful to people with vision impairments, as well as, other groups in the disability community. The exhibit and site reached wide audiences at the university, as it was advertised in mass communication at NYU. We were able to reach both target populations. We were able to provide access  to various groups within the disability community and received positive feedback about inclusivity. As well as, introducing the head curator and events planner at Gallatin to the possibility of using Wordpress as a means to provide verbal descriptions to gallery visitors.