Mobile Accessibility Toolkit for Designers (checklist + A4 poster + Figma annotation kit)

Save time documenting accessibility for native mobile applications, improve your design workflow and audit mockups efficiently.

Why You Need This Toolkit

Mobile accessibility is an important part of inclusive design: it ensures that all users, regardless of their abilities, can interact with your native applications. Designers can identify, and correct, accessibility issues for mobile in the early stages of the design process. But, WCAG 2.2 is a lot to process. To make this easier, I've built a checklist, that only focuses on the aspects of accessibility that designers can do something about. Use it to audit your mobile mockups, to avoid forgetting about essential aspects of accessibility.
Great documentation helps teams implement accessibility and interaction requirements the right way.  The Figma annotation kit simplifies the process of annotating and documenting mobile app design mockups.

To learn more about designer's key role, when it comes to accessibility, you can check my article "A Designer’s Guide to Documenting Accessibility & User Interactions".

Keep in mind, though, that WCAG is quite device-agnostic. So, this checklist is 90% the same as my web checklist. Still, if you need something mobile specific, you are in the right place.

What's Inside:

• A A4 poster version a "Mobile Minimum Baseline Checklist" (.pdf / .docx). A handy poster to print and keep in your office, serving as a quick reference to save time during design.
• A detailed "Checklist -  Mobile Accessibility for Designers" (.pdf / .docx): it covers different aspects of accessibility during the design phase, and helps ensure that no critical element is overlooked. This is based on WCAG 2.2 (which is device-agnostic), mostly AA criteria (and some AAA), native Google Material Design, Samsung and iOS guidelines.
• A Annotation Kit Figma file (.fig) includes examples and components specifically designed for mobile annotations and mobile specific symbols like iOS / Material UI target size, headings, and more.

Importing into Figma

Depending on your system, you can't just double click on the Figma files to import them. You need to go to your Figma, find the "import button". Check my small video if you need help with this.

License for the content:

• You can use this content for your daily work or at school.
• You can’t copy this content or reproduce it in any way. You are also not allowed to redistribute it on your own site, or any other site. If you use it to teach, you are also not allowed to redistribute it to your students.
• You are NOT allowed to resell this content, or derivative products that directly copy this content (for example, you can’t sell physical copies of the content)