Live Activity: Taking it Offline

Let’s talk about design.

Now that we’ve outlined the challenges and possibilities of Live Activities, it’s time to design one. For our example, we’ll create a Live Activity to support a hypothetical sauna reservation app. This use case is good way to showcase what’s possible — and what isn’t — with an offline Live Activity.

The Vision

Here’s what our Live Activity will include:

1. A Progress Bar tracks the session duration and gives a sense of progress.

2. A Countdown Timer shows the remaining time until the session ends.

3. A Remote Image with an Overlay to provide dynamic visual element and add polish.

4. A Link Button lets users quickly return to the app for further actions.

Additionally, we’ll explore subtleties like support for light and dark modes, translucent backgrounds, and how to ensure the design looks great on the Lock Screen.

Designing for User Value

A Live Activity should provide immediate, actionable value. For our sauna reservation app, the Live Activity will:

• Display the reserved room number.

• Show the time remaining in the session.

• Provide a glanceable, live update of the session’s progress.

Without value, users might dismiss the Live Activity by tapping “Do not allow” when it first appears. Keeping the design user-focused ensures the activity stays relevant.

The Role of Offline Features

Even without remote notification support, this Live Activity can remain useful:

• It relies on information configured during the activity’s creation.

• It provides live updates (e.g. time remaining) based on pre-loaded data.

By leveraging offline capabilities, we can still create a dynamic and engaging experience.

Up Next

In the next post, we’ll dive into the technical setup. From configuring the Live Activity extension in Xcode to sharing data between the app and the extension, we’ll lay the foundation for the implementation.

All the source code for this series is on Github!