Surface 2 SDK Refresh !

by Nicolas Calvi 10. février 2012 17:01

L'équipe Microsoft Surface vient de mettre à jour le SDK à destination de la Surface 2 et des périphériques tactiles compatible Windows 7 Touch.

Au programme pas de changement d'API, mais des corrections de bugs ainsi que le support complet des périphériques tactiles de type sérial.

Pour plus d'information et pour le télécharger, c'est par ici !

Webcast Aprés Midi du Développement

by Nicolas Calvi 12. janvier 2012 18:56

Vous pouvez regarder les Webcasts, mais aussi récupérer les sources et slides des Après Midi du Développement : Le Design d'application, qui a eu lieu au campus Microsoft.

Pour cela rendez-vous sur ce lien.

J'y intervient pour parler du cycle de vie d'une application tactile, mais aussi sur la programmation tactile avec WPF 4 et le Surface SDK 2.

Microsoft Surface 2 - Pré-commande ouvert

by Nicolas Calvi 18. novembre 2011 11:01

Ca y est on est plus très loin de la sortie officiel de la table Microsoft Surface 2. Tous les détails dans le lien ci-dessous :

http://blogs.msdn.com/b/surface/archive/2011/11/17/preorder.aspx

Microsoft Surface 5

SDK Surface 2 : Touch & Code

by Nicolas Calvi 26. juillet 2011 07:00

Je vais présenter dans cet article les premiers éléments de la programmation tactile à travers WPF 4 (dit WPF Touch) et le SDK Microsoft® Surface® 2.0. Pour bien comprendre ce qui va suivre, je vous conseille la lecture de mon dernier article sur les notions élémentaires pour la programmation tactile.

Pour commencer, parlons des événements de base de programmation tactile, à  savoir : juste toucher l’écran et démarrer une action suite à cette interaction. Cette partie est gérée par WPF 4 à travers un certain nombre d’événements (tous ces événements existent en version « Preview »). Ils sont disponibles sur l'ensemble des objets qui héritent de « UIElement » et on comme scope l’objet lui-même, ce sera important pour les derniers événements que je vais présenter. Voici la liste de ces événements :

TouchDown : Correspond au moment ou un contact s’initie sur le périphérique, en clair : on pose le doigt.

<Grid TouchDown="Grid_TouchDown">
</Grid>
private void Grid_TouchDown(object sender, TouchEventArgs e)
{        
    // Code de l’évènement
}

 

TouchMove : Correspond au déplacement du contact sur le périphérique, donc quand le doigt (toujours en contact avec le périphérique) bouge sur celui-ci, c’est cet évènement qui va tracer les informations du contact (position, orientation dans le cadre de Microsoft Surface 2.0) tout au long de sa vie.

<Grid TouchMove="Grid_TouchMove">
</Grid>
private void Grid_TouchMove(object sender, TouchEventArgs e)
{        
    // Code de l’évènement
}

 

TouchUp : Correspond à la fin du contact et informe donc qu’il n’existe plus sur le périphérique. C’est donc quand on lève le doigt du périphérique.

<Grid TouchUp="Grid_TouchUp">
</Grid>
private void Grid_TouchUp(object sender, TouchEventArgs e)
{        
    // Code de l’évènement
}

 

TouchEnter : Cet événement correspond au moment ou un contact entre dans la zone de rendu d’un objet, si le contact a été initié en dehors ou est sorti de la zone pour entrer à nouveau, c’est ce qui sera déclenché. 

<Grid TouchEnter="Grid_TouchEnter">
</Grid>
private void Grid_TouchEnter(object sender, TouchEventArgs e)
{        
    // Code de l’évènement
}

 

TouchLeave : Ce dernier événement fait l’inverse du « TouchEnter » à savoir qu’il informe de la sortie du contact de la zone de rendu du contrôle.

<Grid TouchLeave="Grid_TouchLeave">
</Grid>
private void Grid_TouchLeave(object sender, TouchEventArgs e)
{        
    // Code de l’évènement
}

 

Ces événements sont identiques à ceux de la souris, on peut donc les assimiler à la gestion de celle-ci lorsque l’on clic, le clic correspondant au « TouchDown ».

Tous ces événements génèrent dans leurs « Callback » un délégué avec comme argument une instance de la classe « TouchEventArgs » qui représente les informations du contact. Cet argument est particulièrement intéressant, car il va nous permettre de détecter les capacités de notre périphérique.

C’est là que notre SDK Microsoft Surface 2.0 va nous être utile. Il va étendre via des méthodes d’extensions les informations liées aux événements « Touch » de WPF 4. Pour cela, un peu comme pour les extensions « Linq » nous devons ajouter à notre classe la référence de l’assembly « Microsoft.Surface.Presentation.Input » ce qui va permettre d’étendre l’une des propriétés de « TouchEventArgs » à savoir le « TouchDevice ».

Le « TouchDevice » représente toutes les informations relatives au contact qui c’est produit sur le périphérique. Il va donc nous permettre de récupérer des informations diverses sur notre contact.

    

 

Quand on développe une interface tactile et que l’on ne connaît pas précisément le périphérique qui va exécuter l’application, on peut faire appel à la classe « InteractiveSurface.PrimarySurfaceDevice » qui permet de tester les capacités de celui-ci. Exemple de propriétés très utiles :

IsFingerRecognitionSupported : Permet de savoir si le périphérique est capable d’identifier la différence entre un doigt posé sur celle-ci ou un objet quelconque. La table Microsoft Surface 2.0 par exemple en est capable, mais si d’autres périphériques peuvent le faire, ils peuvent le signaler par cette fonction.

IsTagRecognitionSupported : Permet de savoir si le périphérique à la possibilité de reconnaitre des « Tags » (comme Microsoft Surface 2.0), le périphérique peut l’indiquer par cette fonction.

IsTiltSupported : Permet de savoir si le périphérique est inclinable (comme Microsoft Surface 2.0).

IsTouchOrientationSupported : Permet de savoir si le périphérique peut tracer l’orientation d’un contact sur celui-ci (comme Microsoft Surface 2.0), à savoir l’angle qu’il forme avec le point zéro de la zone tactile.

IsTouchBoundsSupported : Permet de savoir si le périphérique peut connaitre la surface de contact (comme Microsoft Surface 2.0), c’est-à-dire la forme et l’aire de ce qui touche le périphérique.

Si le périphérique supporte certaines de ces capacités, il est donc possible de faire appel à des fonctions d’extension du « TouchDevice » pour avoir cette information sur le contact en cours.

GetIsFingerRecognized() : Permet de savoir si le contact est un doigt ou non.

GetIsTagRecognized() : Permet de savoir si le contact est un « Tag ».

GetTagData() : Permet de récupérer la valeur du « Tag » posé sur le périphérique.

Juste avec ces fonctions on est donc capable d’adapter notre interface tactile et de prendre en compte des informations complémentaires. Il devient alors facile d’extraire les informations du contact et de les traiter.

private void Grid_TouchDown(object sender, TouchEventArgs e)
{
    if ( InteractiveSurface.PrimarySurfaceDevice.IsFingerRecognitionSupported && e.TouchDevice.GetIsFingerRecognized() )
    {
      // Détection d'un doigt
      // On effectue les traitements liés au doigt
    }

    if ( InteractiveSurface.PrimarySurfaceDevice.IsTagRecognitionSupported && e.TouchDevice.GetIsTagRecognized() )
    {
      // Récupération de la valeur

      var tagValue = e.TouchDevice.GetTagData();

      // Détection d'un tag
      // On effectue les traitements liés au tag
    }
}

Ensuite il y a les actions communes que l’on peut faire avec un contact, comme récupérer sa position :

// On récupère la position par 
// rapport à un élement graphique
// mettre NULL pour récupérer la 
// position par rapport au device

Point p = e.TouchDevice.GetPosition(this);

Avec ces primitives de base, vous êtes capable de créer des applications tactiles basiques en gérant les contacts simples. Dans un prochain billet je vous montrerais comment utiliser les manipulations (dites Gestuelles) dans votre application.

SDK Surface 2 : Notions élémentaires

by Nicolas Calvi 19. juillet 2011 07:00

Quand on développe avec le SDK Microsoft® Surface® 2.0, il est important de bien connaître les concepts de base de ce type de programmation. Je vais donc vous exposer ces concepts qu'il faut connaître pour bien appréhender ce genre de développement.


Qu’est-ce que le tactile ?


On parle de tactile pour « tout objet ou interface qui possède une interaction avec un ou plusieurs doigts ». Ce qui est intéressant avec cette définition c’est qu’on parle de doigt, or la plupart des périphériques tactiles ne font pas la différence entre un doigt et, par exemple, la paume de notre main. Pour ce type de périphérique un contact est un contact, peu importe sa forme et son volume.

Si je fais cette distinction c’est que le SDK Microsoft Surface 2.0 va nous permettre de faire cette différence, c’est-à-dire de nous donner les capacités de reconnaissance tactile du périphérique sur lequel on lance notre application. Il va nous permettre des interactions « tactiles » avec autre chose qu’un doigt ou une main, par exemple des objets et plus particulièrement des « Tags » si le périphérique le permet.

Si on schématise tout ça très grossièrement, on a quatre grandes familles de périphériques tactiles : Les écrans, les tablettes, les périphériques mobiles (comme un Windows Phone 7) et la table Microsoft Surface. Si je sépare la table Microsoft Surface des autres périphériques c’est que les interactions qui lui sont liées ainsi que ses capacités de reconnaissance sont différente par rapport à un écran tactile ou une tablette.

En effet, là ou un écran va se limiter à un contact simple, c’est-à-dire à une coordonnée (X,Y), la table Microsoft Surface va nous donner un peu plus d’information, à savoir si c’est un doigt, une forme qui n’est pas un doigt ou un Tag. Pour tous ces types de contacts, elle nous donnera aussi son orientation et si c’est un Tag, sa valeur numérique.

Au final, selon le périphérique que l’on utilise, les informations tactiles renvoyées par celui-ci sont différentes. On se rend bien compte qu’un périphérique comme la table Microsoft Surface fait office de « périphérique avancé » en termes de possibilité de reconnaissance tactile, mais toutes les applications tactiles n’ont pas besoin des mêmes capacités pour être utilisées.


Usages et expériences utilisateur


C’est à ce moment qu’on parle d’usages et que l’on doit mettre en parallèle le réel besoin de reconnaissance tactile avec les besoins des utilisateurs. Est-ce que le périphérique tactile est une table, accroché à mur ou sur un pupitre et incliné à 45 degrés ? C’est une question qui peut sembler anodine mais cela conditionne le type de périphérique que l’on va utiliser.

Prenons par exemple les bornes de commande rapide de chez Mc Donalds. L’interface est tactile et permet de choisir son menu pour ensuite le retirer au comptoir rapide. Ici pas besoin de reconnaissance de Tag ou utilité de faire des zooms sur les menus. En bref, un simple écran tactile à un contact suffit amplement.

Si nous devions créer une application bancaire pour un conseillé et un client, et si on souhaitait créer une relation entre ses personnes grâces au périphérique tactile, on ajouterait à ce moment une composante collaborative et multi-utilisateurs. Dans ce cas, une table Microsoft Surface serai mieux adaptée.

Je veux juste montrer par ses deux exemples qu’à chaque situation il y a son périphérique tactile adapté et que le plus couteux n’est pas forcément le plus approprié. Bien réfléchir à son support et aux usages est une partie importante de la réflexion sur nos interfaces, choses trop peu repandue de nos jours.

Si le sujet vous intéresse, je vous recommande le blog de Johanna Rowe, Designer Industriel et Interactif qui parle au travers de son blog « Design in Progress » de ces problématiques qui sont au final des problématiques de Design, n’étant pas Designer je ne fais là que vous amener sur le sujet.


Les gestuelles


Quand on fait du tactile on en arrive toujours à un élément essentiel qui sont les gestuelles. Les gestuelles représentent les actions que l’on fait sur le périphérique tactile avec ses doigts. Je vais vous expliquer les gestuelles les plus courantes, sachant qu’il existe une multitude de gestuelle en fonction des périphériques qui peuvent les interpréter.

Le « Touch » ou « Tap »

Cette gestuelle peut être décomposée en quatre actions bien distinctes. Concrètement cela consiste à poser son doigt sur le périphérique et de le relever. Cependant, comme une souris, on peut le décomposer.

Le « Touch Down » qui signifie poser son doigt sur le périphérique, le « Touch Move » qui signifie déplacer son doigt en contacte sur le périphérique et le « Touch Up » qui signifie relever son doigt du périphérique. Cela correspond un peu au « Mouse Down », « Mouse Move » et « Mouse Up ».

Ensuite il y a la notion de « Tap » qui s’apparente à un « Click » de la souris, à savoir le fait de poser et relevé son doigt au même endroit et dans un laps de temps court (moins d’une seconde).

Le « Hold » ou appuie continu

C’est en fait un « Tap » qui dure au moins 2 secondes et se déclenche avant que le doigt se relève. Donc on pose son doigt sur le périphérique, on attend et ça déclenche une action avant que le doigt ne se relève.

Le « Drag » ou déplacement

Cette gestuelle est le fait de déplacer son doigt sur le périphérique, afin de bouger un élément d’interaction ou de vouloir déclencher une action par ce geste par exemple. Cela s’apparente au « Drag’n Drop » avec la souris, mais là c’est avec votre doigt, cette gestuelle se termine si l’on retire son doigt du périphérique ou que le déplacement devient hors limite dans l’interface. Cette gestuelle élimine les périphériques qui ne sont pas capable de tracer un contact comme la technologie d’onde de surface.

L’étirement et le rétrécissement ou « Scale »

Cette gestuelle s’utilise avec au minimum deux doigts, ce qui élimine tous les périphériques tactiles qui ne sont pas multipoints et qui ne peuvent pas tracer un contact. Le but est de toucher deux parties distinctes du périphérique avec deux doigts et d’éloigner les doigts l’un de l’autre si l’on veut un agrandissement et de les rapprocher si l’on veut un rétrécissement. Très pratique pour le zoom sur des images par exemple.

   

Pour finir, il est important de comprendre qu'une application tactile reste une application NUI (Natural User Interface) et doit répondre à des normes en termes d'expérience utilisateur. Le fait de faire une application intuitive et ludique est toujours le fruit d'une profonde réflexion en début de projet. Le SDK Microsoft® Surface® 2.0 nous permet par contre de développer un code pour tous les périphériques, cependant il ne faut pas perdre de vue qu'un périphérique tactile s'utilise d'une certaine façon et qu'il faut souvent revoir le Design d'une application quand on la porte d'une tablette vers une table Microsoft Surface 2.0 par exemple.

Si vous devez concevoir une application Microsoft Surface 2.0, je vous conseil la lecture du "Microsoft® Surface® 2 Design and Interaction Guide".


Certifications

MVP

Microsoft Surface

MCTS

Microsoft .Net