Tanzu Accessibility
Back to ProjectsSummary
After a series of unsuccessful accessibility audits, I spearheaded an initiative to embed accessibility as a core value in our feature development process; educate stakeholders; in addition to identifing and resolving accessibility issues across our suite of 8 products. This transformation in thinking resulted in a shift in attitude and increased our compliance score from 60% to 87%.
Role
Accessibility Lead - Auditing, Education, Evangelism
Company
VMware
The Problem
A social and corporate responsibility.
VMware Tanzu's suite of 8 products faced inconsistencies in design and accessibility. With a WCAG 2.1 compliance score of just 60%, we were falling short of providing an inclusive user experience. This led to user frustration, increased development time spent on fixing accessibility issues, and potential legal risks.
I led the accessibility improvement effort, collaborating closely with our development teams, accessibility experts, and product stakeholders across all 8 products. My role focused on identifying accessibility issues, prioritizing fixes, and ensuring remediation efforts met WCAG 2.1 success criteria. To accomplish several roadblocks needed to be overcome:
- Feature velocity made prioritizing resources and giving accessibility adequate attention difficult.
- Lack of knowledge around WCAG success critia made it difficult to emphasise the importance of accessibility.
- Complex refactoring. Some issues required complex code refactoring; something we had little opportunity for.
Our accessibility goals:
- Minimum Accessibility ThresholdBring all products in the Tanzu portfolio to score 70%, and no critical issues.
- EducationProvide functional teams with targetted insights and education on accessibility, including brown bags, presentations, and mentorship.
- ProcessEmbed accessibility as a natural aspect of our feature process.
Solution Planning & Execution
Measuring Success
We introduced a series of best practices to test and flag issues against, known as Tanzu Accessibility Success Criteria (TASC /tăsk/). Based from existing VMware-wide criteria, TASCs were framed in the context of the Tanzu product space, giving stakeholders better context to each objective.
TASC audits informed a compliance score. Broken down per severity level or presented as a single summation, the compliance score offers stakeholders a tangible metric to gauge success.
Engraining accessible principles:
- EducationThrough brown bags, tutorial videos, and real product examples, we aimed to educate stakeholders to act independently.
- Office Hours & ReviewsI maintained regular office hours and brought a focus on accessibility to design reviews.
- ToolingAdding tooling and references into the design and development process brought accessible thinking to the forefront.
Show, don't tell.
Knowledge should be readily available for designers to be proactive in designing accessibility into the system. The reference sheet helps keep critical considerations in mind early and often in the design process.
We aimed to avoid the idea a "checklist"; something that typically comes into play after design is complete. Short, concise examples, not open to interpretation, help to motivate designers to achieve parity in quality.
- Color is the first thing we get wrong, and often the easiest to fix.
- Responsive design focused on magnification for our product, informing how they need to react when zoomed.
- Alteranative text on images, and ensuring decorative images are annotated.
- Keyboard accessibility keeps keyboard-only use cases in mind.
- Links & Buttons helps ensure that designers and developers use the right component for the right job.
- Headings & Page Titles broke down the logical structure of our product with headings.
- Forms are a big part of our product, so is getting them right and keeping them consistent.
- Multimedia , such as animation, is a popular way to add pizzazz to designs and important to keep accessible.
- Notifications are very important in enterprise products and for accessibility.
Accessibility annotations.
Annotations were added to all components in Tanzu's design system guidelines, informing both designers and developers how each building block worked and how they can work together. Accessibility was built into each design system component when possible.
- Keyboard interactions informed how users interact with a component or pattern when not using a mouse.
- Tab order helped developers structure their code to behave properly.
- Anotomy breakdowns provided details on proper semantic HTML.
Design wireframes were rarely annotated up to this point. Not only did the design guideline annotations provide their intended information, they also helped serve as informed examples to designers provide their own annotations within wireframes.
Design review expectations were updated to include accessibility annotations.
Results & Impact
Significant results:
- ComplianceTanzu's compliance score increased from 60% to 87%!
- Time savingsTime spent iterating and fixing accessibility issues post-release decreased!
- AwarenessIncreased awareness and skills around accessibile design proactices across our teams.