Le document présente le développement d'une application web utilisant le Kinect, en mettant en avant le SDK et ses pré-requis techniques. Il décrit les recherches effectuées sur les fonctionnalités d'interaction, ainsi que des exemples d'utilisation et d'implémentation de l'API. Des références sont faites à des ressources et des idées pour optimiser l'expérience utilisateur avec Kinect.

1. 1
Kinect pour les
développeurs
Web.

2. 22
Qui suis je ?
Développeur Front End
#JavaScript #Angular #React
#Cordova #Gulp/Grunt #Sass #Ionic
@MeKimak @NewsDuFront
Mickael Dumand

3. 33
Génial,
un nouveau projet !
Un site web.
Une application Kinect.

4. 4
Microsoft Kinect

5. 55
V2
• Sortie en juillet 2014
• Enfin un SDK Windows !
• Sortie en novembre 2010
• « Hacké » pour Windows
V1Kinectn’estpasnouveau!

6. 66
Les possibilités du SDK

7. 7
Le choix
multiplateforme.

8. 8
Pré-requis Kinect
• Windows 8+
• Visual Studio
• Port USB 3.0 dédié
• Processeur 64-bit (x64)
• Carte graphique avec support DirectX 11
• Ne fonctionne pas dans une VM
Contrairement aux apparences
cette présentation
se déroule actuellement
sous Windows ;)

9. 9
Je commence mes recherches

10. 10
Enormément de ressources sur la v1

11. 11
1 article HelloWorld

12. 12
Comment on code une interaction ?
Hold gesture.

13. 13
Documentation Microsoft

14. 14
Ok… c’est pas clair…
Comment on l’utilise ?

15. 15
Je continue mes recherches…

16. 1616
Ça fait une journée
que je cherche…

17. 17
Finalement, le forum Microsoft

18. 18
Eureka !
[…] will only provide you
the raw frame data from
the camera […]

19. 19
FAIL!

20. 20
DO IT
YOURSELF !

21. 21
26 points
dans
l’espace
(x,y,z)
Quelles données on reçoit ?

22. 22
x6 utilisateurs

23. 2323
Toutesles
33millisecondes!

24. 24
Implémentation de mon API

25. 25
1er parti-pris.
Isoler un seul utilisateur.

26. 2626

27. 2727
varbody=trackBodyOn(x,xDepth,z,zDepth);

28. 2828
varbody=trackBodyOn(0.5,0.2,1.0,0. 1);
0.5 = 50%
1 mètre

29. 2929
2e parti-pris.
(Droite ou Gauche)
Interaction avec une seule main

30. 30
Exemple d’utilisation

31. 3131
3e parti-pris. Drag & Drop.

32. 32
Exemple d’utilisation

33. 33
Disponible sur GitHub

34. 3434
Démo.

35. 3535
#github #ekino
ek-winjs-kinect
FEATURES
• Windows 8 store ready to package with cordova
• Target one player on specific area
• Fallback the API with Mouse Event on a browser
• Draw the body joints to canvas for debugging
• Manage hold gesture with events
• Manage drag and drop easily:
IDEAS
• Optimize right vs left hand interaction
• Manage event bubbling on target listeners
• Add simple gestures like press, swipe, zoom, smile,
wink
• Manage touch events fallbacks
• Target multiple players on different area

36. 36
Desquestions?