Apple Watch par Benoit Capallere et Joeffrey Bocquet

Ici, ajoutez un visuel à propos du client ou projet

Benoit CAPALLERE Joffrey BOCQUET

WatchKit

1.1. LES GRANDES LIGNES

XCode 6.2 & iOS 8.2

Utilisation couplée à un iPhone

2

swift ou obj c

Un nouveau SDK

Développement couplé à une application

2 tailles

3

Action & Outlets : pas de différence

Gestures : existent mais plus limitées

Internationalisation : pas de différence

Storyboard obligatoire

1.2. LES GRANDES LIGNES

NouveauForce touch

Digital crown

4

2.1. ARCHITECTURE

Ajout d’une nouvelle target

dans XCode 2 nouveaux

groupes

Watch Kit Extension : code

Watch Kit App : storyboard / ressources

5

2.2. ARCHITECTURE

Code pour gérer les interactions dans l’extension

Toute tâche plus sophistiquée devra être faite dans l’application

6

2.3. CYCLE DE VIE

Plus court

Entry point

7

2.4. CYCLE DE VIE

Les méthodes

awakeWithContext : chargement des données

willActivate : à utiliser pour des changements de dernière minute

didDeactive : invalider les timers ou stopper une animation par exemple

8

App Delegate

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions

- (void)applicationWillResignActive:(UIApplication *)application

- (void)applicationDidEnterBackground:(UIApplication *)application

- (void)applicationWillEnterForeground:(UIApplication *)application

2.5. CYCLE DE VIE

9

3.1. XCODE

espace de travail

10

3.2. XCODE

visualisation

XCode & Simulateur

11

4. LES CLASSES

visualisation

WKInterfaceController

Classe WKInterfaceObject NSObject

11 éléments :

• Button, Date, Image, Label, Map, Slider, Switch, Timer

• Table

• Groupe, Separator

UI

12

5.1. POSITIONNEMENT

Empilement vertical des composants par défaut

Possible en horizontal avec un « Container Group »

Pas d’ordre

Pas de superposition

Top, center, bottom

Left, center, right

13

5.2. POSITIONNEMENT

On peut cacher ou montrer un objet

On ne peut pas ajouter un objet ou changer son ordre

On peut aussi changer :

• L’alpha

• La taille

• L’accessibilité

Auruntime

14

6.1. NAVIGATION

Push

Page-Based par le code permet d’être dynamique sur le nombre de pages et l’ordre

Comment ? ModalPage-Based

15

6.2. NAVIGATION Passage de données : les contextes

VC Départ

let detailIndex: Intinit(detailIndex: Int) {

self.detailIndex = detailIndex}

}override func contextForSegueWithIdentifier(segueIdentifier: String) -> AnyObject? {

if segueIdentifier == "segueDetail" {return DetailContextData(detailIndex: 2)

}return nil

}

VC arrivée

override func awakeWithContext(context: AnyObject?) {

super.awakeWithContext(context)

if let detailContextData = context as? DetailContextData {

detailIndex = detailContextData.detailIndexprintln(detailIndex)self.myLabel.setText(toString(det

ailIndex))}

}

16

7. TABLEVIEW

Avant l’affichage on donne :• Le nombre de lignes

• Le contenu de chaque ligne

Une classe pour un type de Cell

Pas de section

Lors de la sélection (segue ou par programmation) d’une « row » on passe les données avec le contexte

17

8. CONTEXT MENU

Appui long sur l’écran

On le définit pour un contrôleur

4 maximum

1 menu : un titre, une image, une action contextualisé pour une View.

18

9.1. PARTAGE DE DONNÉES

- Share NSUserDefault- Share files inside a container- Share Keychain- Common Framework- Directly communicate from Watch Extension to Companion App

19

9.2. PARTAGE DE DONNÉES

Entre l’iOS App et l’extension WatchKit

Activation de « App Group » dans Capabilities et création d’un groupe

Share files inside a container

20

9.3. PARTAGE DE DONNÉES

Share NSUserDefault

NSString *container = @"group.com.society.groupname.sharing";

NSUserDefaults *defaults = [[NSUserDefaults alloc] initWithSuiteName:container];

//classic access to userdefault values ...[defaults setValue:@42 forKey:@"userAge"]; //writeNSNumber* age = [defaults valueForKey:@"userAge"]; //read

21

9.4. PARTAGE DE DONNÉES

Directly communicate from Watch Extension to Companion App

- (void)application:(UIApplication *)applicationhandleWatchKitExtensionRequest:(NSDictionary *)userInfo

reply:(void (^)(NSDictionary *replyInfo))reply

+ (BOOL)openParentApplication:(NSDictionary *)userInforeply:(void (^)(NSDictionary *replyInfo, NSError *error))reply

22

10.1. GLANCES

Les Glances (« coup d’oeil »)• Lançable manuellement par l’utilisateur depuis la home

de la montre• Un par application• La seule interaction possible est le clic• Non scrollable• Utilisation possible de handoff pour gérer le clic sur la

glance. Lance l’App Watch par défaut.

23

10.2. GLANCES

Création : • À la création de l’App Watch • En ajoutant un « Glance Interface Controller »

2 groupes (upper/lower) : • Chaque partie est customizable depuis un ensemble de

templates• Label/Image, pas de bouton/switch• Création de sa classe

Besoin de créer un « scheme » avec le simulateur

24

11. MAPS

Possibilité d’ajouter des annotations (5 maximum)

pas d’interactivité Pour le mettre en place :

• Ajout du composant d’UI

• Définition de la région

25

13.1. NOTIFICATIONS

Notification par défaut si rien de configuré avec une interface « Short Look »

Diffusion d’une notification « Long Look » si on l’a ajouté à l’app watch :

• Static notification

• Dynamic notification

Short Look

26

13.2. NOTIFICATIONS

Diffusion d’une notification « Long Look ». Static ouDynamic.

Configurer des interfacesde notificationsdifférentes par Category

Custom

Long Look

27

13.3. NOTIFICATIONS

Tests{

"aps": {"alert": {

"body": "Your Booking is Available","title": "Optional title"

},"category": "watch_booking_checkin"

},

"WatchKit Simulator Actions": [{

"title": "Open App","identifier": "openAppButtonAction"

}....

www.useradgents.com

A USER INTERFACE ISLIKE A JOKE. IF YOUHAVE TO EXPLAIN IT,IT’S NOT THAT GOOD.

‘’

MERCI

Benoit CAPALLERE Joffrey BOCQUET

8 rue de la Rochefoucauld75009 PARIS +33 1 77 75 65 90 uainfo@useradgents.com www.useradgents.com @useradgentswww.joshfire.com @joshfire

userADgents en chiffres :

Que faisons-nous ?

Accompagnement stratégiqueEtude de marché, benchmark, auditFormationRecherche et innovation

CONSEIL

Design ThinkingRecherche utilisateursAteliers d’idéationDesign graphique des interfacesTest & Learn

UX / DESIGN

Applications natives (iOS/Android/Windows Phone)Web responsive & adaptiveBack-endGestion des stores

DÉVELOPPEMENT

Publicité mobile (media & audience planning)App Store optimisation Campagnes Drive to storeInteraction in store

PROMOTION

6 ans d’existence

30 experts

14 awards

userADgents est une agenceconseil « mobile first » qui aideles marques à définir leurstratégie, leur design, àdévelopper & promouvoir leursservices et produits par le biaisd’applications & de sites poursmartphones, tablettes &objets connectés.

Nous sommes partenaires avecJoshfire, la 1ère agence d’iOTet nous dirigeons la MobileMarketing Association.

Qui sommes-nous ?

8 rue de la Rochefoucauld75009 PARIS +33 1 77 75 65 90 uainfo@useradgents.com www.useradgents.com @useradgentswww.joshfire.com @joshfire

Que faisons-nous ?

IDEATION

DESIGN

PROTOTYPAGE

INDUSTRIALISATION

Fondée en 2010, l’agenceJoshfire est spécialisée dans lacréation d’objets connectés etexpériences interactives surmesure.

Nos fondamentaux sontl’expérience utilisateur, ledesign et l’ergonomie.

Nous sommes obsédés parchaque détail et préférons laqualité à la quantité.

Nous sommes partenaires avecuserADgents, une agenceconseil « mobile first ».

Qui sommes-nous ?

Nous mêlons notre expérience et expertise à votre connaissance et vision du métier pour créer des concepts innovants.

Assistés par de vrais designers industriels & spécialistes dans les objets connectés, nous savons évaluer les solutions les plus pertinentes.

Pour valider les idées, nous les prototypes avec nos experts en électrotechniques.

L’accomplissement d’un processus créatif agile c’est de voir votre produit en magasin. c’est aussi notre satisfaction.