4 Ways we Simplified Our App for the Apple Watch
by Michelle Li and Abby Deering.
“ Part of being a good designer is to anticipate design, not just responding to it. ” — David Hoang
We designed the Geocaching App for the Apple Watch before the device shipped and here is what we learned in the process:
The Whys and the Hows
The first question we asked ourselves is why we wanted to design for the Apple Watch and how we could leverage the Watch to supplement our current Geocaching iPhone experience. Geocaching is an anytime, anywhere real-world adventure where users find geocaches (containers) by navigating to their location. There have been many times we’ve been hiking up the side of a mountain and wished we didn’t have to reach into our backpacks or pockets to see how far we were from the nearest geocache. The Geocaching app naturally lends itself to wearables and seems like a perfect fit for an Apple Watch App so we decided to venture out on the journey of designing for a piece of hardware neither of us had ever used or held.
1. Simplifying Our Features
The Apple Watch is designed to complement the iPhone. It has a lightweight interface with limited functionality. With that in mind, we identified key features from our iPhone app that would enhance an Apple Watch user’s Geocaching experience. We decided to start with basic navigation functionality like displaying the compass and serving up relevant content like recent geocache log activity. Based on our user research, we realized a good amount of our users like to geocache when they have a few minutes to kill so we decided to show the closest geocache to the user, giving them the opportunity to geocache without having to pull out their phone.
2. Simplifying Our Content
The activity tab in our app lets users know who has found the geocache and their story, but more importantly it lets users know whether the geocache is missing, called a Did Not Find or DNF for short. On the Watch we decided to highlight the DNFs by taking out the story and reducing the feed to show the five most recent logs. We also show the DNF activity in a different color helping to separate it from the rest of the content, allowing users to quickly scan the watch for missing geocaches.
3. Simplifying Our Iconography
Geocaching has grown and expanded to many platforms over the last few years. It was only a little over a year ago that we launched our Android app. Because our brand guidelines were created before we knew what platforms we were going to support we’ve recently run into a few limitations with our current brand. Geocaching’s brand is currently in flux and a brand refresh is on the horizon so with that in mind we started to tackle the visual design problems we were running into. First, we simplified our icons:
The Apple Watch has a small screen size so we knew we were going to need to update our Difficulty, Terrain and Size icons that live on our list view and geocache details in our app. Our old icons were complex illustrations and needed to be switched out with every different value. Using one set of icons for all values helps with asset management as well as user recognition.
4. Simplifying Our Color Palette
Our current app uses a lot of low value hues that don’t work well on the black background of the Apple Watch. Since we knew we were going to be adding some new colors to our brand’s color palette we decided this was a great time to let the black background help inform our decision to add some new, higher value hues. We were fortunate enough to be able to test our Apple Watch app in Sunnyvale at Apple’s Lab. While down at the lab we noticed the colors used in our app still weren’t reading very well and we needed to brighten them even more.
Also, in one of our recent usability testing sessions we learned that people closely associate the color green with Geocaching so we wanted to make sure that green was at the forefront of our app’s design. We chose an updated green that would work well with the Apple Watch typeface, San Francisco and the black background.
Design Limitations
We ran into a few surprising design limitations when designing for the Watch. When the user is viewing the watch view they can swipe up to quickly access information about an app, called a glance. We designed three different glance views: navigation mode, displaying the closest geocache and an empty state for when there are no nearby geocaches. There are templates provided by Apple that you have to use for the glance layouts. The tricky part is using one template for different views. You can download the templates here under the Apple Watch Design Resources. We ended up using the template with two groups stacked for the most flexibility between views.
We also ran into a limitation because the Apple Watch only provides a static map. Geocaching relies heavily on map functionality to show users their current location and the location of the geocache they are navigating to. We decided to include a compass view as well as the static map view to help users easily navigate to the selected geocache. We also were not able to use the magnetic compass heading (like we use on our iPhone app) since the users’ iPhone could be in any orientation in their pocket. Instead our Watch app uses a course-based heading which is based on the direction the player has been traveling.
What’s next?
Although we did go down to Sunnyvale to test our app on the Watch at the Apple Lab, we were not able to take the watch out and geocache with it. Once we receive our pre-ordered watches, we plan to conduct outdoor usability testing sessions to see how our users react to geocaching on a new platform. We will then take their feedback and data from analytics to iterate on the next version. We would like to continue to explore an addition to the static map, maybe by linking out to the Apple Maps app. We anticipate that users will spend a majority of time on our compass screen so, we would like to continue to iterate on the compass screen design and learn what features will enhance the experience. Until then we will be anxiously awaiting the arrival of the Apple Watch to take it out geocaching.