Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Building watchOS apps

Building watchOS apps

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

Boris Bügling

July 13, 2015
Tweet

More Decks by Boris Bügling

Other Decks in Programming

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
    [email protected]
    http://buegling.com/talks

    View Slide