Open Search

Designing for Apple Watch

March 17, 2015 1:13 pm
Categorised in: ,
Reading Time: 2 minutes

I don’t imagine we’ll get a request in for anything to do with the Apple Watch within the next 2 years at my place of work but interesting information on some of the constraints of designing for the watch can be found here.

http://www.mutualmobile.com/posts/apple-watch-design-overview-infographic

If anyones curious about what you can do within the constraints, attached is a UI I’ve done (not connected up at the moment though). Notifications in the infographic illustrate what it’s like to design for. Elements are full width (there is a special grouped element that allows you to add to elements into a line) and limited in styles.

Screen Shot 2015-03-17 at 12.53.32

Custom fonts are supported but not massively recommended at this time as I understand. A lot of black is recommended (the OLED screen saves power by not powering pixels when set to  black which apparently makes for far deeper and richer colours).

Modal/scroll view and hierarchical views are about all the view methods you have but seem the most appropriate. Of course all code is ran on the phone rather than the device but this is something I expect to change when Apple rolls out the next version of watchKit at WWDC

Update 04/05/15

This bad boy is up and running on my watch right now. Really pleasantly surprised how quick it was to get this up and running (I wired up the mock up from here in less than an hour before I went to a dinner party)

Update 05/05/15

Apple yesterday released/updated/it only just came to my attention their Human Interface Guidelines. Interesting read (especially the UI elements section which lays down the sort of restrictions in terms of visual design for these things), even if we won’t EVER do one of these at my work. Some good templates, fonts and mock up shizzle in the last section if you’ve got any inclination to start mocking something uphttps://developer.apple.com/watch/human-interface-guidelines/

This joint was penned by @elmarko

Comments are closed here.