Projects

SJ - Accessibility Lead

December 04, 2023
SJ Design

Role: Accesibility Lead
Tech: Figma, Accessibility
Year: 2023 - 2024

At SJ, I significantly enhanced digital accessibility by collaborating across teams and leading key initiatives. I coached developers and designers, conducted internal audits, and used various tools to ensure WCAG 2.1 compliance. My findings, organized by WCAG criteria and prioritized, helped product owners effectively address accessibility tasks.

- Led strategic decisions and workshops, advancing SJ's accessibility mission.
- Conducted audits and user testing, directly improving product inclusivity.
- Developed and refined SJ's design system, embedding accessibility at its core.
- Initiated a roadmap for the European Accessibility Act / EAA

Web, iOS and Android

Together with a colleague, I conducted rigorous accessibility audits of SJ applications on both Web, iOS and Android. Over several weeks, we tested the applications thoroughly and reported issues and bugs directly in Jira. This approach streamlined prioritization for both us and the product team, helping determine release readiness and specifying the sprint for resolving each ticket.

User Testing

I was also responsible for user testing, inviting individuals from various organizations to the SJ office. They tested the new interface using their tools to verify its functionality. This was one of the first times we tested the new UI with real users, and despite being a test environment, it was highly realistic. I gathered valuable insights, which I then presented to all designers and product owners.

Person working on a laptop with a login screen visible on the display.

Key insights:

Customize traveler
The new feature for adding and editing traveler information worked well. However, some users reported that the options to select a wheelchair and guide dog were somewhat inaccessible and not clearly positioned. One of the recommended was to find solutions by drawing inspiration from the app's design.

Some ambiguity in the copy
Users experience some confusion around instructions like "Select return trip" and "Continue." A brief review was needed to ensure consistency and uniform use of terminology.

Improvement potential exists - Both digitally and in the real world
Key issues included discrepancies between digital services and physical accessibility, such as inaccessible toilets, misuse of wheelchair and stroller spaces, difficulties in contacting onboard staff, and unreliable elevators during track changes at stations.

Person using a rugged laptop mounted in a vehicle.

Quotes

We know how it starts - but we don't know how it ends.

I usually choose as high a number as possible to be closest to the toilet.

The door opens, and I don't have time to read what is written in Braille.

Design system

Another part of my role was collaborating with the design system group to test and provide feedback on new and existing components. I served as a UX Designer, ensuring that we tested with tools like VoiceOver, NVDA, and keyboard. Additionally, I educated other teams on effective accessibility testing, creating a comprehensive framework and presentation to guide developers and designers in best practices.

2024-2025 Roadmap

The final part of my role involved creating a roadmap for accessibility initiatives for 2024 and 2025 to prepare for the European Accessibility Act / EAA. This directive will impact SJ's digital development for both mobile and desktop applications (excluding internal tools). I identified organizational needs and pinpointed where resources should be allocated to ensure the best user experience and compliance.

I highlighted high-risk areas where SJ didn't directly own the code, particularly with third-party services. Under the new European Accessibility Act / EAA, organizations are responsible for ensuring that their third-party solutions are WCAG-compliant. Additionally, I educated the organization on the importance of considering the users behind the technology, shifting the focus from merely complying with the law to prioritizing accessibility in all aspects of development.

Illustration of icons representing the five senses, with each sense divided into four specific states or types.

Checklist for different roles

Accessibility for Product Owners

  • 🟢 Think inclusively from the start

  • 📚 Know the relevant laws and guidelines

  • 🛠️ Provide the team with the right conditions to succeed

Accessibility for Developers

  • 📝 Follow coding guidelines

  • 🌐 Write semantic code

  • ⌨️ Support keyboard navigation

  • 🛠️ Use established patterns for custom components

  • 🖼️ Provide text alternatives for graphics and images

  • 🏷️ Create structure with headings and landmarks

  • 🤖 Use automated tools

Accessibility for Editors

  • 🖼️ Alt texts: Describe what is visible in images; linked images have empty alt attributes if there is visible text.

  • 🔗 Links: Use descriptive text, avoid "click here."

  • 🏷️ Headings: Use <h1> for each page, maintain logical hierarchy, avoid skipping levels.

Accessibility for Designers

  • 🎨 See accessibility as an integral part of the design process

  • 👥 Design for a broad and diverse user group

  • 🌈 Use accessible colors

  • 🧩 Create simple, logical flows

  • ✍️ Write clear texts and instructions

Accessibility for Testers

  • 🧑‍🏫 Learn the basics of testing with screen readers

  • ⌨️ Test the entire flow using only the keyboard

  • 🔍 Use tools to catch simple errors

  • ✅ Include accessibility in regular test cases