Interacting with WatchKit Apps

Claus Höfele
5 min readFeb 6, 2015

--

The current WatchKit SDK provides three ways for wearers to interact with third-party apps on the Apple Watch:

  • WatchKit apps: launched from the watch’s home screen, it’s your app’s main user interface on the Apple Watch
  • Glances: an optional addition to a WatchKit app that displays timely information associated with your app
  • Notifications: a custom interface to local or remote notification content

If you consider WatchKit apps the counterpart of iPhone apps, you can think of glances as the equivalent of Today widgets and WatchKit notifications to mirror iPhone notifications. This is a gross simplification of the challenge to provide a watch experience, but can help to get an initial idea of where to start designing a WatchKit app.

In future, I expect Apple to also allow apps that work independently from an iPhone. But for now, WatchKit apps, glances and notifications fully depend on an iPhone connected wirelessly to the watch.

WatchKit Apps

A WatchKit app is the place where a developer can provide a fully featured user experience.

Technically, apps for the Apple Watch consist of a WatchKit app running on the watch and a WatchKit extension running on the phone. The app contains static resources to display a user interface, but the extension provides content that updates dynamically.

Because a WatchKit extension runs on the iPhone, it has access to the phone’s hardware resources such as network connectivity and GPS. WatchKit app and extension are always shipped in a bundle with a proper iPhone app (more of this in a future article).

For your app, you have to choose at design time whether to provide a page-based or a hierarchical interface.

A page-based navigation provides two or more screens and the wearer swipes left or right to display one of the screens at a time.

Page-based navigation

In a hierarchical navigation, the app starts with an initial screen and the wearer drills down to reveal more screens.

Hierarchical navigation

Because of its simplicity, page-based navigation works well for WatchKit apps. If your app provides more complex information, you might choose hierarchical navigation instead.

As mentioned before, the two navigation styles are mutually exclusive and can’t be changed at run-time. However, there are a few additional possibilities when needed:

  • Apps can show modal screens, which themselves can contain a single screen or multiple screens arranged in a page-based layout
  • Page-based layouts can change the number and order of screens on display
  • Apps can provide a context menu, which the wearer activates by force touching the watch’s screen

Even in its initial version, the WatchKit SDK provides a good number of UI elements to use for the actual screen layout. To get an idea what they look like, I recommend watching David Smith’s WatchKit UI Component Walkthrough on YouTube:

Glances

Glances are optional add-ons to WatchKit apps that show immediately relevant information. The wearer activates glances by swiping up from the watch face. Each app can have at most one glance and glances from different applications are laid out in pages.

The wearer can swipe through glances

A glance provides a non-scrollable full-screen experience and interaction is limited to activating the associated WatchKit app with a tap. A glance’s purpose is mostly to display timely information such as alarms or the current weather.

Because of their limited functionality, the key to creating great glance interfaces is in prioritizing what information to show on the screen. Apple helps you with this by providing templates that you can customize with additional UI components.

Notifications

Notifications on the Apple Watch are similar to their counterparts on the iPhone, but with a few twists that make them easier to use on a watch.

Initially, notifications are shown as Short Look interface with a simplified, read-only UI. Only when the wearer’s wrist remains raised or the Short Look interface has been tapped, the Long Look interface appears with additional information about the notification.

Short look notifications (left) and long look notifications (right)

Notifications are supported by the Apple Watch out-of-the-box. By default the Short Look includes the app’s icon and name in addition to the notification’s title. The Long Look also shows the notification’s text and can optionally show action buttons in addition to the Dismiss button that’s provided by the system. Action buttons are a powerful way of providing wearers a quick way to react on notifications.

If you like the provided default look, there’s nothing you need to do. However, by customizing Long Look notifications, you can provide additional UI elements that suit your app.

Custom Long Look notifications must provide a static interface and may optionally provide a dynamic interface. Static interfaces include only the notification’s content and any additional images and text that you configure at design time. In contrast to static interfaces, dynamic interfaces can also incorporate information that is generated on-the-fly by your WatchKit extension. For example, you can fetch additional, detailed information associated with the notification.

Static interfaces are less power consuming than dynamic interfaces thus even if you provide a dynamic notification, the Apple Watch might choose to display the static version instead. Since the wearer can disable notifications for specific apps, you should be careful to provide a great experience and take power consumption into consideration.

If you liked this article, you might be interested in my other articles in this series about Practical WatchKit Development:

  1. Prototyping WatchKit Apps
  2. Hardware Features of the Apple Watch
  3. Interacting with WatchKit Apps
  4. Essential Technologies for Developing WatchKit Apps

If you have any questions about this article, feel free to contact me on Twitter.

--

--