creating killer apple watch apps - goto conference · types of apple watch apps • watch apps •...

45

Upload: others

Post on 19-Jul-2020

11 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: Creating Killer Apple Watch Apps - GOTO Conference · Types of Apple Watch Apps • Watch Apps • native apps that run on the Apple Watch and interacts with the application logic
Page 2: Creating Killer Apple Watch Apps - GOTO Conference · Types of Apple Watch Apps • Watch Apps • native apps that run on the Apple Watch and interacts with the application logic
Page 3: Creating Killer Apple Watch Apps - GOTO Conference · Types of Apple Watch Apps • Watch Apps • native apps that run on the Apple Watch and interacts with the application logic

Wei-Meng [email protected]

Developer Learning Solutions, http://www.learn2develop.net

Page 4: Creating Killer Apple Watch Apps - GOTO Conference · Types of Apple Watch Apps • Watch Apps • native apps that run on the Apple Watch and interacts with the application logic

Agenda• Getting started with Apple Watch development

• Cool stuff in watchOS 2.0

• Complications

• Watch Connectivity Framework

• Download all demos from:

• http://goo.gl/DtTOCc

Page 5: Creating Killer Apple Watch Apps - GOTO Conference · Types of Apple Watch Apps • Watch Apps • native apps that run on the Apple Watch and interacts with the application logic

Smart Watches

Page 6: Creating Killer Apple Watch Apps - GOTO Conference · Types of Apple Watch Apps • Watch Apps • native apps that run on the Apple Watch and interacts with the application logic

Who will be the winner?

Whoever controls the smartphone platforms, controls the smartwatch platform

Page 7: Creating Killer Apple Watch Apps - GOTO Conference · Types of Apple Watch Apps • Watch Apps • native apps that run on the Apple Watch and interacts with the application logic

And the winner(s) are…

Page 8: Creating Killer Apple Watch Apps - GOTO Conference · Types of Apple Watch Apps • Watch Apps • native apps that run on the Apple Watch and interacts with the application logic

Tools

• Xcode 7

• Familiarity with iOS development

• Swift (Objective-C is also supported)

Page 9: Creating Killer Apple Watch Apps - GOTO Conference · Types of Apple Watch Apps • Watch Apps • native apps that run on the Apple Watch and interacts with the application logic

Apple Watch Specifications

• Powered using a custom chip (S1) from Apple

• Sensors

• Heart rate sensor on back of watch

• Accelerometer, WiFi, and Bluetooth LE

• Charged wirelessly using a magnetic charger

Page 10: Creating Killer Apple Watch Apps - GOTO Conference · Types of Apple Watch Apps • Watch Apps • native apps that run on the Apple Watch and interacts with the application logic

Interacting with the Apple Watch

• Digital Crown - scroll through list of items, zooms in or out of images, etc. Also act as a Home button

• Force Touch - pressure sensitive screen; differentiates between tap and press; a press is like a right-click on a computer

• Taptic Engine - haptic feedback system; taps on your wrist to inform of notifications; vibrates when you rotate the digital crown

Page 11: Creating Killer Apple Watch Apps - GOTO Conference · Types of Apple Watch Apps • Watch Apps • native apps that run on the Apple Watch and interacts with the application logic

Apple Watch Sizes• 38mm (height)

• 42mm (height)

312

390

272

340

Good news! No AutoLayout! Yet

Page 12: Creating Killer Apple Watch Apps - GOTO Conference · Types of Apple Watch Apps • Watch Apps • native apps that run on the Apple Watch and interacts with the application logic

WatchKit App Architecture

WatchKit Extension

WatchKit AppContaining

iOS app

Page 13: Creating Killer Apple Watch Apps - GOTO Conference · Types of Apple Watch Apps • Watch Apps • native apps that run on the Apple Watch and interacts with the application logic

iOS App and Watch App

Page 14: Creating Killer Apple Watch Apps - GOTO Conference · Types of Apple Watch Apps • Watch Apps • native apps that run on the Apple Watch and interacts with the application logic

Deploying Apple Watch Apps

iOS App Bundle

Page 15: Creating Killer Apple Watch Apps - GOTO Conference · Types of Apple Watch Apps • Watch Apps • native apps that run on the Apple Watch and interacts with the application logic

Types of Apple Watch Apps• Watch Apps

• native apps that run on the Apple Watch and interacts with the application logic running on the iPhone

• Complications

• apps that supplies data to be displayed on the watch faces

• Notifications

• displays notifications received by the iPhone (either local or remote notifications); apps can customise the notification interface

• Glances

• a supplemental way for the user to view important information from your app. Glances does not support interactions with users – tapping on a glance will launch the Watch app

Page 16: Creating Killer Apple Watch Apps - GOTO Conference · Types of Apple Watch Apps • Watch Apps • native apps that run on the Apple Watch and interacts with the application logic

Hello, Apple Watch!

Page 17: Creating Killer Apple Watch Apps - GOTO Conference · Types of Apple Watch Apps • Watch Apps • native apps that run on the Apple Watch and interacts with the application logic

Complications

Page 18: Creating Killer Apple Watch Apps - GOTO Conference · Types of Apple Watch Apps • Watch Apps • native apps that run on the Apple Watch and interacts with the application logic

What are Complications?• A complication is a function on a timepiece that

does more than just tell the time

!

Page 19: Creating Killer Apple Watch Apps - GOTO Conference · Types of Apple Watch Apps • Watch Apps • native apps that run on the Apple Watch and interacts with the application logic

Quick Look at the Various Watch Faces

Page 20: Creating Killer Apple Watch Apps - GOTO Conference · Types of Apple Watch Apps • Watch Apps • native apps that run on the Apple Watch and interacts with the application logic

Complications Not Supported on the Following Watch Faces

• Motion

• X-Large

• Timelapse

• Astronomy

• Photo Album

• Photo

• Solar

Page 21: Creating Killer Apple Watch Apps - GOTO Conference · Types of Apple Watch Apps • Watch Apps • native apps that run on the Apple Watch and interacts with the application logic

Time Travel• Time Travel is a new feature in watchOS 2.0 that

allows your application to display time-sensitive information on watch faces with complications. Turning the Digital Crown back and forth displays events past and future

• Lets you turn back time (or forward) to display information related to that specific time

• Examples:

• Weather forecast for the next 2 days

• Stock prices

• Too bad you can’t display stock prices for the future!

Page 22: Creating Killer Apple Watch Apps - GOTO Conference · Types of Apple Watch Apps • Watch Apps • native apps that run on the Apple Watch and interacts with the application logic

Watch Faces Not Compatible with Time Travel• Motion

• X-Large

• Timelapse

• Photo Album

• Photo

• Astronomy

• Solar

Special Watch Faces that supports their own Time

Travel

Page 23: Creating Killer Apple Watch Apps - GOTO Conference · Types of Apple Watch Apps • Watch Apps • native apps that run on the Apple Watch and interacts with the application logic

Supporting Complications in your Apple Watch App

• Use the ClockKit Framework

• Implement the CLKComplicationDataSource protocol

Page 24: Creating Killer Apple Watch Apps - GOTO Conference · Types of Apple Watch Apps • Watch Apps • native apps that run on the Apple Watch and interacts with the application logic

Implementing the CLKComplicationDataSource Protocol

• getSupportedTimeTravelDirectionsForComplication:withHandler:• Time travel directions

• getTimelineStartDateForComplication:withHandler:• Earliest date for complication data

• getTimelineEndDateForComplication:withHandler:• Latest date for complication data

• getPrivacyBehaviorForComplication:withHandler:• Privacy behavior - show or hide data when watch is locked

• getCurrentTimelineEntryForComplication:withHandler:• Current data to display

• getTimelineEntriesForComplication:beforeDate:limit:withHandler:• Data to display for past timeline

• getTimelineEntriesForComplication:afterDate:limit:withHandler:• Data to display for future timeline

• getNextRequestedUpdateDateWithHandler:• Next update time for timeline data

• getPlaceholderTemplateForComplication:withHandler:

• Static display for complication

Page 25: Creating Killer Apple Watch Apps - GOTO Conference · Types of Apple Watch Apps • Watch Apps • native apps that run on the Apple Watch and interacts with the application logic

Placement for Complications

!

Page 26: Creating Killer Apple Watch Apps - GOTO Conference · Types of Apple Watch Apps • Watch Apps • native apps that run on the Apple Watch and interacts with the application logic

Complication TemplatesCLKComplicationTemplateModularSmallColumnsText CLKComplicationTemplateModularSmallRingImage CLKComplicationTemplateModularSmallRingText CLKComplicationTemplateModularSmallSimpleImage CLKComplicationTemplateModularSmallSimpleText CLKComplicationTemplateModularSmallStackImage CLKComplicationTemplateModularSmallStackText

CLKComplicationTemplateModularLargeColumns CLKComplicationTemplateModularLargeStandardBody CLKComplicationTemplateModularLargeTable CLKComplicationTemplateModularLargeTallBody

CLKComplicationTemplateCircularSmallRingImage CLKComplicationTemplateCircularSmallRingText CLKComplicationTemplateCircularSmallSimpleImage CLKComplicationTemplateCircularSmallSimpleText CLKComplicationTemplateCircularSmallStackImage CLKComplicationTemplateCircularSmallStackText

CLKComplicationTemplateUtilitarianSmallFlat CLKComplicationTemplateUtilitarianSmallRingImage CLKComplicationTemplateUtilitarianSmallRingText CLKComplicationTemplateUtilitarianSmallSquare

CLKComplicationTemplateUtilitarianLargeFlat

Page 27: Creating Killer Apple Watch Apps - GOTO Conference · Types of Apple Watch Apps • Watch Apps • native apps that run on the Apple Watch and interacts with the application logic

Complication Templates

!

CLKComplicationTemplateModularSmallColumnsText

Page 28: Creating Killer Apple Watch Apps - GOTO Conference · Types of Apple Watch Apps • Watch Apps • native apps that run on the Apple Watch and interacts with the application logic

Complication TemplatesCLKComplicationTemplateModularSmallRingImage

!

Page 29: Creating Killer Apple Watch Apps - GOTO Conference · Types of Apple Watch Apps • Watch Apps • native apps that run on the Apple Watch and interacts with the application logic

Complications Demo

Page 30: Creating Killer Apple Watch Apps - GOTO Conference · Types of Apple Watch Apps • Watch Apps • native apps that run on the Apple Watch and interacts with the application logic

Movie Data

!

let movies = [ Movie(movieName: "Terminator 2: Judgment Day", runningTime: 137 * MINUTE, runningDate: NSDate(timeIntervalSinceNow: -360 * MINUTE), rating:8), Movie(movieName: "World War Z", runningTime: 116 * MINUTE, runningDate: NSDate(timeIntervalSinceNow: -120 * MINUTE), rating:7), Movie(movieName: "Secondhand Lions", runningTime: 90 * MINUTE, runningDate: NSDate(timeIntervalSinceNow: 10 * MINUTE), rating:8), Movie(movieName: "The Dark Knight", runningTime: 152 * MINUTE, runningDate: NSDate(timeIntervalSinceNow: 120 * MINUTE), rating:9), Movie(movieName: "The Prestige", runningTime: 130 * MINUTE, runningDate: NSDate(timeIntervalSinceNow: 360 * MINUTE), rating:8), ]

Page 31: Creating Killer Apple Watch Apps - GOTO Conference · Types of Apple Watch Apps • Watch Apps • native apps that run on the Apple Watch and interacts with the application logic

Communicating between the iOS

App and the Watch App

Page 32: Creating Killer Apple Watch Apps - GOTO Conference · Types of Apple Watch Apps • Watch Apps • native apps that run on the Apple Watch and interacts with the application logic

iOS and Watch Apps are on Separate Islands

Page 33: Creating Killer Apple Watch Apps - GOTO Conference · Types of Apple Watch Apps • Watch Apps • native apps that run on the Apple Watch and interacts with the application logic

Watch Connectivity Framework

• Background Transfers

• Application Context

• User Info

• File Transfer

• Interactive Messaging

• Send Message

Page 34: Creating Killer Apple Watch Apps - GOTO Conference · Types of Apple Watch Apps • Watch Apps • native apps that run on the Apple Watch and interacts with the application logic

Apple Watch

Storyboard

Resources

WatchKit App

Code

Resources

WatchKit Extension

WatchKitWatchKit

iPhone

Watch Connectivity Framework

iOS App

Background TransfersApplication Context

a

b

c

c

Page 35: Creating Killer Apple Watch Apps - GOTO Conference · Types of Apple Watch Apps • Watch Apps • native apps that run on the Apple Watch and interacts with the application logic

Use Case• Useful for updating application states, such as

glances on the Apple Watch

Page 36: Creating Killer Apple Watch Apps - GOTO Conference · Types of Apple Watch Apps • Watch Apps • native apps that run on the Apple Watch and interacts with the application logic

Apple Watch

Storyboard

Resources

WatchKit App

Code

Resources

WatchKit Extension

WatchKitWatchKit

iPhone

Watch Connectivity Framework

iOS App

Background TransfersUser Info

a

b

cc

b

a

Page 37: Creating Killer Apple Watch Apps - GOTO Conference · Types of Apple Watch Apps • Watch Apps • native apps that run on the Apple Watch and interacts with the application logic

Use Case• Useful for games where changes on one device

must be synchronized on the other device

Page 38: Creating Killer Apple Watch Apps - GOTO Conference · Types of Apple Watch Apps • Watch Apps • native apps that run on the Apple Watch and interacts with the application logic

Apple Watch

Storyboard

Resources

WatchKit App

Code

Resources

WatchKit Extension

WatchKitWatchKit

iPhone

Watch Connectivity Framework

iOS App

Background TransfersFile Transfer

a

b

b

a

~/Documents/Inbox

Page 39: Creating Killer Apple Watch Apps - GOTO Conference · Types of Apple Watch Apps • Watch Apps • native apps that run on the Apple Watch and interacts with the application logic

Use Case• Useful for transferring files between devices

Page 40: Creating Killer Apple Watch Apps - GOTO Conference · Types of Apple Watch Apps • Watch Apps • native apps that run on the Apple Watch and interacts with the application logic

Apple Watch

Storyboard

Resources

WatchKit App

Code

Resources

WatchKit Extension

WatchKitWatchKit

iPhone

Watch Connectivity Framework

iOS App

Interactive CommunicationsSend Message

a

b

b

a

• When Apple Watch sends a message to the iPhone, it wakes up the containing iPhone app in the background (if it is not in the foreground)

• When the iPhone sends a message to the watch, the watch app must be in the foreground, else it fails

Page 41: Creating Killer Apple Watch Apps - GOTO Conference · Types of Apple Watch Apps • Watch Apps • native apps that run on the Apple Watch and interacts with the application logic

Use Case• Useful for cases where you need to control your

iPhone through the Apple Watch. For example, you can create an app on the Apple Watch to adjust the volume on the iPhone, or perform some home automation tasks.

Page 42: Creating Killer Apple Watch Apps - GOTO Conference · Types of Apple Watch Apps • Watch Apps • native apps that run on the Apple Watch and interacts with the application logic

Demos

Page 43: Creating Killer Apple Watch Apps - GOTO Conference · Types of Apple Watch Apps • Watch Apps • native apps that run on the Apple Watch and interacts with the application logic

Volume Controller

Page 44: Creating Killer Apple Watch Apps - GOTO Conference · Types of Apple Watch Apps • Watch Apps • native apps that run on the Apple Watch and interacts with the application logic

Killer Watch Apps• Don’t cram your existing apps onto the watch!

• Think of the watch as an extension of your phone

• Use it to enhance the experience of the mobile app

• Home automation

• “Hey Siri”

• “Launch Garage app”

• Tap the “Unlock Garage Door”

Page 45: Creating Killer Apple Watch Apps - GOTO Conference · Types of Apple Watch Apps • Watch Apps • native apps that run on the Apple Watch and interacts with the application logic