Skip to content

iOS 13, Apple’s latest version of its ubiquitous mobile operating system, was published at the company’s Worldwide Developers Conference on June 3, 2019. It is scheduled to be released in the fall of 2019.

Like any previous iOS versions, iOS 13 is also bringing significant changes that require all iOS app developers to change their apps to be compliant with Apple’s application development guidelines, as adhering to these guidelines is a prerequisite for your application to be accepted and successfully uploaded to the Apple App Store.

This will ensure that the user experience of your application is in line with that of other iOS features and Apple’s first-party applications. And it will most likely increase the usage and popularity of your application by removing unnecessary cognitive friction of your application using different user interface conventions, visual styles and navigation structures from the rest of iOS applications.

iOS 13 Dark Mode

iOS Dark Mode

The most significant change from the iOS user experience point of view is the introduction of Dark Mode to all iOS first-party applications. Apple describes the Dark Mode this way:

“In iOS 13.0 and later, people can choose to adopt a dark system-wide appearance called Dark Mode. In Dark Mode, the system uses a darker color palette for all screens, views, menus, and controls, and it uses more vibrancy to make foreground content stand out against the darker backgrounds. Dark Mode supports all accessibility features. People can choose Dark Mode as their default interface style, and they can use Settings to make their devices automatically switch to Dark Mode when ambient light is low.”

As such, Apple instructs application developers to focus on the following areas when implementing Dark Mode to their applications:

Image, Icon and Symbol Colors

  • The system uses SF Symbols, which automatically look great in Dark Mode, and full-color images that are optimized for both light and dark appearances so use them whenever possible. Symbols look great in both appearance modes when you use dynamic colors to tint them or when you add vibrancy.
  • Make sure full-color images and icons look good. Use the same asset if it looks good in both light and dark modes. If an asset looks good in only one mode, modify the asset or create separate light and dark assets. Use asset catalogs to combine your assets into a single, named image.

Text Colors

  • Use the system-provided label colors for labels. The primary, secondary, tertiary, and quaternary label colors adapt automatically to light and dark appearances.
  • Use system views to draw text fields and text views. System views and controls make your app’s text look good on all backgrounds, adjusting automatically for the presence or absence of vibrancy. Don’t draw text yourself when you could use a system-provided view to display that text instead. For developer guidance, see UITextField and UITextView.

Why It Is Important

Because all first-party iOS apps and an increasing number of third-party applications are supporting Dark Mode, your iOS application will stick out like a sore thumb when the user activates Dark Mode and you haven’t done the work to implement the new user experience and thoroughly test out the visual correctness of Dark Mode in your iOS application.

Testing Your iOS Dark Mode

Apple has provided the instructions for testing iOS Dark Mode as follows:

Test your design in both light and dark appearances. See how your interface looks in both appearances, and adjust your designs as needed to accommodate each one. Designs that work well in one appearance might not work in the other.”

It is also important to test your dark and light appearances on different iOS resolutions and screen densities to evaluate the readability and visual correctness on all iOS form factors.

Jouko Kaasila

Bitbar COO & Co-founder