What are we doing?

We would like to audit & standardize typography across the iOS app. Where possible we would like to ensure that the typography size, line height, and tracking of system fonts that easily allow the type to scale for dynamic type. Finally, we will create guidelines for typography in the app.

Figma file

• Chosen typography types are documented in this Figma file and below.

Typography info.

• All SF fonts use the appropriate style name from HIG/Typography.
  • The one exception is that we use ‘Callout’ type style for the apps body (so the body text size is 16 rather than 17).

Typographic scale

Design checklist

• Standardize typography across the app
• Understand if there are elements that need different treatment for different languages
• Make sure LTR and RTL and multilingual logic is defined wherever needed

Engineering Notes / Order Of Operations

• Build out the list of text styles that we need in WKFont, based on the Figma.
• In UIFont+WMFDynamicType.swift, replace implementations of font-generation methods here with logic that outputs the correct WKFont.
  • If this goes well, we can keep most of the changes contained to this one file instead of reassigning fonts in every label throughout the app.
  • Timebox this to two days, then check in with the rest of the team on progress. We will evaluate if it's worth continuing with this approach.
• (Optional) If previous approach doesn't work, we'll need to go throughout the app and swap out the font assignments with a WKFont in each context (consider splitting this up by feature).
• For any font assignments in the Components framework, we should assign WKFont directly as this is the preferred approach to font assignments moving forward.
• For any fonts in the app that are NOT generated through the UIFont+WMFDynamicType.swift methods (i.e. for example, search “UIFont.systemFont”), change the font assignment in that context to use WKFont directly.