An accessibility audit of the SeniorTix website to improve usability.
Overview
SeniorTix is a website that collects and displays discounts available for senior citizens on a variety of events, outings, and activities.
Role
UX Designer
Project Type
UX Design
Duration
February 2023 (2 weeks)
Team
Solo designer
Accessibility Issues
Based upon my observations of Michael and Janice navigating SeniorTix, I compiled a list of major accessibility concerns.
Fonts are too small and hard to read on images
Discount symbol system not legible or clear
Clicking area of buttons is too small
Process
Prioritization
For both users, the cards were difficult to read and understand, and because the SeniorTix website mainly relies on cards to convey information on the events, this was my first priority.
Sketches
This sketch shows different directions for the card design. I focused on issues #1 and #3, which were increasing legibility and ensuring those with fine motor skills could click the buttons easily.
Layout
Next, I sketched out different layout designs and addressed issue #2 which was the confusing discount system. In these sketches, I also highlighted the filter and introduced a search bar to help users narrow their search.
Design
Hi-Fidelity Design
Taking the ideas from my sketches, I created a hi-fi design in Figma, this is actually the 7th iteration!
I laid out the website so that users would follow it step-by-step vertically which meant moving the filter to the top.
Having a search bar would make the process faster
A filter helps give seniors an idea of what events are on SeniorTix
Checked boxes are highlighted to be clearly seen
Card Design
I didn’t go with the long form card design because that may result in users having to scroll longer and cause potential strain. I chose to put only 2 cards per row to help with ease of legibility, and to prevent crowding of information.
Sections are in highest discounts to lowest
Discounts are clearly labelled
Key Takeaways
After completing this design sprint, I learned that it's better to be specific than vague (ex. placing the discount percentage) and to be intentional section placement. My next steps for this project would be to test the high-fidelity design for further refinement and feedback and add interactive elements to the prototype.
