Notifications

iOS 10's rethinking of apps as granular interactions doesn't stop at widgets. With a new framework that can turn incoming notifications into rich, actionable interfaces, Apple wants users to spend less time jumping between apps.

Notifications iOS 9 and 10.

Notifications iOS 9 and 10.

Notifications in iOS 10 share the same design principles of widgets. Rather than being grouped in a list of items on top of a dark background, notifications are discrete light cells that can be pressed (with 3D Touch), pulled down (for incoming banners), or swiped and expanded into a floating card preview.

Expanding a Messages notification.

Untitled Replay

The anatomy of an expanded notification – whether an app has been updated for iOS 10 or not – has fixed elements that developers can't control. There's a header bar at the top with the icon and name of the app, and a close button on the right to dismiss the notification. Tapping the icon on the left side will open the app that sent the notification.

The standard look of a notification in iOS 10.

The standard look of a notification in iOS 10.

This is true for both iPhones with 3D Touch and devices without it; to expand a notification on an iPad or an older iPhone (or if you don't want to use 3D Touch), you can pull down an incoming notification banner or swipe a notification to the left in Notification Center and tap 'View'.5

New APIs allow developers to take different actions for notifications that have been sent to the user – including ones that have been cleared. First, notifications can be dismissed with a Clear action by swiping on them. Apps can monitor the dismiss action and stop delivering the same notification on other devices.

Additionally, developers can remove, update, and promote notifications that have already been sent. Apple's goal was to prevent Notification Center from being cluttered with old notifications that aren't relevant anymore. If developers implement this API, updating a notification with fresh content should help users see what's changed. Imagine sports scores or live-streaming apps and how they could update notifications. I'm curious to see which services will convert to this behavior instead of spamming users with multiple alerts.

Underneath the header of an expanded notification is the content developers can control, and where the most important changes to notifications are happening.

In iOS 10, notifications can have a title and a subtitle. The title is displayed in a bold font, which helps identifying the subject of a notification. In a Reminders notification, the name of a reminder will be the bold title at the top, with its note displayed as text content below it.

The default look of a notification in iOS 10. Expansion is relative to a notification's placement on screen.

The default look of a notification in iOS 10. Expansion is relative to a notification's placement on screen.

Below the title and subtitle, iOS 10 shows a notification's body text content (same as iOS 9) and actionable buttons. In a welcome change from the past, developers can define more than two notification actions, displayed in a list under the notification's card.6 If an app requires a quick reply upon expanding a notification, the input field will sit above the keyboard – it's not attached to the notification like in iOS 9.

Quick replies in iOS 9 and iOS 10.

Quick replies in iOS 9 and iOS 10.

Design changes alone, though, wouldn't have sufficed to modernize notifications. To reinvent their feel and capabilities, Apple has created two new extension points for developers in iOS 10: Notification Service and Notification Content.

The Notification Service extension doesn't have an interface and runs in the background. Upon triggering a notification but just before delivering it to the user, an app can call the Notification Service extension to augment or replace its payload. This extension is meant to have a short execution time and it's not designed for long tasks. Possible use cases for Notification Service extensions could be downloading an image or media file from a URL before showing a notification, or decrypting an encrypted payload locally for messaging apps that rely on end-to-end encryption.

The Notification Service extension should come in handy given iOS 10's ability to include a media attachment (images, audio, videos, and even GIFs) in both the notification banner and the expanded notification. If they adopt it, apps like WhatsApp and Telegram could omit the "[Contact] sent you an image" standard notification and display a thumbnail in the notification banner (like iMessage does) and a full image preview in the expanded notification.

Notification Content extensions are what users are going to see the most in daily usage, and they motivate iOS 10's notification card design.

A notification in iOS 10 can show a custom view between the header and default text content. Custom views can be anything – an embedded map, a message conversation, media, a calendar view, etc. – and they're managed by the Notification Content extension. Custom views are non-interactive: they can't receive touch events7, but they can be updated in-place in response to a task performed from a notification action. Apps can hide the default content of a notification if the custom view is informative enough.

Service and Content extensions, combined with the expanded design, have turned notifications in iOS 10 into a completely new experience. Notifications are no longer just text: they are custom app UIs delivered to you with rich previews and interactions that can live on longer than a couple of seconds. Notifications in iOS 10 are mini apps in and of themselves.

When you receive an iMessage that contains a photo, the incoming notification can be expanded, either with 3D Touch or a swipe. You'll be treated to a full iMessage conversation UI, living inside the notification, with the same transcript, read receipts, and typing indicators you'd see in the Messages app.

To expand a notification, you can pull it down or press on it.

To expand a notification, you can pull it down or press on it.

Not only can you send a reply – you can keep the iMessage interface open as you keep a conversation going from the notification. It's a fantastic way to check into a conversation without the constraints of a quick reply.

Scroll up in the transcript to view older messages.

Scroll up in the transcript to view older messages.

When you're done, swipe down to dismiss the notification, and you'll be back to whatever you were doing.8

Calendar notifications follow the same concept. If an event with a location attached is coming up, the expanded notification will display the default text content at the bottom, but also a preview of the address with a Maps view at the top.

Thanks to actionable buttons, you can open directions in Maps without launching Calendar. If an upcoming event doesn't have a location, you'll see a preview of your agenda inside the notification.

I tested a version of Workflow optimized for iOS 10, which brings improved notification support with the ability to customize the content displayed in a notification card. In addition to a title, you'll be able to embed pictures, videos, GIFs, and even Maps views into a Workflow notification.

Rich notifications created with Workflow.

Rich notifications created with Workflow.

Pictures are displayed as thumbnails in a notification banner before expanding it; videos can be played inline within the card itself.

Untitled Replay

And if you often receive messages containing GIFs, iOS 10 will let you preview them directly from a notification.

Untitled Replay

CARROT Weather has a clever take on rich notifications in iOS 10. The daily digest and severe weather/precipitation alerts can be expanded into dynamic preview cards.

Through a Notification Content extension, the app can embed a custom interface, sounds, and even animations inside the notification card. As a result, viewing CARROT's notifications feels more like using the app rather than reading a plain text summary.


With a new framework and the flexibility granted by extensions, we're going to see a rise of interaction methods fueled primarily by notifications. Of all the places where an app can advertise its functionality on iOS (widgets, keyboards, extensions), a notification is the most direct, contextual way to reach users at an appropriate time.

A notification carries interest and, in many cases, a sense of urgency. iOS 10 transforms notifications from a passive delivery system into an active experience where users engage with an app through UIs, actions, and feedback they're already familiar with. It's a win-win for developers, who can make their apps more useful through richer notifications, and for users, who no longer have to open apps to benefit from their services.

iOS 10's notifications are a new layer on top of apps. They're going to change how we deal with them every day.


  1. On iPads, older iPhones, and if you have 3D Touch disabled in Settings, notification banners have a "handle" to suggest you can drag them downwards to expand them. ↩︎
  2. In iOS 10, an action can also invoke the system keyboard to type a response. ↩︎
  3. Except Messages notifications (where the conversation transcript can be scrolled) or the play button of videos embedded in notifications. ↩︎
  4. Some actions, such as replying with media or opening an iMessage app, require the notification to launch the Messages app. In the API, apps can specify which actions can be performed from a notification, and which ones need to be managed from the main app. ↩︎

This week's sponsor

Shapego

Beautiful Word Clouds for iPad and iPhone