Building watchOS apps

An introduction to building watchOS apps, given at Mobile Optimized 2015 in Minsk.

Transcript

1. BUILDING WATCHOS APPS
   MOBILEOPTIMIZED 2015
   BORIS BÜGLING - @NEONACHO
   

   View Slide

2. COCOAPODS
   

   View Slide

3. CONTENTFUL
   

   View Slide

4. View Slide

5. !!!!
   

   View Slide

6. ᴡᴀᴛᴄʜ
   

   View Slide

7. WATCHOS 1.X
   ▸ Notifications
   ▸ Glances
   ▸ WatchKit apps
   

   View Slide

8. NOTIFICATIONS
   

   View Slide

9. GLANCES
   

   View Slide

10. WATCHKIT
    

    View Slide

11. WATCHOS 2.X
    ▸ Apps run natively on the watch
    ▸ Custom complications
    

    View Slide

12. !!!
    

    View Slide

13. View Slide

14. COMPLICATIONS
    

    View Slide

15. ARCHITECTURE
    

    View Slide

16. View Slide

17. WATCHOS 2
    Extension
    phone => watch
    

    View Slide

18. RESOURCES
    ▸ Interface.storyboard
    ▸ Asset catalogs
    

    View Slide

19. EXTENSION DELEGATE
    class ExtensionDelegate: NSObject, WKExtensionDelegate {
    func applicationDidFinishLaunching() {
    }
    func applicationDidBecomeActive() {
    }
    func applicationWillResignActive() {
    }
    }
    

    View Slide

20. INTERFACE CONTROLLER
    class InterfaceController: WKInterfaceController {
    override func awakeWithContext(context: AnyObject?) {
    super.awakeWithContext(context)
    }
    override func willActivate() {
    super.willActivate()
    }
    override func didDeactivate() {
    super.didDeactivate()
    }
    }
    

    View Slide

21. WKINTERFACECONTROLLER
    ▸ Navigation
    ▸ Presentation
    ▸ Handoff
    ▸ Handle notification actions
    ▸ Communicate with parent app
    

    View Slide

22. DESIGN
    

    View Slide

23. If you measure interactions with your
    iOS app in minutes, you can expect
    interactions with your Watch app to be
    measured in seconds.
    

    View Slide

24. PRINCIPLES
    ▸ Lightweight interactions
    ▸ Holistic design
    ▸ Personal communication
    

    View Slide

25. LAYOUT
    ▸ based on horizontal or vertical groups
    ▸ very similar to UIStackView
    ▸ two device sizes (38mm and 42mm)
    ▸ edge-to-edge, bezel provides margins
    

    View Slide

26. View Slide

27. SOME EXAMPLES
    

    View Slide

28. View Slide

29. View Slide

30. View Slide

31. View Slide

32. View Slide

33. BUILDING A
    SIMPLE APP
    

    View Slide

34. View Slide

35. WATCHPRESENTER
    ▸ Remote controls Deckset instead
    ▸ Direct connection to the Mac
    ▸ Shows a preview of the slides
    ▸ Measures heartrate to display the "most exciting" slide
    ▸ Taps you if you're running out of time
    

    View Slide

36. MULTIPEER CONNECTIVITY!
    

    View Slide

37. AVAILABLE
    FRAMEWORKS
    

    View Slide

38. CFNetwork.framework
    ClockKit.framework
    Contacts.framework
    CoreData.framework
    CoreFoundation.framework
    CoreGraphics.framework
    CoreLocation.framework
    CoreMotion.framework
    EventKit.framework
    Foundation.framework
    

    View Slide

39. HealthKit.framework
    HomeKit.framework
    ImageIO.framework
    MapKit.framework
    MobileCoreServices.framework
    PassKit.framework
    Security.framework
    UIKit.framework
    WatchConnectivity.framework
    WatchKit.framework
    

    View Slide

40. BT APIS ARE
    PRIVATE :(
    

    View Slide

41. OTHER OPTIONS
    ▸ NSURLSession via Wi-Fi
    ▸ WatchConnectivity.framework to talk via the phone
    

    View Slide

42. HEALTHKIT.FRAMEWORK
    let anchorValue = Int(HKAnchoredObjectQueryNoAnchor)
    let sampleType = HKObjectType.quantityTypeForIdentifier(HKQuantityTypeIdentifierHeartRate)
    let heartRateQuery = HKAnchoredObjectQuery(type: sampleType!,
    predicate: nil, anchor: anchorValue,
    limit: 0) { (query, sampleObjects, deletedObjects,
    newAnchor, error) -> Void in
    guard let heartRateSamples = sampleObjects as?[HKQuantitySample] else {return}
    let sample = heartRateSamples.first
    let value = sample!.quantity.doubleValueForUnit(self.heartRateUnit)
    print(value)
    }
    heartRateQuery.updateHandler = // ...
    

    View Slide

43. View Slide

44. HEALTHKIT.FRAMEWORK
    ▸ not usable in the Watch simulator
    

    View Slide

45. TAPTIC ENGINE
    typedef NS_ENUM(NSInteger, WKHapticType) {
    WKHapticTypeNotification,
    WKHapticTypeDirectionUp,
    WKHapticTypeDirectionDown,
    WKHapticTypeSuccess,
    WKHapticTypeFailure,
    WKHapticTypeRetry,
    WKHapticTypeStart,
    WKHapticTypeStop,
    WKHapticTypeClick
    } WK_AVAILABLE_WATCHOS_ONLY(2.0);
    WKInterfaceDevice.currentDevice().playHaptic(.Start)
    

    View Slide

46. BUT ALSO NOT USABLE IN THE SIM
    

    View Slide

47. SPOTIFY REMOTE
    

    View Slide

48. DEMO
    

    View Slide

49. View Slide

50. View Slide

51. View Slide

52. TIPS
    

    View Slide

53. printf
    DEBUGGING IS
    GREAT!
    

    View Slide

54. MMWORMHOLE
    ▸ watchOS 1.0: CFNotificationCenter
    ▸ watchOS 2.0: WatchConnectivity.framework
    

    View Slide

55. FORCE QUIT APPS
    ▸ Long press until "reboot" menu
    ▸ Long press again
    

    View Slide

56. IF IN DOUBT, REBOOT THE
    WATCH :)
    

    View Slide

57. WHAT HAVE WE LEARNED?
    ▸ Code isn't very different from iOS apps
    ▸ But design very much is
    ▸ Rethink your app for the watch, don't port it
    ▸ If you can't - maybe you don't need a watch app
    

    View Slide

58. Don’t be afraid to not ship.
    @orta
    

    View Slide

59. THANK YOU!
    

    View Slide

60. ▸ https://developer.apple.com/watch/human-interface-guidelines/
    ▸ https://developer.apple.com/library/prerelease/watchos/
    documentation/General/Conceptual/AppleWatch2TransitionGuide/
    ▸ https://github.com/shu223/watchOS-2-Sampler
    ▸ http://www.kristinathai.com/category/watchkit/
    ▸ https://realm.io/news/watchkit-mistakes/
    

    View Slide

61. @NeoNacho
    boris@contentful.com
    http://buegling.com/talks
    

    View Slide