Airbnb wants to be present on all the devices that our hosts and guests use every day so that we can bring the experience to everyone no matter where they are. Earlier this summer, a small group of us set out to define what the Airbnb experience would be like on a brand new mobile platform: Apple Watch. We were intrigued by the benefits this inherently on-the-go wearable could possibly bring to the table.
Our initial thought was perhaps the most natural one: “let’s port our iOS app to the Watch!”. So we started by building a prototype Watch app that had the capability to browse listings in a given city, send and receive messages, as well as edit and access wish lists. Because Watch interfaces are built using Interface Builder in Xcode, this was a relatively quick, drag-and-drop process of laying out the UI elements on each screen. So, we were done, right?
Not really. It quickly became evident that the prototype we had built was not the best-possible Airbnb experience that we could deliver. Browsing listings was difficult on the small screen, and many interactions like saving to a wish list were complicated to carry out. Also, we couldn’t display all the details we needed for hosts and guests to make informed decisions, and trying to do so would inevitably result in information overload.
Simplify
One of our Core Values here at Airbnb is Simplify. We were reminded to apply this lesson to the Watch app by Marco Arment’s Redesigning Overcast’s Apple Watch app, where he goes into great detail about flattening unnecessarily complicated navigation layers. We stopped trying to port the iOS app, and started from scratch. This time, we had one very specific goal in mind: deliver the best-possible messaging experience.
The Apple Watch is very much a secondary device; a second screen, if you will, of the iPhone. Naturally, it follows that our Watch app should be just that: a lightweight extension of the Airbnb iOS app. We needed to capitalize on a targeted and important part of the Airbnb experience that embodied the on-the-go nature of the Apple Watch, and messaging fit that description perfectly. The Airbnb Apple Watch app we’re launching today finally began to take its form.
Developing with WatchKit
A game of trade-offs
Working with WatchKit is an interesting juggle of trade-offs. Because watchOS 1 apps are inherently tethered to the main app on the iPhone, there are many things to take note when developing within the framework of the WatchKit extension. More than ever, iOS developers at all levels need to be cognizant of the effects of their code on performance and battery usage.
A question that kept coming up is the following: should a non-trivial computation like a network request be performed on the WatchKit extension on the iPhone, or should the Watch wake the parent iOS app in the background and ask it to perform the computation?
The answer depends on the structure of the existing code. If complicated business logic is already baked into the iOS app, then the easiest option would be to invoke openParentApplication: on WKInterfaceController, so that code wouldn’t need to be duplicated in the Watch app. This triggers handleWatchKitExtensionRequest: in the parent app, which returns a dictionary containing the result of the desired computation to the WatchKit extension. Note that because the result needs to be serialized and transferred via Bluetooth, all of the values it contains must conform to NSCoding.
In our case, because we already had a separate framework within the app, AirbnbAPI, that encapsulates the networking layer, we were able to simply import this into the WatchKit extension, and perform everything within it, without having to constantly wake the iOS app. This reduces the communication overhead between the extension and its parent, and results in cleaner code.
When deciding who should be responsible for performing a computation, it is also important to keep in mind the complexity and duration of the computation. The more complex it is, the more the Watch should defer to the iPhone’s processing power. Today on watchOS 1, the performance difference is generally not perceptible. However, on the upcoming watchOS 2, one of the biggest changes is that the WatchKit extension will be moved off the iPhone and onto the Watch. As a result, this distinction will become much clearer, because code in the extension is executed directly on the Watch. Now, would it be faster for the iPhone to carry out the request, then send the result back to the Watch through Bluetooth or for the Watch to perform it by itself and avoid the communication overhead altogether?
Thinking hard about what really matters
The simplicity and laser-focus of the Apple Watch as a platform make it both a joy and a challenge to develop for at the same time. The small screen size means that not a whole lot of content can live on each screen, so a great amount of care needs to exercised when designing for it. Before embarking on this journey, all Apple Watch developers and designers should ask themselves questions like:
If this button will occupy 30% of the pixels on the screen, is it of proportional importance?
If this function is an important action that a person can and will frequently perform, should it be hidden behind the Force Touch gesture?
If this screen is one that people will care about the most because it displays the most crucial data, should it be accessible only through a “home screen” that would otherwise give the Watch app a beautiful front face?
The effort, time, and deliberation put into seemingly small decisions like these would pay back dividends at the later stages of development. We learned that the more thought we put into determining what really matters, the less time our hosts and guests would waste navigating the Watch app, and the more frustration they will avoid. One of the main yardsticks for an amazing Watch app is how quickly someone would be able to accomplish the desired task, from raising their wrist, to lowering it back down.
The final product
A messaging hub
The Airbnb Apple Watch app was not designed to replace or mirror the main iOS app. It is a messaging hub — a means to help hosts respond to their guests more quickly, and for guests to get notified of important events. With rich, interactive notifications, hosts can accept a booking request right from their wrist:
A guest can then respond to a host’s welcome message the second they receive that notification on their Apple Watch, using the built-in Dictation feature:
We went one step further, and integrated the Watch app with iOS by adding a Settings-Watch.bundle to the main iOS app target in Xcode (Apple Watch Programming Guide), which enables hosts and guests to enter pre-recorded, quick responses in the Apple Watch settings app on their iPhone. These responses will then show up every time a “Reply” button is tapped on the Watch, allowing for one-tap responses. We hope that this will help hosts who find themselves repeatedly typing in responses to common questions from their guests, like “What’s the wifi password?“.
Every frame matters
At Airbnb, we really believe that Every Frame Matters. Because the Watch is still a young platform, we felt that many people are still not fully clear what the apps on their Watch can and cannot do. We wanted to make sure our hosts and guests knew how the new Watch app can help them, so we built a first-time user experience for the Watch; something we haven’t seen done before.
The designers on the Watch team, Britt Nelson, Salih Abdul-Karim, and Helen Tseng, produced a handful of beautifully illustrated and animated sequences that tell people what the Watch app does, and why we think it’s a compelling addition to their Airbnb experience. The animated illustrations are intentionally bright and light-hearted to set a friendly and approachable tone for the app.
The time has come!
We’re extremely excited to see the Airbnb Apple Watch app go live to our hosts and guests worldwide today. It was an incredibly fun challenge over the past few months, tackling a platform where common practices haven’t really been laid out and boundaries haven’t been fully explored.
The Watch app began as a pet project, and it slowly evolved into a first-class citizen of the Airbnb mobile experience, something the whole team is very proud of. Moving forward, we hope that the focus, discipline, and attention to detail we put into creating this app would not only inspire other developers to do the same, but also motivate ourselves as we continue to improve the Airbnb experience.
Check out all of our open source projects over at airbnb.io and follow us on Twitter: @AirbnbEng + @AirbnbData
Originally published at nerds.airbnb.com on September 3, 2015.
