52W: W3 - Breath Timer

January 25, 2023

I decided to centralize my posts on my own website according to POSSE principles.
The original post is on Substack here: https://52weeks.substack.com/p/week-3-breath-timer-apple-watch-app

This week I created my first Apple Watch App - a simple Breath Timer inspired by P. Here’s the link to it in the App Store.

Tools I used:

  • Xcode - a development environment

  • SwiftUI - a programming language

  • Apple Watch 8 - to test the haptic feedback

  • Many web and YouTube tutorials

  • ChatGPT to generate boilerplate code

  • Apple Developer Account - to upload my App to the App Store

Context

My partner has learned about several breathing patterns that help with relaxation and concentration. These patterns typically involve varying lengths of an in breath, out breath, and hold times in between. She wanted to have an Apple Watch app that prompts her with sound and vibration while she closes her eyes and breathes (as opposed to a visual-only representation of the breaths).

Process

I’d never used XCode or SwiftUI before, so I started by watching a quick XCode beginner walkthrough video on 2x speed. I also glanced through the official Apple Watch developer guide and tutorial.

As a shortcut - I asked ChatGPT to write me a basic watch app with the following prompt:

write me a Breath timer watchOS app in swiftui. 
at the top of the app is a four part timer in the format X:Y:Z:B 
X = in breath 
Y = in hold breath 
Z = out breath 
B = out hold breath 

below the timer are four buttons that increment each respective timer by 1 second below the buttons is a button that starts the timer countdown which happens in order of X, Y, Z, B. when all timers are at 0, they all reset to their original values and continue counting down again 

while the timer is active, the start button changes to a stop button 

when each timer hits 0, a haptic feedback event is fired

I got some boilerplate that I copied into XCode and, with a few minor tidy-ups and revisions, I had a functioning app in the preview!

I had fun playing around with layout and click functionality. Figuring out how to get haptic feedback on the watch wasn’t well documented, but I managed to get a default notification sound and vibration by adding this line when a timer hit zero:

WKInterfaceDevice.current().play(.success)

It was a bit of a headache testing on the actual watch, but several updates and restarts later, it worked. It was a great feeling to have something I coded show up on a device! Here’s what it looked like:

I tested on the Apple Watch 8 (41mm).

Next hurdle was to create an Apple Developer account ($99 for 1 year), upload the app and get it approved. There were a lot of hoops to jump through but with the help of several guides - I got it done. The app was approved in ~12 hours.

My first app on the app store! An exciting moment.

Learnings

  • Going from 0-1 on a simple app is super quick! With the help of ChatGPT and a few tutorials, getting a working prototype is dead easy

  • Creating something that gets used on a device like a watch or phone is very motivating

Next Steps

  • Play around with App Store Analytics

  • Add in Background Sesssions so the app continues to vibrate while the watch display sleeps

  • Add a second screen with some sort of animation

  • Improve the UI, add some glow effects to buttons