What are we doing?
We would like to audit Dynamic Type, Large Content Viewer and VoiceOver across the iOS app. We would like to create documentation that will be utilized across the components to ensure that accessibility features are incorporated into all of the components work.
Dynamic type audit
- A Dynamic type/truncation audit was completed by design.
- The type size was switched to one of the largest ‘large accessibility font sizes’ possible on the phone and the app was reviewed screen by screen.
- Screens with issues (uncharacteristic treatment of words, sentences, icons, spacing etc.) were documented, similar cases were found in the HIG/other iOS apps and design solutions were proposed.
Info.
To design solutions for problematic screens referenced the following recommendations/guidelines:
Text
- Keep text truncation to a minimum.
- Avoid truncating text in scrollable regions unless people can open a separate view to read the rest of the content.
- Display as much useful text in the largest accessibility font size as you do in the largest standard font size.
- Prevent text truncation in a label by configuring it to use as many lines as needed to display a useful amount of text
- Add a hyphen to words that spill over to the next line.
Layout
- Adjust layout at large font sizes
- When font size increases, inline items and container boundaries can crowd text
- With large font size an inline layout might cause text to truncate so consider using a stacked layout where the text appears above the secondary items.
- With multiple columns of text consider reducing the number of columns when font size increases
Glyphs
- Increase the size of only the meaningful glyphs as font size increases.
Large content viewer
- A Large Content Viewer audit was completed by design.
- To test this, first, the font size was increased to a large size. Then all visual elements such as the tab bar elements & icon only buttons can be displayed at a large size when you tap and hold the element on the screen.
- This was tested across the app.
- Screens with issues (uncharacteristic treatment of these elements) were documented, similar cases were found in the HIG/other iOS apps and design solutions were proposed.
Info.
To design solutions for problematic screens referenced the following recommendations/guidelines:
- Only use large content viewer when dynamic type is not possible.
- When using larger text sizes you can long press on the icons to see larger versions of the button - and when you let go of the button, it is as if you pressed on the button.
Important to have this available for standard UIKit bars:
- navigation bars
- tab bars
- toolbars
- status bars
For custom:
- navigation bars
- tab bars
- toolbars
VoiceOver
- Needs to be done
Info.
- Needs to be done
Figma file
- Chosen typography types are documented in this Figma file and below.