Smartwatch App Dev

Modern WearOS & WatchOS Tech Stack

Siamak (Ash) Ashrafi
12 min readFeb 9, 2024

Rise of the Wrist Revolution

Smartwatches are becoming more than just gadgets, transforming into essential lifestyle companions. Global shipments are predicted to surge, and these devices are revolutionizing communication, health management, and fitness. Imagine a future where your smartwatch acts as your personal health guardian, offering real-time insights and even predicting potential health issues. Join the smartwatch revolution and experience how technology seamlessly integrates into your life, changing the way you connect, stay healthy, and interact with the world. Don’t miss out on the incredible potential and possibilities that lie ahead!

The watch is going to replace the phone as our main device !?!

WearOS Apps

Wear OS development unlocks the potential to captivate smartwatch users. Kotlin and Android Studio provide the tools to build beautiful and intuitive UIs with Jetpack Compose. Effectively manage data with Room or Wear DataLayer, and even design watch faces that turn heads. Engage users with interactive notifications, customizable tiles, and relevant complications. While the circular screen and resource constraints require some finesse, the booming Wear OS market and powerful tools make it a worthwhile challenge. So, embrace it and develop innovative apps that empower health, fitness, and everyday utility!

Key Features

  • Jetpack Compose: Modern UI framework for building beautiful and performant UIs on Wear OS.
  • Room/Wear DataLayer: Options for local storage (Room) or data synchronization with phone (Wear DataLayer).
  • Watch Face Studio: Create custom watch faces using pre-built components or custom code.
  • Notifications: Display interactive notifications with actions directly on the watch.
  • Tiles: Customizable data snippets accessible with a swipe for quick information access.
  • Health & Fitness APIs: Access data like heart rate, steps, and activity levels.
  • Complications: Show relevant information from your app within watch faces.
  • Wearable Extensions: Access sensors, ambient mode, and charging state for specific functionalities.

Benefits

  • Large and growing market of Wear OS smartwatches.
  • Simple development tools and framework.
  • Rich opportunities for health, fitness, and utility apps.

— — — —

Modern Wear OS development

Utilizing how we build Modern Android Apps …

Shared Tech Stack (Android & Wear OS)

Android & Wear OS: Gradle modularized · MVVM · Jetpack Compose (Material 3 & Symbols) · Kotlin Coroutines & Kotlin Flow · Hilt · Room · TOML Version Catalog · JUnit5 · Turbine & MockK · GitHub Actions · Renovate · KtLint & Detekt · API keys stored in app’s BuildConfig.

The WearOS App is just another screen in our feature directory!*

WearOS is just another screen in our feature directory!

*There is nothing special here.

Nothing new to learn but how Compose for Wear OS is different from Compose for mobile & Wear OS Components (see below).

So the Wear OS App is super simple if you understand how to build a multi-module Android App. It’s just another feature / screen :-)

Google source example of Wear OS app as just a feature:

___

Wear OS UI Components

We have other components besides Jetpack Compose to build the Watch App.

Unfortunately we need a table to help us know what component to use when (Use Case column) and what are deprecated (Modern Approach column).

An app is a focused view that handles tasks that are too complex for a complication, tile, or notification. Use surfaces such as tiles, complications, and notifications to accomplish simple tasks, but link these surfaces into an app to carry out more complex tasks.

Use the correct surface for the correct function

Wear OS supports two distinctive ways of building an app.

*Tiles can not be built with Compose but we do have Horologist Tiles and Compose Previews

Only use the new Jetpack Compose based UI.

____

Support Wear OS Libraries

Horologist is a group of libraries that aim to supplement Wear OS developers with features that are commonly required by developers but not yet available.

It is essential for Wear OS development.

Media Toolkit

Provides utilities for working with media on Wear OS, including:

  • Playing and recording audio
  • Managing notifications with audio content
  • Accessing and manipulating images

Composables

Offers custom Jetpack Compose components specifically designed for Wear OS:

  • CircularSeekBar for circular input like volume control
  • RadialMenuItem for radial menus
  • WearableProgressIndicator for different progress visualization styles

Compose Layout

Extends Jetpack Compose layout concepts for better adaptation to Wear OS:

  • RadialLayout for arranging elements around a circular screen
  • GridArrangement for flexible grid-based layouts
  • WearableSpacer for specific spacing adjustments on wearables

Compose Material

Adds extended Material Design components for Wear OS:

  • EdgeToEdgeButton for buttons filling the entire edge of the screen
  • ComplicationPlaceholder for displaying placeholders in watch complications
  • CircularIconButton for circular icon buttons

Wearable Launcher

Simplifies creating custom launchers for Wear OS apps:

  • Handles initial app launch and user interaction
  • Offers customization options for the launcher experience

Tiles API

Provides utilities for interacting with Wear OS tiles:

  • Creating and updating tiles
  • Handling user interactions with tiles

Wearable Extensions

Offers utilities for various Wear OS features:

  • Working with sensor data (e.g., heart rate, steps)
  • Accessing ambient mode options
  • Displaying custom content during charging

ComplicationProvider

Helps create watch complications (data snippets displayed on watch faces):

  • Defines data and interactions for complications
  • Supports different complication types (e.g., monetary, timeline)

___

Reference:

Build logic explained here:

Build Directory

___

Google Play Store

Some experimental Wear OS app built by YlabZ on the Google Play Store:

Watch Face

Testing the API surface of Kotlin DSL Watch Face API.

Meditation App

Proof of concept using MAD Jetpack Compose for WearOS with Hilt DI, ViewModel (Hilt), Navigation, Room, Repo etc …

Building the Wear OS app is just another screen in your multi-module Android application. It is so simple every Android app should have a Wear OS app also.

Now lets talk about Apple iOS …

WatchOS Apps

WatchOS is Apple’s operating system for the Apple Watch, focused on fitness, health, and communication. Development uses Swift programming language and Xcode IDE. Key concepts include WatchKit framework, SwiftUI, and watch complications.

Shared Tech Stack (iOS & watchOS)

iOS & watchOS: Swift · SwiftUI · SF Symbols · SwiftData · Swift Structured Concurrency · Swift Package Manager · XCTest

Building compelling watchOS apps requires a powerful and efficient toolset. This combination of technologies offers a robust foundation:

  • SwiftUI: Enables intuitive and visually appealing UI design, leveraging SF Symbols for consistent and platform-specific icons.
  • SwiftData: Simplifies local data storage and access, offering offline capabilities for your watch app.
  • Swift Structured Concurrency: Handles asynchronous operations seamlessly with async/await, improving code readability and performance.
  • Swift Package Manager: Makes dependency management streamlined, keeping your project organized and up-to-date.
  • XCTest: Provides comprehensive testing tools to ensure your watch app functions flawlessly.

By combining these technologies, you can create user-friendly watchOS apps that deliver rich experiences while taking advantage of modern development practices. This tech stack empowers you to focus on innovation and creativity, shaping the future of smartwatch interactions.

NOTE: We do NOT use MVVM with SwiftData

SwiftData already abstracts data logic through its model management and querying capabilities. Implementing a separate MVVM structure will lead to overlap in data handling, inevitably causing problems.

Key Features

  • SwiftUI: Modern UI framework for declarative and efficient UI development. — Invented by the watchOS Team!
  • Watch Complications: Small data snippets displayed on watch faces, providing quick access to essential information.
  • HealthKit Integration: Access health data like heart rate, steps, and activity levels.
  • Communication Features: Send and receive messages, answer calls, and use Walkie-Talkie.
  • Notifications: Display custom notifications with rich content and actions.
  • Background Tasks: Perform tasks in the background while the watch is not in use. You can use SwiftUI’s backgroundTask(_:action:) with Swift Structured Concurrency (SSC) for background tasks.
  • Watch Connectivity: Communicate with paired iPhone for data exchange and processing.

Note: WatchKit Framework uses storyboards and Interface Builder. Apple advices agains using it.

Building your app with SwiftUI gives you more control over the user interface than designing it in a storyboard. When creating a new watchOS app, strongly consider using SwiftUI. For more information, see Building a watchOS app.

Benefits

  • Growing user base for health and fitness tracking.
  • Strong integration with Apple ecosystem and iOS devices.
  • Rich opportunities for innovative and impactful apps.

Charting Your WatchOS App Journey

Embarking on WatchOS development? Apple’s planning guide equips you with essential strategies to craft engaging experiences for the wrist. Leverage your existing iOS knowledge and the intuitive Xcode environment to bring your vision to life. Remember, the watch demands a unique approach: prioritize glanceable information, design mindful notifications, and create informative complications. Utilize background tasks judiciously for optimal battery life, and test across diverse devices to ensure a seamless experience. Don’t forget the power of user feedback to refine your app. As you delve deeper, explore frameworks like HealthKit, Core Motion, and Watch Connectivity for advanced functionalities. Remember, accessibility and performance optimization are key!

By following these guidelines and seeking out the provided resources, you’ll be well on your way to creating a successful WatchOS app that delights users and thrives on the unique strengths of the platform.

Apple provides an excellent tutorial!

This tutorial gives you a chance to apply much of what you’ve already learned about SwiftUI, and — with little effort — migrate the Landmarks app to watchOS.

Swift Structured Concurrency (SSC)

With the release of WatchOS 9 (7 was restricted) in September 2022, the platform now embraces the full power and convenience of Swift Structured Concurrency. You can leverage the familiar async/await syntax and task management features to write elegant and maintainable asynchronous code in your WatchOS apps. This marks a significant advancement, enabling more efficient handling of user interactions, network requests, and background tasks while potentially improving performance and code readability. So, dive into the world of structured concurrency and craft beautiful, efficient WatchOS experiences!

SwiftUI background task with SSC

Imagine your WatchOS app needs to download the latest weather data. While running in the foreground is ideal, it’s not always possible or efficient. This is where the power of combining SwiftUI’s background tasks and Swift Structured Concurrency shines.

First, a system event like the user tapping a “Refresh Weather” button triggers a SwiftUI background task. Within this task’s limited time window, Swift Structured Concurrency takes over. An async function kicks off a network request using URLSession, seamlessly fetching the weather data without impacting the app's responsiveness. If needed, background sessions managed by SSC ensure the download continues even after the initial 30-second window. Finally, the retrieved data is processed and used to update the watch face complication, all thanks to the seamless collaboration of these two powerful tools.

This approach offers the best of both worlds: the simplicity of initiating tasks with SwiftUI and the flexibility and control of SSC for complex, asynchronous background operations, keeping your WatchOS app user-friendly and resource-efficient.

Flow of messages between system and app
  1. Use backgroundTask to initiate the task based on events or interactions.
  2. Within the backgroundTask closure, utilize SSC for asynchronous operations:
  • Download data using async URLSession.
  • Process audio or perform calculations using async functions.
  • Integrate with background sessions managed by SSC for sustained execution.

SwiftData

SwiftData works on both iOS and watchOS. You can define your data model using regular Swift types with the @Model attribute. This code can be shared across both iOS and watchOS, promoting code reuse and consistency.

SwiftData integrates with CloudKit for optional data synchronization between platforms. This feature requires additional setup and can impact watchOS battery life, so careful consideration is necessary.

Combining Core Data’s proven persistence technology and Swift’s modern concurrency features, SwiftData enables you to add persistence to your app quickly, with minimal code and no external dependencies. — Apple

Our thoughts about SwiftData … The New Way Forward.

SwiftData offers several features that contribute to a reactive programming paradigm in your iOS and WatchOS applications:

Automatic Change Detection: When you modify a managed object with SwiftData, it automatically detects the changes and triggers updates throughout your app. This eliminates the need for manual observation and simplifies handling data changes.

Observation API: SwiftData uses the new Observation API from SwiftUI. Observation is a Swift feature that tracks changes to properties. This enables you to automatically update your UI elements whenever the underlying data changes in SwiftData, creating a reactive and dynamic user interface.

CloudKit Synchronization (Optional): If you configure CloudKit integration, SwiftData automatically synchronizes data changes across connected devices. This feature helps maintain data consistency and reactive updates across iOS and WatchOS apps.

https://www.hackingwithswift.com/quick-start/swiftdata/how-to-sync-swiftdata-with-icloud

— — — —

Interesting References

iOS / watchOS libraries

Using metal with SwiftUI

watchOS(hip)

Everything works together to keeping the wacthOShip sailing smoothly.

SwiftData keeps the ship stocked: Think of SwiftData as the ship’s pantry, storing all the essential data your app needs to function, even when offline. It provides an efficient and flexible way to manage local data on the watch itself.

SwiftUI paints the ship’s exterior: Like an artist decorating the ship, SwiftUI is responsible for crafting the beautiful and intuitive user interface your users interact with. With its declarative syntax and pre-built components, SwiftUI makes creating visually appealing and responsive watch faces and app interfaces a breeze. SF Symbols serve as the paintbrushes, offering a consistent and platform-specific icon set to enhance your design.

Swift Structured Concurrency steers the ship through choppy waters: As the ship encounters complex tasks or network requests, Swift Structured Concurrency steps in as the skilled navigator. It empowers you to write asynchronous code using async/await, ensuring smooth and efficient handling of background operations without compromising performance or user experience.

Swift Package Manager keeps the ship’s supplies organized: Imagine a well-stocked storeroom — that’s the role of the Swift Package Manager. It simplifies managing external libraries and dependencies your app relies on, keeping your project tidy and ensuring you always have the latest updates.

XCTest ensures the ship sails smoothly: Just like regular ship inspections, XCTest acts as your quality assurance officer. It provides a comprehensive set of testing tools to identify and fix any bugs or issues before your app sets sail onto the App Store.

In essence, each element in this tech stack plays a distinct yet interconnected role in building exceptional watchOS experiences. SwiftData manages the data, SwiftUI designs the interface, Swift Structured Concurrency handles complex tasks, Swift Package Manager keeps dependencies organized, and XCTest ensures quality. By working together harmoniously, they empower you to create innovative and user-friendly watchOS apps that stand out from the crowd.

Looking forward to building magic with Wear OS & watchOS! ⌚️

~Ash

--

--