Developing LookUp for the Apple Watch was a unique experience. There was no device to test things on when WatchKit was first released and while the templates provided in the design resources were extremely useful, there was little information about how the default apps would actually look and work. The entire process was a learning experience. In fact, I’ve learned more about designing interfaces while designing for the Apple Watch than I have for iPhone.
Here are some things I’ve learned while developing for Apple Watch that I think are useful for current or aspiring Apple Watch developers.
Apple Watch apps: NOT tiny iPhone apps
When I started thinking about having a Watch app for LookUp, I started by playing around with resource templates for Sketch that Apple had provided. The initial designs included pretty much everything that the iPhone app had. Meanings, synonyms, Wikipedia content, etc. I was even thinking of adding a Settings icon. It was going to be a miniaturised iPhone app with aesthetics matching that of a Watch app.
But it soon became evident that the computer images, that are probably 4-5 times the actual size of the screen, give little perspective as to the size of the screen we are dealing with. Paper prototyping is key here. It’s probably the best way to know how small the Watch’s screen is.
The first thing that had to go, after I started drawing the interfaces on paper, was the home screen with the word of the day displaying like it would in the iPhone app. There just wasn’t enough space for both the word and the search button to get enough attention above the fold. What replaced was a single button, that asked to quickly search for the meaning of a word.
1 button, less than 30 second interactions
Another reason that I let go of the miniaturised iPhone app approach was the fact that it takes time to fetch all the data from the iPhone app and get it back to the Watch app. If this process occurs at launch, the launch times spike heavily!
While I was designing the Watch App, it was already mid-April and the first Apple Watches were starting to ship. Many amazing bloggers were writing about their experiences of developing for and using the Apple Watch. A post from MG Siegler detailed how most Apple Watch apps were pretty bad and that they took too long to load. Another post from Marco Arment mentioned how tiny the window of interaction was, and how he had to completely rethink the Overcast app. What I observed was that most of the useful apps on the Apple Watch had just one button, less than thirty second interactions, or in fact, only a quick glance.
It’s not until you wear the Watch itself that you realize how little you actually look at it, much less tap on the screen. Opening an app on the Apple Watch is a ritual where you hold your hand at an angle, stop everything that you are doing and use your other hand to navigate around the array of icons. Whatever’s to be achieved with the app, better be done within half a minute or less or else the user will become frustrated.
The above observation is a serious reason to make a judgement call on whether or not your app needs an Apple Watch app in the first place. In most cases, notifications and glances get things done faster than having an actual app. An Apple Watch app should be for accomplishing that small task that annoys you to have to take your iPhone out in order to complete.
For example, I prefer using Pomodoro Timer on my Apple Watch. I don’t like to pull out my iPhone to use it. Timers are a simple task where pulling out my iPhone increases my chances of getting distracted. The very reason you are using a pomodoro timer is to stay focused!
Another app category where the Apple Watch can thrive is transit. Calling a cab, fetching an Uber, or getting directions. These are all tasks that are much better accomplished with a short interaction on your wrist than reaching for your iPhone.
I read a lot of books and the process of having to reach for my iPhone to find the meaning of a word is irritating. I have to stop reading for a minute or two so I can launch the app on my iPhone. It completely destroys my concentration. On the other hand, if the time of interaction with the app were drastically reduced, it would be much easier to get back to reading without being distracted by something else. This is where a Watch app for LookUp comes in.
My initial intentions with the Watch app were far from “one button, less than thirty second interaction” use. In fact it would take ages to load all the data I wanted to, but with much trimming down, LookUp finally reached a point where the process of using it boils down to tap, speak, and get the meaning. All this happens in a matter of seconds. There are no synonyms, Wikipedia articles, or images displayed. Balancing necessity and want is hard, but the Apple Watch is forcing developers to do it.
Force Touch menus aren’t hamburger menus
Force Touch context menus seem like a great layer of interface when there’s this much of a space constraint, but combine the space constraint with the time constraint, and it becomes evident that Force Touch menus aren’t just hamburger menus that can be used to shove away unwanted content.
Force Touch context menus aren’t instantly visible. So whatever gets added to a context menu better be something not related with the primary purpose of the app. It isn’t instantly apparent to press hard on a display.
Having seen the Watch demos, I was particularly intrigued by the Photos app. A Watch is not the best screen size to view photos on. At best, it’s a convenient way to have a locket of your favourite few photos for you can glance at any time. I wanted LookUp to offer access to a small list of interesting words that a user found. The starred list on LookUp serves that purpose.
Checking for your favourite words is not the primary function of LookUp and this is where I thought that instead of trying to fit in a button to go to the starred list, it’s better to keep it under the Force Touch menu. It’s accessible from everywhere in the app and doesn’t compromise the screen space allocated for the primary function.
Over different prototyping sessions, and more recently, through using the Watch itself, I’ve realised that Force Touch isn’t about displaying the lesser used features of an app, but about displaying the actions to content that doesn’t need to sit center stage. It is not part of the primary objective of the app but stays on the sidelines, only taking the field when needed. It’s a small trick I’ve learned from Apple’s Human Interface Guidelines, but perhaps the most important.
Animations replaced by image sequences
While iOS encourages animations to be written in code — to be honest, most of them look better that way anyways — WatchOS is slightly different. To be running that code on an Apple Watch might actually slow down the app. Instead, WatchOS can make use of a far more interesting technique of animating objects.
If a lot of images move quickly, it creates an animated sequence. Moreover, playing an image sequence for animation is much more efficient than having to write the code to achieve the same thing on Apple watch. Small enhancements like this will improve performance and make the overall experience better.
Apple Watch provides natural padding, no need for that in code
Another small trick I learned while developing for Apple Watch came from an early blog post I cam across where someone mentioned that there was no need to add padding to interface elements because it was provided naturally by the bezel of the screen. Most Apple Watch interfaces have a black background so the screen often blends in with the bezel. This can be used as an advantage while designing the interface.
At first, this makes screenshots look rather hideous. But in fact, when you try this on the Apple Watch itself, it turns out that screenshots that looked so full of giant interface elements look and work perfectly normal. It’s the tiny sized, heavily padded elements that cause a slight annoyance while tapping on the Watch.
Developing for Apple Watch: Wrapping it up
The Apple Watch is a unique device because of its small size. From what I’ve learned during the development of LookUp’s Watch App, it could be disastrous to think of the apps as shrunken down iPhone apps. In fact, the Watch app should almost always do far less than the iPhone app. A Watch App is very succinct in its purpose. Both the space and time of interaction are much smaller with the Watch and making a shrunken down iPhone app feels like cramming an entire blog post inside a tweet.
A few weeks from now WatchOS 2.0 will come out and we’ll see native third-party applications coming to the Apple Watch. They will no doubt be much faster and will be able to do a lot of things that the current WatchKit apps can’t. With native applications, the temptation to add more features to a Watch app is going to be high. Even with the added speed, I still think it’s a good idea to leave certain things for the iPhone.
If you’ve developed interfaces for the Apple Watch, I’d love to hear about some of your experiences as well, so be sure to leave them in the comments!
- LookUp – $2.99 – Download
LookUp is an elegant dictionary app that is available for iPhone and Apple Watch. Look up word references with ease, find meanings, synonyms, etymology, Wikipedia content, images, and more, all in a single app. Our Apple Watch App is all about quickly getting the meaning of a word without fetching your iPhone.
