Dans cette session nous allons faire un retour d'expérience sur un projet Kinect : Publicité interactive. Nous montrerons le processus de création du projet en partant du Design pour allez jusqu'au graphisme et finir par le développement. Une bonne façon de montrer ce que Kinect apporte sur un cas concret.
2. Au cœur d’un projet
Kinect Innovant
Mardi 7 février 2012 – 16h00
Johanna Rowe
Designer Industriel – MVP Surface
Winwise
Nicolas Calvi
Consultant / Formateur – MVP Surface
Winwise
3. Winwise en chiffres : 9,5 M€, 70 collaborateurs, 800 clients qui nous font confiance.
Winwise a été créé en 1996 autour de 2 métiers:
- La Formation, centre agréé Microsoft
- Le Conseil
Et 3 types d’intervention chez nos clients:
- L’expertise
- L’accompagnement
- La réalisation de projets aux forfaits
Nos clients sont de tout secteur d’activité et sollicitent nos 5 domaines de compétences:
- Interfaces Riches et Naturelles
- Architecture
- Collaboratif
- Business Intelligence et Data Management
- Infrastructure
Tous nos collaborateurs sont certifiés sur les nouvelles technologies Microsoft.
4. Sommaire
Problématique de la publicité
Concept de l’application
Technologie Kinect
Problématique des gestuelles
Architecture de l’application
SDK Kinect en action
6. Publicité actuelle
Publicité trop classique Ad-blindness
Bannière web (non vues)
Affiches publicitaires classiques (non enregistrées par le cerveau)
Publicités ciblées (géolocalisation, personnalisation)
Placement produit (clip, émissions, film, ect.)
Publicité animés (Métro)
Street marketing
Jeux avec l’image de la marque
7. Publicité actuelle
Publicité Expérience négative avec la marque « ils me saoule
avec leur pub »
Trop = Inefficace
On ne voit plus
On ne retient plus
9. Nouveau Concept
Publicité Publicité
Expérience négative avec la Expérience positive avec la
marque « ils me saoule avec marque « J’ai fais un truc
leur pub » marrant avec la marque
iDTGV »
Marquer l’utilisateur au travers
d’une expérience ludique (drôle
ou non selon l’image de la
marque)
Le cerveau associe quelque
chose de positif à la marque
15. Technologie Kinect
Créer des interactions avec des
personnes et ce sans contacts avec un
périphérique.
- Reconnaissance de mouvement
- Reconnaissance vocale
16. Technologie Kinect
Le « Moteur » et la « LED »
Le moteur permet d’incliner Kinect
sur l’axe vertical afin de régler son
champs de vision,
La LED qui peut prendre 3 couleurs
(rouge, jaune et vert) est un
indicateur de statut.
17. Technologie Kinect
Le « Microphone Array »
4 Microphones qui permettent la
prise de son avec Kinect.
Cette structure permet de savoir
d’où provient le son.
18. Technologie Kinect
La « Caméra vidéo »
Permet la capture vidéo dans
différent format :
- 640x480 (en 15 et 30 FPS)
- 1280x960 (en 12 FPS)
19. Technologie Kinect
La « Projecteur Infrarouge »
C’est un capteur actif qui projette une
grille infrarouge qui servira à la détection
de profondeur.
20. Technologie Kinect
La « Caméra Infrarouge »
C’est elle qui capture la grille et permet
de renvoyer de informations de
profondeur (Depth sur 11 bits) dans
différent formats :
- 640x480 (en 30 FPS)
- 320x240 (en 30 FPS)
- 80x60 (en 30 FPS)
21. Technologie Kinect
La « Détection du squelette »
Permet de capter 6 personnes dans son
champs de vision :
- 2 personnes capté avec le squelette
entier.
- 4 personnes avec leurs centre de
gravité.
22. Technologie Kinect
SDK Kinect Commercial
Est un SDK développé par Microsoft
Research permettant de programmer
Kinect.
Un périphérique dédié avec une
meilleurs détection le mode « near »
24. Problématique des
gestuelles
Tactile Tout le corps
Beaucoup d’existant (études ergo) Pas d’existant (gestuelles)
Gestuelles identiques souvent Trouver les gestuelles naturelles
réutilisées (donc connues par les Des morphologies différentes
utilisateurs) Des manières de bouger différentes les
On pose le doigt sur l’interface unes des autres
directement Pas en situation de jeu
Le bout d’un doigt est toujours
identique
25. Problématique des
gestuelles
Pas d’API pour le faire
Composer avec les
aléas de la détection
Eliminer les
mouvements parasites
26. Problématique des
gestuelles
Gestuelle « Hello » :
Sur un intervalle donné (configurable)
On capte les différentes positions des points du
squelette et on en déduit les angles alpha et beta
Si ces angles sont dans un certain intervalle calculé
dynamiquement et qu’on a détecté un mouvement
on remonte la gestuelle
27. Problématique des
gestuelles
Gestuelle « Zen » et « sortie (S) »
Sur un intervalle donné (configurable)
On capte les différentes positions des points du
squelette et on en déduit les angles alpha, beta,
gamma et delta
Si ces angles sont dans un certain intervalle
calculé dynamiquement et que la pause est
tenue pendant un certain laps de temps on
remonte la gestuelle
28. Problématique des
gestuelles
Gestuelle « Clap » :
Dans un intervalle de temps donné (configurable)
On capte la position (X,Y,Z) des points et on en
déduit les distances d1 et d2
On vérifie que le corps est en face de Kinect® (d2
supérieur à une certaine valeur)
On Valide la position des poignets
On regarde si les poignets sont passés par plusieurs
états (écartés, quelconques, joints puis écartés)
34. SDK Kinect en action
Espace de nom « Microsoft.Kinect »
Récupérer une caméra et gérer son statut
private void InitializeKinect()
{
// On se branche sur le manager des senseurs
KinectSensor.KinectSensors.StatusChanged += new EventHandler<StatusChangedEventArgs>(this.KinectSensorsStatusChanged);
// Si il y en a déjà un, on l'ouvre
if (KinectSensor.KinectSensors.Count > 0)
this.OpenKinect(KinectSensor.KinectSensors.First());
}
private void KinectSensorsStatusChanged(object sender, StatusChangedEventArgs e)
{
if (e.Status == KinectStatus.Connected)
this.OpenKinect(e.Sensor);
else if (this._kinectSensor == e.Sensor)
this.CloseKinect();
}
private void OpenKinect(KinectSensor kinect)
{
this._kinectSensor = kinect;
// Initialisation
this._kinectSensor.Start();
}
35. SDK Kinect en action
Ouvrir le flux vidéo
this._kinectSensor.ColorStream.Enable(ColorImageFormat.RgbResolution640x480Fps30);
this._kinectSensor.ColorFrameReady += new EventHandler<ColorImageFrameReadyEventArgs>(this.KinectColorFrameReady);
Ouvrir le flux de profondeur
this._kinectSensor.DepthStream.Enable(DepthImageFormat.Resolution320x240Fps30);
this._kinectSensor.DepthFrameReady += new EventHandler<DepthImageFrameReadyEventArgs>(this.KinectDepthFrameReady);
Démarrer la détection des squelettes
// SmoothParamater pour éliminer le bruit
TransformSmoothParameters parameters = new TransformSmoothParameters
{
Correction = 1.0f,
JitterRadius = 0.01f,
MaxDeviationRadius = 0.01f,
Prediction = 1.0f,
Smoothing = 0.9f
};
this._kinectSensor.SkeletonStream.Enable(parameters);
this._kinectSensor.SkeletonFrameReady += new EventHandler<SkeletonFrameReadyEventArgs>(this.KinectSkeletonFrameReady);
Intercepter tous les événements d’un coup
this._kinectSensor.AllFramesReady += new EventHandler<AllFramesReadyEventArgs>(this.AllFramesReady);
36. SDK Kinect en action
Traiter une information de squelette
private void AllFramesReady(object sender, AllFramesReadyEventArgs e)
{
// On ouvre le buffer qui contient les informtions des squelettes
using (SkeletonFrame frame = e.OpenSkeletonFrame())
{
// On vérifie qu’il existe bien des informations exploitables
if (frame != null && frame.SkeletonArrayLength > 0)
{
// On copie les données récupérées par Kinect dans un buffer local
Skeleton[] skeletons = new Skeleton[frame.SkeletonArrayLength];
frame.CopySkeletonDataTo(skeletons);
// On ne prend que les squelettes qui sont en mode « tracés »
var result = from p in skeletons
where p.TrackingState == SkeletonTrackingState.Tracked
select p;
foreach (Skeleton item in result)
{
// … ici on fait le traitement …
}
}
}
}
37. SDK Kinect en action
Récupérer les points du corps (20 au total)
Plusieurs états : « Tracked », « Infered » et « NotTracked »
Convertir leurs coordonnées (X,Y,Z)
Faire les traitements adéquat, mais surtout faire des buffers de
points pour pouvoir a chaque frame, créer des algorithmes qui se
fondent sur une évolutions des positions dans le temps.
39. Contacts
Johanna Rowe
Blog : http://www.johannarowe.com/
Facebook : Design in Progress
Twitter : @johanna_rowe
Email : johanne.rowe@winwise.com
Nicolas Calvi
Blog : http://blog.nicolascalvi.com/
Facebook : Black Blog
Twitter : @nicolascalvi
Email : nicolas.calvi@winwise.com
40. Pour aller plus loin
Prochaines sessions des Dev Camps
Chaque semaine, les 10
Live Open Data - Développer des applications riches avec le
février
DevCamps 2012
16
Meeting protocole Open Data
ALM, Azure, Windows Phone, HTML5, OpenData février
Live
Meeting
Azure series - Développer des applications sociales sur
la plateforme Windows Azure
2012
http://msdn.microsoft.com/fr-fr/devcamp
17
Live Comprendre le canvas avec Galactic et la librairie
février
Meeting three.js
2012
Téléchargement, ressources 21
février
Live La production automatisée de code avec CodeFluent
Meeting Entities
et toolkits : RdV sur MSDN 2012
2 mars Live Comprendre et mettre en oeuvre le toolkit Azure pour
http://msdn.microsoft.com/fr-fr/ 2012 Meeting Windows Phone 7, iOS et Android
6 mars Live
Nuget et ALM
2012 Meeting
Les offres à connaître 9 mars
2012
Live
Meeting
Kinect - Bien gérer la vie de son capteur
90 jours d’essai gratuit de Windows 13 mars
2012
Live
Meeting
Sharepoint series - Automatisation des tests
Azure 14 mars Live TFS Health Check - vérifier la bonne santé de votre
www.windowsazure.fr 2012 Meeting plateforme de développement
15 mars Live Azure series - Développer pour les téléphones, les
2012 Meeting tablettes et le cloud avec Visual Studio 2010
Jusqu’à 35% de réduction sur Visual 16 mars Live Applications METRO design - Désossage en règle d'un
Studio Pro, avec l’abonnement MSDN 2012 Meeting template METRO javascript
20 mars Live Retour d'expérience LightSwitch, Optimisation de
www.visualstudio.fr 2012 Meeting l'accès aux données, Intégration Silverlight
23 mars Live OAuth - la clé de l'utilisation des réseaux sociaux dans
2012 Meeting votre application