How To Make An Apple Watch App

Some hurdles I ran into when creating an Apple Watch target for my Pokemon Go companion app

During the recent keynote, Apple announced the Apple Watch Series 2. It has some tempting new hardware features:

Water resistance for swimming (it was splash-proof before)
Built-in GPS
Faster processor

Even without the new hardware, existing Apple Watch owners still benefit from the new software update. watchOS 3 comes with some much needed features:

SpriteKit: developers can now make games on the Apple Watch
Dock: you can pick a few apps to load faster on launch

Also during the Apple keynote, Niantic gave a teaser for the official Pokemon Go Apple Watch app. Their watch app lets you:

Spin Pokestops to collect items without pulling out your phone
See what type of Pokemon are nearby
Check the remaining distance you need to walk in order to hatch eggs

This alone might not be reason enough to buy an Apple Watch, but it's definitely something existing watch owners can look forward to downloading. And with all the renewed excitement about the Apple Watch, now is a great time to make a watch app.

Making an Apple Watch took much less time than I imagined. User interactions are brief, so your app structure is going to have just a few screens. And the screen real estate is tiny, so you have fewer UI elements to manage. But with this simplicity comes a new set of challenges.

1. Thinking of a good use case

The hardest part of making a watch app is coming up with a good use case.

The watch experience is different from mobile, just like how mobile is different from desktop. So you need to be a little creative in finding an application that's suited to the watch experience. The issues you'll face include:

The screen is tiny
Sessions are measured in seconds
User input is difficult, at best

An example of a great use case for the Apple Watch is Apple's built-in camera app. It acts as a remote control for your iPhone's camera, and shows you a live preview. This means you can prop up your iPhone on a table and take a group selfie with your Watch.

Apple watch app - camera

I've been maintaining a Pokemon Go companion app called GoTypeChart. It's an excuse for me to play with new iOS APIs, and to get some practice growing a user base. Recently, I added an Apple Watch target called Triangulate to help trainers hunt rare Pokemon.

In Pokemon Go, you have a Sightings menu that tells you whether or not a certain Pokemon is within range. If Pikachu is within 200 meters, it shows up in the menu. Otherwise, it doesn't. Hunting down Pokemon can be frustrating because using the Sightings menu is almost like wandering through a football field to find a dropped set of keys.

In my GoTypeChart watch app, you can draw a 200 meter circle whenever the Pokemon is within range. As you walk around and draw more of these circles, you are effectively narrowing down the Pokemon's possible location. This means you can actually track down that Pikachu without wandering aimlessly for half an hour.

Apple watch app - GoTypeChart

This is a real screenshot of when I caught a Snorlax, and what the circles represent:

White circles: Map markers I dropped each time I saw a Snorlax on my Sightings menu
Blue circles: Represents an area with a 200 meter radius. The Pokemon is located within the area where all the circles overlap.
Red circle: Current location

2. Handling the permission dialogue

The app needs permission before it can access the user's location. This permission dialog shows up on the iPhone, where the user can decide whether to allow or deny.

This creates a problem though — the permission dialog never shows up on the Apple Watch. This leaves you as the developer with the responsibility of explaining how to grant permissions on the iPhone.

Apple watch app-warning-instructions

The approach I took was to simply add a label with instructions directly beneath the map view. If the app has location permissions, I show the map. If not, I hide the map and show the label.

3. Working around missing delegates

iOS frameworks make good use of delegates. Delegates are like answers to predetermined questions, like: "What should this map circle look like?" "Use a black border, and fill it with a semi-transparent blue."

Unfortunately, watchOS doesn't support all the delegates that are available in iOS. So you have find another way to do things.

In my app, I ended up creating a hard-coded map marker image with a blue semi-transparent background. Then I had to programmatically manage the addition and removal of these map markers. It's not pretty, but it gets the job done.

4. Testing on the simulator

At the time of this writing, a blank map shows up when you deploy an Apple Watch app to the Simulator. Others have reported this on Stack Overflow, but there doesn't seem to be a solution yet.

As a workaround, I had to deploy to the app to a hardware device each time I wanted to test the map.

Conclusion

Apple Watch apps are simple and focused, so there really isn't that much to build. You'd be surprised how quickly you can add a Watch target to your mobile app.

I think the most challenging part is coming up with a good use case for the watch form factor. That, and you have to get used to a slightly modified version of the API.

Here are a few resources I thought were very helpful when building my Apple Watch app:

watchOS MapKit tutorial by Kristina Thai
watchOS 2 by Tutorials by Ray Wenderlich

Got any tips for building apps on watchOS? Have any suggestions for future topics? Feel free to add your thoughts to the comments.

Like this post? Please share it using the share buttons to the left. Then join our mailing list below and follow us on Twitter – @thorntech – for future updates.