1
Kinectpourles
développeurs
Web.
22
Quisuisje?
Développeur Front End
#JavaScript #Angular #React
#Cordova #Gulp/Grunt #Sass #Ionic
@MeKimak @NewsDuFront
Mi...
33
Génial,
unnouveauprojet!
Un site web.
Une application Kinect.
4
Microsoft Kinect
55
V2
•  Sortie en juillet 2014
•  Enfin un SDK Windows !
•  Sortie en novembre 2010
•  « Hacké » pour Windows
V1Kinectn’e...
66
LespossibilitésduSDK
7
Lechoix
multiplateforme.
8
Pré-requis Kinect
•  Windows 8+
•  Visual Studio
•  Port USB 3.0 dédié
•  Processeur 64-bit (x64)
•  Carte graphique ave...
9
Jecommencemesrecherches
10
Enormémentderessourcessurlav1
11
1articleHelloWorld
12
Comment on code une interaction ?
Hold gesture.
13
DocumentationMicrosoft
14
Ok…c’estpasclair…
Commentonl’utilise?
15
Jecontinuemesrecherches…
1616
Çafaitunejournée
quejecherche…
17
Finalement,leforumMicrosoft
18
Eureka!
[…] will only provide you
the raw frame data from
the camera […]
19
FAIL!
20
DO IT
YOURSELF !
21
26 points
dans
l’espace
(x,y,z)
Quelles données on reçoit ?
22
x6 utilisateurs
2323
Toutesles
33millisecondes!
24
Implémentation de mon API
25
1er parti-pris.
Isoler un seul utilisateur.
2626
2727
varbody=trackBodyOn(x,xDepth,z,zDepth);
2828
varbody=trackBodyOn(0.5,0.2,1.0,0.1);
0.5 = 50%
1 mètre
2929
2e parti-pris.
(Droite ou Gauche)
Interaction avec une seule main
30
Exemple d’utilisation
3131
3e parti-pris. Drag & Drop.
32
Exemple d’utilisation
33
DisponiblesurGitHub
34
Démo.
3535
#github#ekino
ek-winjs-kinect
FEATURES
•  Windows 8 store ready to package with cordova
•  Target one player on speci...
36
Desquestions?
of 36

Kinect pour les développeurs Web

La technologie Kinect n’est pas nouvelle, elle avait beaucoup fait parler d’elle en 2010/2011. Microsoft ayant sorti sa nouvelle version dédiée à Windows en juillet 2014, où en sommes-nous aujourd’hui avec cette technologie ? Que peut-on faire et ne pas faire, notamment en choisissant la technologie HTML5 ? Fort d'une expérience réussie et après avoir développé une application disponible lors du salon de la lingerie via la Kinect, mais aussi sur le Web via la souris nous verrons lors de cette présentation tout les tenant et aboutissant pour réussir un projet Kinect HTML5.
Published on: Mar 3, 2016
Published in: Retail      
Source: www.slideshare.net


Transcripts - Kinect pour les développeurs Web

  • 1. 1 Kinectpourles développeurs Web.
  • 2. 22 Quisuisje? Développeur Front End #JavaScript #Angular #React #Cordova #Gulp/Grunt #Sass #Ionic @MeKimak @NewsDuFront Mickael Dumand
  • 3. 33 Génial, unnouveauprojet! 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’estpas nouveau!
  • 6. 66 LespossibilitésduSDK
  • 7. 7 Lechoix 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 Jecommencemesrecherches
  • 10. 10 Enormémentderessourcessurlav1
  • 11. 11 1articleHelloWorld
  • 12. 12 Comment on code une interaction ? Hold gesture.
  • 13. 13 DocumentationMicrosoft
  • 14. 14 Ok…c’estpasclair… Commentonl’utilise?
  • 15. 15 Jecontinuemesrecherches…
  • 16. 1616 Çafaitunejournée quejecherche…
  • 17. 17 Finalement,leforumMicrosoft
  • 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 DisponiblesurGitHub
  • 34. 34 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?

Related Documents