Custom vs native fonts in apps

Gili Sharrock
May 23, 2018 · 8 min read

A while back Trade Me had a custom brand font created by Klim Type Foundry, named Story Sans. Off the back of this, the question arose, what about the native apps? Do we use our new custom brand typeface or do we use each platform’s respective font, San Fransico for iOS and Roboto for Android?

The contenders

To inform our decision we carried out a load of research to determine the benefits and challenges of going custom or going native. Finding this information however, proved to require a lot of digging around. So, in the light that it might help some of you out there, here is a break down of our findings.

Android system font (Roboto)

Benefits:

  • Faster loading times
    Using a system font means that the font does not need to load before rendering text.
  • Automatic line heights
    As stated in the material guidelines, to achieve proper readability and appropriate pacing, line heights have been determined based on each style’s individual size and weight. Line wrapping only applies to Body, Subhead, Headline, and the smaller display styles. All other styles should exist as single lines.

Challenges

  • Brand presence and feel
    Ensuring that there are other means of strengthening the visual brand identity.

Android Custom font

Benefits

  • Brand presence
    Using a custom typeface strengthens visual brand identity.

Challenges

  • No support for alternate languages
    Unlike Roboto, most custom fonts won’t support alternate languages within the app. This may not be an issue initially, but means that the app will not be future proofed against enabling users to swap languages.

iOS system font (San Fransisco)

Benefits

  • Dynamic type & features that save dev work
    As explained by Apple, San Francisco has a lot of features that make it highly legible. The font family named “SF” is used for iOS/Mac and “SF Compact” is used for Apple Watch. You can see the difference in round shaped letters like ‘o’, ‘e’. SF compact has rather flat vertical lines than that of SF.
Source WWDC video Introducing the New System Fonts
  • Future proofing
    Using native fonts will future proof the apps in terms of changes and features that Apple add in the future.

Challenges

  • Brand presence
    Ensuring other means of strengthening the visual brand identity.

iOS custom font

Benefits

  • Brand identity
    Using a custom typeface strengthens the visual brand identity.

Challenges

  • No dynamic type unless we dedicate dev time
    Dynamic type is not supported by custom fonts. This means that if a user has a larger/smaller font size setting on their device, this will not be honoured within an app with a custom font. Users that use this feature are usually of an older demographic and utilize this tool for accessibility purposes. This will also create a jarring experience as all other apps on the device will appear in a larger font. It is possible to apply dynamics to custom fonts but this would require a lot of developer, design and test resource.

Final thoughts and considerations

These conclusions are based on Trade Me’s use case.

  • Considering value vs effort
    From this investigation it seems, that although possible, the effort that will need to be put into development is significant. We already have a massive code base so a lot of backtracking will need to be done if we were implement a custom font.

Going forward

As a result of this research it was concluded that for Trade Me, using a custom font didn’t make sense in the native app context. Spending time and resource solving problems around language and experience seemed more logical than having a consistent typeface across all of our platforms. It became obvious that in order to implement a custom font there would have to be compromises in terms of typographic detailing and most notably accessibility, a value that personally I hold very closely.

Currently our apps both use their respective native fonts. In the future we will potentially look to implement Story Sans on pages that have high brand presence such as zero states and on boarding.

Good reads & resources


@GiliSharrock on twitter if you’d like to get in touch

Default to Open

Life lives here. Stories about how we're building Trade Me.

Thanks to Mark Huser, Mostafa Gazar, and Sean van Oossanen

Gili Sharrock

Written by

Mobile designer

Default to Open

Life lives here. Stories about how we're building Trade Me.

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade