Thinkapps’ Build Blog has published a few designer mockups showing what popular third-party applications might look like on Apple’s new smartwatch with some interesting results. The apps were created by several different designers, and you can see that each app maintains some of the branding and design you’d expect while conforming to the smaller wearable UI and its new input devices like the Digital Crown.
Above you’ll find the design for Facebook Messenger, which features a contact view made up of circular contact photos with online indicators that closely resembles the watch’s home screen. The message view sports a single reply button that presumably uses the device’s built-in dictation capability to compose a response.
Below you’ll find designs for apps like Beats Music, Skype, Uber, YouTube, and more. Keep in mind that these designs are hardly official, but represent the types of user interfaces you might see when the folks in Cupertino release the Apple Watch early next year.
The theorized watch version of the Apple-owned Beats Music maintains the same “Now Playing” screen design and the round genre bubbles that define the iOS version. The circular design language actually fits in fairly well on the Apple Watch without much coercion, since most of that UI also relies on circles.
The Skype design uses similar incoming call controls to those of the iPhone, with round accept and decline buttons matching their smartphone counterparts almost exactly. Circles are present throughout the UI, as is the case with most Apple Watch designs. Incoming text messages can be replied to using a series of canned responses or through dictation, just like native SMS and iMessages.
The bite-sized version of Yelp forgoes the popular circular interface elements for something packed a bit more densely with information. Native dictation and map views are combined with an overview that provides quick access to a venue’s phone number, location, rating, hours, and more.
Two different designs were published for the Tinder app. The first uses circles for photos and positions controls in the corners of the screen like some of the stock watchfaces. The app’s signature swiping mechanic is left intact, and the messaging system uses a combination of built-in replies and dictation like the native text messaging solution.
The second design takes a different approach to some elements. While swiping is present, most other controls are relegated to a Control Center-like menu that slides up from the bottom and presents options for using a “doodle” feature that functions like the built-in feature of the same name.
The YouTube design uses a grid of circular thumbnails, which unfortunately may not be the best shape for a video. Tapping a video on this grid brings up the player, which sports YouTube’s usual red play button and progress bar as well as the view counter and controls for liking or disliking a video, or changing the volume. It seems unlikely that users would want to watch a significant number of YouTube videos on such a small screen, though it could be used for casual viewing.
The Apple Watch mockup of Beats competitor Spotify uses a similar design for its Now Playing screen, but the similarities end there. Instead of a cluster of genres to choose from, the Spotify app makes use of a full list of artists which doesn’t display as well on the small screen and likely makes a difficult tap target. A much more convenient grid of album artwork is also present, which seems like a more appropriate design for a watch.
The Uber watch app mockups blends in well with the OS even though it maintains much of its own design. Circular displays for search progress, driver photos, and other elements fit in nicely, and the screen is uncluttered for the most part. Users can dictate a location and see driver ratings and car info from their wrist, then call a the driver directly from overview.
The Lyft car service also got mocked up by Thinkapps’ designers, though it features a less refined inerface than the Uber version. Most of the screen consist of large square images that can presumably be swiped to move to the next one. A single “request Lyft” screen proides a quick look at your car, driver, and destination.
Not much had to be changed to make the Moves app fit in on the Apple Watch. The iPhone version of the app already makes heavy use of circles, including on its icon. All that really needed to be done here was to fit the existing screens onto a smaller display. With very few minor tweaks, the app feels right at home.
The Pinterest mockup doesn’t really fit in with the iPhone version’s look or the Apple Watch design language. It uses menus filled with text which don’t seem to fit very well on a watch, along with small controls jammed into a control bar at the bottom of most screens. Pinterest as a whole doesn’t seem like the type of service you’d really want to browse from your wrist, likely due to its heavy use of images and the requirement to display a lot of text—neither of which work well at this size.
You can head over to the Thinkapps blog to get some more insight into what the designers intended for each mockup.
