how to build a compelling apple watch app/complication
Post on 20-Jan-2017
783 Views
Preview:
TRANSCRIPT
HOW TO BUILD A COMPELLING WATCH APP
KRISTINA THAI
@kristinathai
@kristinathaiHI. I’M KRISTINA
📱 ⌚ 🍦
HOW TO BUILD A COMPELLING WATCH APP
KRISTINA THAI
HOW TO BUILD A COMPELLING WATCH APP
COMPELLINGevoking interest, attention, or admiration in a powerfully irresistible way
NEW
ACTIONABLE
RESPONSIVE
GLANCEABLE
NEW
ACTIONABLE RESPONSIVEGLANCEABLE
1. FIND A GOOD USE CASEOr don’t build one at all.
@kristinathai
@kristinathai
@kristinathai
2. QUICK ACTIONS ARE KEY
@kristinathai
http://www.imore.com/apple-watch-usage-survey-study-2015-q2
@kristinathai
@kristinathai
let suggestions = [“Hello world!”, “I’m on my way"] presentTextInputControllerWithSuggestions(suggestions, allowedInputMode: .AllowEmoji)
{ (input) -> Void in if let userInput = input?.first { // Do something with user input here self.contentLabel.setText(userInput as? String) } }
@kristinathai
NEW
@kristinathai
3. USE ANIMATIONS
@kristinathai
Simple Designs
@kristinathai
NEW
@kristinathai
@kristinathai
@kristinathai
@kristinathai
@IBOutlet var spacerGroup: WKInterfaceGroup! @IBAction func animate() { animateWithDuration(0.3, animations: { self.spacerGroup.setWidth(0) }) }
@IBAction func reset() { self.spacerGroup.setWidth(100) }
@kristinathai
4. DEVICE-TO-DEVICE COMMUNICATION
WATCH CONNECTIVITY
@kristinathaiWATCH CONNECTIVITY
WCSESSION
▸ Facilitates communication between WatchKit extension & companion iOS app
▸ Needs to be configured on both devices
@kristinathaiWATCH CONNECTIVITY
WCSESSION CONFIGURATIONimport WatchConnectivity
class InterfaceController: WKInterfaceController, WCSessionDelegate {
}
private let session : WCSession? = WCSession.isSupported() ? WCSession.defaultSession() : nil
override init() { super.init() session?.delegate = self session?.activateSession() }
@kristinathaiWATCH CONNECTIVITY
SENDER AND RECEIVER
applicationData⌚
@kristinathaiWATCH CONNECTIVITY
SENDER AND RECEIVER
applicationDatatransferUserInfo( )⌚
@kristinathaiWATCH CONNECTIVITY
SENDER AND RECEIVER
applicationDatatransferUserInfo( ) didReceiveUserInfo( )📲⌚
transferUserInfo( ) didReceiveUserInfo(📲 ⌚
applicationData)
@kristinathaiWATCH CONNECTIVITY
COMMUNICATION CATEGORIES
Background transfers Interactive messaging
Information isn’t needed immediately
Information needed immediately
Operating system determines the most suitable time to send
the data
Requires reachable state
Content is queued for transfer
@kristinathaiWATCH CONNECTIVITY
SENDER AND RECEIVERS - BACKGROUND TRANSFERS
Data Type Sender Receiver
Dictionary (overwrite latest data) updateApplicationContext didReceiveApplicationContext
Dictionary (keep all data - FIFO) transferUserInfo didReceiveUserInfo
File, Dictionary (metadata) transferFile didReceiveFile
@kristinathaiWATCH CONNECTIVITY
SENDER AND RECEIVERS - INTERACTIVE MESSAGING
Data Type Sender Receiver
Dictionary sendMessage didReceiveMessage
NSData sendMessageData didReceiveMessageData
@kristinathaiWATCH CONNECTIVITY
2 NEW WATCH CONNECTIVITY PROPERTIES
‣ hasContentPending
‣ Checks if session data has been received in background that needs to be delivered
‣ remainingComplicationUserInfoTransfers
‣ Gives you remaining number of times you can send complication data from iOS app to WatchKit extension
NEW
5. CLOCKKIT
COMPLICATIONSCLOCKKIT
@kristinathai
@kristinathai
@kristinathai
https://theswiftdev.com/2016/04/28/clockkit-complications-cheat-sheet/
CLKComplicationTemplate
@kristinathai
@kristinathai
@kristinathaiCLOCKKIT
TEXT PROVIDERS
▸ Smartly truncate & display text in watch complications
▸ Available for most data types
@kristinathaiCLOCKKIT - TEXT PROVIDERS
CLKSimpleTextProvider
let textProvider =
CLKSimpleTextProvider(text: "your string here", shortText: "string")
@kristinathaiCLOCKKIT - TEXT PROVIDERS
CLKDateTextProviderThursday, January 14, 2016
Thursday, January 14
Thursday, Jan 14
Thurs, Jan 14
Jan 14
14
let textProvider = CLKDateTextProvider(date: NSDate(), units: .Day)
@kristinathaiCLOCKKIT - TEXT PROVIDERS
CLKTextProvider - Custom text provider
CLKSimpleTextProvider *textProvider1 = [CLKSimpleTextProvider textProviderWithText:@"your string here" shortText:@"string"];
CLKTextProvider *textProvider = [CLKTextProvider textProviderWithFormat:@"%@ & %@", textProvider1, textProvider2];
CLKSimpleTextProvider *textProvider2 = [CLKSimpleTextProvider textProviderWithText:@"your string here" shortText:@"string"];
DATA POPULATIONCLOCKKIT
@kristinathaiCOMPLICATION TIMELINE
https://developer.apple.com/videos/play/wwdc2015/209/
@kristinathai
@kristinathai
Optional
NEW
@kristinathai
// MARK: - Timeline Population
func getCurrentTimelineEntryForComplication(complication: CLKComplication, withHandler handler: ((CLKComplicationTimelineEntry?) -> Void)) {
// Call the handler with the current timeline entry
handler(nil)
}
1: CURRENT TIMELINE ENTRY
6. ACCESSIBILITY = INCLUSIVITY
@kristinathai
15% OF THE WORLD’S POPULATION LIVES WITH SOME FORM OF DISABILITY
World Health Organization
WORLD REPORT ON DISABILITY
http://www.who.int/disabilities/world_report/2011/report/en/
@kristinathai
https://twitter.com/dstorey/status/649636741033279488
@kristinathai
@kristinathai
@IBOutlet var userInputButton: WKInterfaceButton! override func awakeWithContext(context: AnyObject?) { super.awakeWithContext(context) // Configure interface objects here. userInputButton.setAccessibilityLabel("Take user input") userInputButton.setAccessibilityHint("Open dictation") }
@kristinathai
NEW
@kristinathai
enum WKHapticType : Int { case Notification case DirectionUp case DirectionDown case Success case Failure case Retry case Start case Stop case Click}
@kristinathai
playHaptic(.Notification)
@kristinathaiRESOURCES
ANIMATIONS & TEXT INPUT
▸ http://kristina.io/watchos-2-tutorial-animations-using-groups/
▸ http://natashatherobot.com/watchkit-text-input-dictation-api/
@kristinathaiRESOURCES
WATCH CONNECTIVITY
‣ http://kristina.io/watchos-2-how-to-communicate-between-devices-using-watch-connectivity/
‣ http://kristina.io/watchos-2-tutorial-using-sendmessage-for-instantaneous-data-transfer-watch-connectivity-1/
‣ http://kristina.io/watchos-2-tutorial-using-application-context-to-transfer-data-watch-connectivity-2/
@kristinathaiRESOURCES
CLOCKKIT
▸ http://kristina.io/clockkit-tutorial-add-complication-to-an-already-existing-watch-project-clockkit-1/
▸ http://kristina.io/clockkit-deep-dive-text-providers-clockkit-2/
▸ http://code.tutsplus.com/tutorials/an-introduction-to-clockkit--cms-24247
▸ https://theswiftdev.com/2016/04/28/clockkit-complications-cheat-sheet/
@kristinathaiRESOURCES
ACCESSIBILITY
‣ https://www.youtube.com/watch?v=nqX2rNbZSyg (Apple Watch Accessibility by Paul Adam)
‣ http://www.sneakycrab.com/blog/2015/6/22/haptic-feedback-with-the-taptic-engine-in-watchkit-and-watchos-2-wkinterfacedevice-and-wkhaptic
top related