Pre-orders of Apple Watch are to start later this week, and the level of excitement by both users and developers is reaching its highest level. Although there are quite a bunch of watches running Android Wear or proprietary operating systems, the one that fits into the Apple ecosystem is definitely a big deal.
Developers and designers here at Stanfy, as well as in the rest of the world, have been toying around with the new platform for a while. Hundreds of new apps are being developed as we speak, even though the only way to see how your app would look like on the actual gadget is running it on an emulator.
One of our projects for Apple Watch is an extension of Waterbalance, an iOS application that we developed back in 2013. Here we share a few insights on the development process and what are the challenges a designer may face.
What is Waterbalance
Created to help people stay hydrated in the hustle and bustle of our everyday life, Waterbalance is an application that allows everyone to track how much they need to drink. Every time you consume liquid you can easily add the exact amount and type of it to the app, which will immediately calculate how it affects your water balance.
The app was silently asking to be ported to a smartwatch as its main functionality — manual tracking of consumed liquid, — can obviously be realized with a wearable in an easier way than with a smartphone.
Here’s how the animation of water balance change was created initially (it was changed later):
App design
In a way, Waterbalance app for the Watch is in contradiction with one of the main guidelines published by Apple. Theoretically, watch applications are seen as extensions of existing mobile apps that can perform only a fraction of their functions.
In case of Waterbalance, however, the situation is different: because the initial app has only the most important features already, it made perfect sense to pack them all into the Watch app as well.
“It’s difficult to design applications for a device that is not on the market yet,” said Stanfy’s designer Oleg Sheremet. “You don’t have the gadget at hand to check how your drawings will look in real life. It is also a big issue for developers, who often can’t say immediately how to implement certain features.”
Here’s what Oleg has envisioned for the app:
This looks great as an animation, however the designer admits that a need may rise to change things after the Watch is out.
“It happens with iPhone apps as well. You design an app, then check it out on the actual smartphone and realize that some features are not as convenient to use as you thought,” he added.
Main challenges
The most significant difference in designing applications for iPhone and Apple Watch is that the latter doesn’t currently allow to create animations in any way except as showing frames as pictures, one after another (same as animated GIFs).
“If you want something to move, you have to work frame-by-frame,” Sheremet explains. “If it’s a looped animation, like slight motion of a button, it’s fairly easy to do. But when you need to add animation between screens, you need to think it through very thoroughly so that it looks seamless.
Current version of the design
“Even simple elements require quite a bit of work. An example is the ring that shows water balance: I had to create several pictures for each percentile to make filling up look smooth. Even the numbers in the center are part of the picture as this is much easier for developers.”
Another pitfall for a designer is that the Watch brings a new paradigm, to which it’s kind of difficult to switch after spending years designing iPhone applications.
“It took me a while to draw this app. It was slow and painful in the beginning, I didn’t like what I designed,” Oleg said. “Then I just put it on hold and returned to the project in a week, and then created something I’m proud of.”
Even though this first attempt at Apple Watch app took a while, Oleg is sure that normally it should take less than designing an application for iPhone. The tricky part is to break through the “paradigm block” and pay a lot of attention to details.