01-min-1

Web Accessibility Audit

Trek Medics is a tech nonprofit that created the Beacon platform, a versatile crisis response software. Its use cases range from mental health responders in the U.S. to paramedics in war zones. I conducted a web accessibility audit for them as their sole designer.

Key Assumptions

1

👀 Assumption

Full AA compliance is required for accessibility

2

👀 Assumption

All specific types of disability must be addressed (i.e. motor, hearing, vision, cognitive and situational, temporary, permanent)

3

👀 Assumption

We must know the exact number of dev hours required for every accessibility change, before starting implementation, so the business can plan effectively

Reality
Accessibility is a dial, not a switch. Accessibility improvements can be implemented gradually over time.

Reality
We should be solving for our users (U.S. county dispatchers and responders) and general disability use case

Reality
An iterative approach focusing on straightforward fixes first, is more practical due to resource constraints

Who are we solving for?

Dispatchers used the desktop app and sat in the head office, managing the incident. Responders used the mobile app and would be on the ground, resolving the incident (paramedic, firefighter, police etc.). Initially, the focus was solving for users that had disabilities mentioned in the WCAG guidelines, whilst maintaining aesthetic functionality. Further insight revealed the importance of considering our specific user needs.

03-min-1

Dispatcher - Desktop App

Samantha is highly skilled in managing coordinating appropriate response units efficiently. She uses the Beacon desktop app to monitor incidents, allocate resources, and communicate with responders on the ground. Her role requires a keen eye for detail and the ability to remain calm under pressure.

Responder - Mobile App

Michael is a seasoned paramedic specialising in crisis response in conflict areas. He relies on the Beacon mobile app to receive real-time updates about incidents, navigate to locations, and report on patient status. The app is crucial for his day-to-day operations, especially in environments where communication infrastructures are compromised. Michael values reliable tools that are easy to use, and capable of functioning in low connectivity areas.

04-min-1

Understanding WCAG

The WCAG guidelines are an extensive document detailing accessibility levels with examples and exceptions. I created a simplified version, making it easily understandable for non-technical stakeholders such as founders and product owners, and provided a concise summary for developers.

The design process involved understanding the WCAG guidelines myself, conducting the audit, prioritising updates, writing users stories and then finally creating a template that Trek Medics could use for future self-audits.

5.2-min

Research

My research showed that the government partner had no disabled dispatchers. Dispatchers with temporary disabilities like a broken arm could take sick leave, and those with severe disabilities would be very unlikely. Key accessibility features, such as improved colour identification and keyboard navigation, would also help non-disabled dispatchers manage multiple screens more efficiently in high-pressure situations.

16-min-1
07-min-1
08-min-1

Challenges

Challenges included resource constraints, the complexity of WCAG and identifying the specific criteria that was relevant for Beacon.

Frame-316-1

Scope of Work

I understood and summarised the WCAG 2.2 AA requirements relevant to Trek Medics. I provided suggestions on how they could achieve these standards, focusing on areas such as titles, ALT text, typography, colour contrast, spacing, and forms.

I also assessed and prioritised the necessary changes based on effort and impact, using a traffic light system for priority and categorising effort levels as low, medium, or high. For instance, enhancing keyboard accessibility for map markers involved more effort than adjusting the spacing between buttons.

05-min-1

Prioritisation

I limited the project’s scope to focus on ‘low hanging fruit’, i.e. quick accessibility updates that would improve a broad range of accessibility use cases. The founder noted that devs often can't precisely estimate coding times due to software complexity. Initially, I tried creating a difficulty vs. value matrix diagram to prioritise tasks, but this was overly complex. I switched to t-shirt sizing and five star ratings to more clearly identify areas needing improvement.

17-min-1

Solution

I took screenshots of the platform and annotated the specific locations that needed updates, including alt text etc. I made a design system to enable the devs to begin addressing simpler tasks such as colours and typography, while I focused on refining more complex platform components. The system provided guidelines for colours, typography, alert buttons, keyboard shortcuts for maps and general accessibility tips.

15-min-1
14-min-1

Design System

I created a design system to help the team with hard baking accessibility practices in their development moving forward. My system included new standardised colours and guidelines on text.

18-min-1
19-min-1
20-min-1

User Testing

Lack of resources meant postponing extensive user testing with disabled users unless specifically requested by a government partner for their dispatchers or responders with disabilities.

09-min-1

WCAG Compliance Roadmap

To streamline my collaboration with Trek Medics, I developed an internal process roadmap. This included prioritising small, high-impact updates that enhance accessibility, starting with the mobile app where team availability was higher, and then systematically progressing through other platform updates.

Although Product Owners (POs) typically write user stories, I created 12 stories. This would enable the POs to quickly create work tickets for the developers. I took on this task myself, as I was liaising between the devs and non technical stakeholders and I wanted to ensure the first few stories met the required standards.

10-min-1

Final Deliverables

The accessibility of the platform was identified to be 66% compliant for the mobile app and 58% compliant for the desktop app.

The final assets I delivered for the project included:

  • An audit of the mobile app, desktop app and documentation
  • User stories
  • Summary of all the WCAG criteria in plain english
  • An accessibility compliance roadmap
  • Template to conduct future self-audits
11-min-1
12-min-1
13-min-1

In Conclusion

Frame-336

Testimonial

Faiz consistently anticipated our engineers' needs and was always thinking ahead to both identify obstacles early on and to come up with potential solutions to overcome those obstacles. All of our team members found it very easy to work with Faiz, commenting how thoughtful he was in his interactions and his ability to take a very complex and daunting project and turn it into a manageable and easy-to-understand development plan.

I would highly recommend Faiz to anyone needing a UX/UI Designer as I fully believe he'll be a valuable addition wherever he works.

jason-frieson-trek-medics-bio-pic

Jason Frieson

Founder @ Trek Medics