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

Google Glass: Quels Frameworks pour quels usages?

Google Glass: Quels Frameworks pour quels usages?

Mathieu Hausherr
Cédric Pointel

Droidcon Paris 2014

Mathieu Hausherr

September 23, 2014
Tweet

More Decks by Mathieu Hausherr

Other Decks in Programming

Transcript

  1. 4 Des frameworks selon les usages Comment développer sur les

    Google Glass ? Les Google Glass et ses contraintes
  2. 5 Historique 2011 avril 2012 mai 2012 juin 2012 février

    2013 avril 2013 mai 2013 novembre 2013 avril 2014 mai 2014
  3. 6 Batterie 5/6 hours Prisme Resolution: 640x360 Capture Photo :

    5mpx Video : 720p Microphone Touchpad Tap one/two fingers Swipe one/two fingers Transducteur Bone conduction Electronique 16 GB 1,2 GHz 1GB RAM Wifi / Bluetooth Un petit bijou technologique …
  4. 7 ! Prendre des photos ! Enregistrer des vidéos !

    Rechercher sur Google ! Jouer de la musique ! Envoyer des messages ! Effectuer des appels ! Utiliser la navigation ! Recevoir des notifications ! Prendre des notes ! … … ayant les mêmes fonctionnalités qu’un smartphone …
  5. 8 … et des interactions équivalentes … ! Par la

    voix !   « Ok, glass » + commande ! Par le trackpad !   Avec différentes Gestures (taps, swipes, one finger, two fingers) ! Par des boutons physiques !   Pour prendre un photo ou enregistrer une vidéo !   Pour allumer/éteindre les Google Glass ! Avec son corps (tête, yeux, …) !   La détection de mouvement (grâce aux capteurs, accéléromètre, gyroscope, …) !   Le clin d’oeil droit ! Les applications “My Glass” !   Sur smartphone (iOS / Android) !   Sur le web (https://glass.google.com/u/0/myglass)
  6. 11 Des frameworks selon les usages Les Google Glass et

    ses contraintes Comment développer sur les Google Glass ?
  7. 13 ! Le code tourne sur le serveur ! RESTFull

    !   Authentification avec OAuth2.0 !   Librairies en Java, PHP, .NET, Ruby, Python … Mirror API Your service Sync HTTP (REST)
  8. 16 ! Le code Android classique fonctionne sur les Glass

    !   Le GDK est en version Preview !   Il est disponible directement dans le SDK manager !   Il ajoute des fonctionnalités dédiées !   La gestion de la voie !   La gestion des gestes du corps !   Un nouveau type d’interface: les Cards Glass Development Kit
  9. 17 Vous pouvez utiliser les deux ! Une notification (Card)

    poussée avec la Mirror API peut lancer une application native (GDK) Mirror API ou GDK ?
  10. 18 Les Google Glass et ses contraintes Des frameworks selon

    les usages Comment développer sur les Google Glass ?
  11. 19 Comment gérer la voix ? Comment afficher de l’information

    à l’utilisateur ? Comment s’authentifier ? Comment scanner ou reconnaître des objets ? Comment proposer une navigation intuitive ? Comment échanger avec votre SI et partager du contenu avec d’autres utilisateurs ?
  12. 21 Situations !   Lancer une application !   Transmettre

    de l’information à une application !   Interagir avec l’application !   Effectuer une recherche !   … Exemple : Effectuer un virement ou rechercher une information Contraintes !   Les commandes sont « imposées » !   Selon l’usage une connexion réseau est nécessaire Comment gérer la voix ?
  13. 22 ! Solution : le GDK de base permet de

    gérer la voix de 3 façons différentes !   Les commandes vocale via l’écran d’accueil è afin de lancer directement un Glassware depuis l’écran d’accueil !   Les commandes vocale contextuelles è afin de lancer les items d’un menu directement par la voix !   La reconnaissance vocale è afin de transmettre ce que l’utilisateur dit au sein de son activité Comment gérer la voix ?
  14. 23 ! Les commandes vocale via l’écran d’accueil è afin

    de lancer directement un Glassware depuis l’écran d’accueil !   Une ressource XML pour la commande vocale selon une liste définie par Google (è VoiceTriggers.Command) Comment gérer la voix ? res/xml/voice_trigger.xml <?xml version="1.0" encoding="utf-8"?>! <trigger keyword="SEND_MONEY" /> "SEND_MONEY"! "FIND_A_PLACE"! "FIND_A_HOSPITAL"! "FIND_PARKING"! "SHOW_ME_MY_SPEED"! "SHOW_ME_THE_NEWS"! "SHOW_ME_THE_WEATHER"! "START_A_RUN"! "START_A_STOPWATCH"! "START_A_TIMER"! "TAKE_A_PICTURE"! "TAKE_A_NOTE"! "TRANSLATE_THIS"! "PLAY_A_GAME"! Exemple de commandes :
  15. 24 ! Les commandes vocale via l’écran d’accueil è afin

    de lancer directement un Glassware depuis l’écran d’accueil !   Déclarer un Intent Filter au sein du Manifest de l’application avec également la possibilité de fournir un icône à la commande vocale Comment gérer la voix ? <activity! android:name=".ui.activity.MainActivity"! android:icon="@drawable/ic_launcher"! android:label="@string/app_name"! android:keepScreenOn="true"! android:immersive="true">! <intent-filter>! <action android:name="com.google.android.glass.action.VOICE_TRIGGER" />! </intent-filter>! ! <meta-data! android:name="com.google.android.glass.VoiceTrigger"! android:resource="@xml/voice_trigger" />! </activity>
  16. 25 ! Les commandes vocale via l’écran d’accueil è afin

    de lancer directement un Glassware depuis l’écran d’accueil !   Possibilité d’ajouter un prompt afin d’offrir la possibilité à l’utilisateur d’ajouter un message supplémentaire !   Il est également possible de restreindre l’utilisation de la voix selon la disponibilité de certains services au sein des Google Glass (ex : camera, réseau, …) Comment gérer la voix ? <?xml version="1.0" encoding="utf-8"?>! <trigger keyword="SEND_MONEY">! <input prompt="@string/how_much_prompt" /> </trigger> ArrayList<String> voiceResults = getIntent().getExtras().getStringArrayList(RecognizerIntent.EXTRA_RESULTS);
  17. 27 Situations !   Afficher de l’information !   Rafraichir

    dynamiquement du contenu !   Offrir la possibilité d’interagir avec le contenu (afficher plus de détail, le partager, …) Exemple : lors d’un événement ou la visite d’un musée Contraintes !   Respecter les guidelines Google !   L’information doit être simple et pertinente Comment afficher de l’information à l’utilisateur ?
  18. 28 La timeline ! Une vision globale divisée en 4

    parties ! Le passé ! Le future / présent ! Les applications appelées « Glasswares » ! Les paramètres pour configurer les Google Glass (WIFI, Bluetooth, …) Home
  19. 29 3 types de carte Live cards Static cards Immersion

    ! Solution : le GDK de base fournit des types d’écran à utiliser afin d’afficher de l’information
  20. 30 Les StaticCards Static cards ! De simple vue !

    Pour afficher du texte, des images, des vidéos ou du HTML ! Utilisé pour afficher des notifications (è Mirror API) ! Possibilité d’y invoquer des LiveCards ou de l’Immersion ! Ne peut pas être rafraichie fréquemment
  21. 31 Les LiveCards Live cards ! Information Temps-réel ! Accès

    à certaines capacités des Google Glass (ex : accéléromètre, gyroscope, camera, …) ! S’exécute au sein de la timeline ! Peut être mis à jour fréquemment ! Low Frequency Livecards (de l’ordre de la seconde) ! High Frequency Livecards
  22. 32 Les Immersions Immersion ! S’exécute en dehors de la

    TimeLine ! Développer votre propre interface (è Activity Android) ! Accès à l’ensemble des capacités des Google Glass (ex : les capteurs, la voix, les gestures, …) ! Attention à respecter les contraintes Google (taille de l’écran, les interactions, gestures) ! Spécifier dans le Manifest android:immersive="true" pour éviter que les Glass se mettent en veille
  23. 33 ! Désormais une classe magique : CardBuilder è elle

    permet de générer un layout selon différent styles intégrés au GDK Gérer l’interface selon le besoin View view = new CardBuilder(context, CardBuilder.Layout.COLUMNS) .setText(”Bonjour, bienvenue à la Droidcon Paris") .setFootnote(”Session Google Glass à 15h55") .addImage(R.drawable.image) .getView(); .Layout.CAPTION .Layout.TITLE .Layout.ALERT .Layout.ALERT .Layout.AUTHOR .Layout.COLUMN
  24. 35 Situations !   Réseau social !   Banque !

      Assurance !   … Exemple : afficher le solde de mon compte Contraintes !   Pas de claviers sur les Glass !   Dicter un mot de passe n’est pas sécurisé Comment s’authentifier ?
  25. 36 ! Solution n°1 : Utiliser les APIs du GDK

    au moment de l’installation d’un Glassware Comment s’authentifier ?
  26. 37 ! Solution n°2 : Utiliser un QRCode !  

    Depuis le site web ou le smartphone !   Contient un token de connexion unique ! Zbar Comment s’authentifier ? compile files('libs/zbar.jar’)! ! ! imageScanner = new ImageScanner();! imageScanner.setConfig(0, Config.X_DENSITY, 3);! imageScanner.setConfig(0, Config.Y_DENSITY, 3);! int[] symbols = getIntent().getIntArrayExtra(SCAN_MODES);! if (symbols != null) {! imageScanner.setConfig(Symbol.NONE, Config.ENABLE, 0);! for (int symbol : symbols) {! imageScanner.setConfig(symbol, Config.ENABLE, 1);! }! }
  27. 39 Situations ! G-Commerce !   Evènementiel !   Logistique

    !   Intervention sur le terrain !   … Exemple : détecter une bouteille de vin Contraintes !   Performances !   Détection en local Comment scanner ou reconnaître un objet ?
  28. 40 ! Solution n°1 : Ajouter un QRCode / Utiliser

    un code barre ! Zbar Comment scanner ou reconnaître un objet ? compile files('libs/zbar.jar') ! ! cameraPreview = (CameraPreview) findViewById(R.id.camerapreview);! cameraPreview.setAutoFocusCallback(new Camera.AutoFocusCallback() {! public void onAutoFocus(boolean success, Camera camera) {! autoFocusHandler.postDelayed(doAutoFocus, 1000);! }! });! cameraPreview.setPreviewCallback(this);! ! ! ! public void onPreviewFrame(byte[] data, Camera camera) {! int result = imageScanner.scanImage(barcode);! }
  29. 41 ! Solution n°2 : Détection de forme ! OpenCV

    !   Limites : pas de résultats simplement actionnables Comment scanner ou reconnaître un objet ?
  30. 43 Situations !   Salon / Soirée démonstration !  

    Utilisateur privilégié / jeu concours !   … Exemple : rendre une navigation fluide lors de l’affichage de contenu Contraintes !   L’utilisateur est face à un terminal qu’il connaît mal !   Google propose déjà des guidelines Comment proposer une navigation intuitive et dynamique ?
  31. 44 ! Solution n°1 : En mimant l’interface Google !

      Liste de sélection Comment proposer une navigation intuitive et dynamique ? ! sensorManager = (SensorManager) this.getSystemService(Context.SENSOR_SERVICE);! sensor = sensorManager.getDefaultSensor(Sensor.TYPE_ROTATION_VECTOR);! sensorManager.registerListener(this, sensor, SensorManager.SENSOR_DELAY_FASTEST);! !
  32. 45 ! Solution n°2 : Avec les mouvement du corps

    Comment proposer une navigation intuitive et dynamique ? ! sensorManager = (SensorManager) this.getSystemService(Context.SENSOR_SERVICE);! sensor = sensorManager.getDefaultSensor(Sensor.TYPE_ROTATION_VECTOR);! sensorManager.registerListener(this, sensor, SensorManager.SENSOR_DELAY_FASTEST);! ! TYPE_ROTATION_VECTOR! TYPE_ACCELEROMETER! TYPE_GYROSCOPE TYPE_LINEAR_ACCELERATION! TYPE_GRAVITY! TYPE_MAGNETIC_FIELD Exemples :
  33. 46 ! Solution n°3 : En utilisant la caméra !

    OnTheGo Platforms : https://www.otgplatforms.com/ Comment proposer une navigation intuitive et dynamique ?
  34. 48 Situations !   Réseaux sociaux !   Assistance à

    distance !   Assurance !   … Exemple : afficher ce que je vois à un conseiller clientèle Contraintes !   Internet partagé avec le téléphone !   Capacité du processeur Comment échanger avec votre SI et partager du contenu avec d’autres utilisateurs ?
  35. 49 ! Solution n°1 : Via des APIs !  

    Utilisez votre librairie réseau préférée! Comment échanger avec votre SI et partager du contenu avec d’autres utilisateurs ? compile 'com.mcxiaoke.volley:library:1.0.4@aar’ compile 'com.octo.android.robospice:robospice:1.4.14’ compile 'com.squareup.retrofit:retrofit:1.6.1’
  36. 50 ! Solution n°2 : En vidéo !   En

    utilisant la solution de QuickBlox Comment échanger avec votre SI et partager du contenu avec d’autres utilisateurs ?
  37. 51 ! Solution n°2 : En vidéo !   En

    utilisant la solution de QuickBlox Comment échanger avec votre SI et partager du contenu avec d’autres utilisateurs ? public Camera getCamera() {! try {! Field privateCameraField = com.quickblox.module.videochat.views.CameraView.class.getDeclaredField("camera");! privateCameraField.setAccessible(true);! return (Camera) privateCameraField.get(this);! } catch (NoSuchFieldException e) {! return null;! } catch (IllegalAccessException e) {! return null;! }! }
  38. 53 Disponible dès demain sur : Merci de votre attention.

    Questions ? Mathieu Hausherr [email protected] @mhausherr Cédric Pointel [email protected] @cpointel