Remarque
L’accès à cette page nécessite une autorisation. Vous pouvez essayer de vous connecter ou de modifier des répertoires.
L’accès à cette page nécessite une autorisation. Vous pouvez essayer de modifier des répertoires.
Note
Ce guide de conception a été créé pour Windows 7 et n’a pas été mis à jour pour les versions plus récentes de Windows. La plupart des conseils s’appliquent toujours en principe, mais la présentation et les exemples ne reflètent pas nos conseils de conception actuels.
Toutes les applications Microsoft Windows doivent avoir une expérience tactile exceptionnelle. Et la création d’une telle expérience est plus facile que vous ne le pensez.
L’interaction tactile fait référence à l’utilisation d’un ou plusieurs doigts pour fournir une entrée via un affichage d’appareil et interagir avec Windows et les applications. Une application tactile optimisée a un modèle d’interface utilisateur et d’interaction conçu pour prendre en charge les zones de contact plus grandes, moins précises du toucher, les différents facteurs de forme des appareils tactiles, et les nombreuses postures et poignées que les utilisateurs peuvent adopter lors de l’utilisation d’un appareil tactile.
tactiles
Chaque appareil d’entrée a ses forces. Le clavier est idéal pour l’entrée de texte et donne des commandes avec un mouvement de main minimal. La souris est idéale pour un pointage efficace et précis. L’interaction tactile est idéale pour la manipulation d’objets et pour donner des commandes simples. Un stylet est idéal pour l’expression libre, comme avec l’écriture manuscrite et le dessin.
Windows 8.1 est optimisé pour la réactivité, la précision et la facilité d’utilisation avec l’interaction tactile tout en prenant entièrement en charge les méthodes d’entrée traditionnelles (telles que la souris, le stylet et le clavier). La vitesse, la précision et les commentaires tactiles fournis par les modes d’entrée traditionnels sont familiers et attrayants pour de nombreux utilisateurs et potentiellement mieux adaptés à des scénarios d’interaction spécifiques.
Vous trouverez des instructions relatives à la souris, au stylet et à l’accessibilité dans des rubriques distinctes.
Lorsque vous réfléchissez à l’expérience d’interaction pour votre application :
Ne supposez pas que si une interface utilisateur fonctionne bien pour une souris, elle fonctionne également bien pour l’interaction tactile. Bien que la bonne prise en charge de la souris soit un début, une bonne expérience tactile a quelques exigences supplémentaires.
Supposons que si une interface utilisateur fonctionne bien pour un doigt, elle fonctionne également bien pour un stylet. Rendre votre application tactile va beaucoup pour fournir une bonne prise en charge du stylet. La principale différence est que les doigts ont une pointe plus émoussante, de sorte qu’ils ont besoin de cibles plus grandes.
Avec l’interaction tactile, vous pouvez manipuler directement des objets et de l’interface utilisateur, ce qui rend une expérience plus rapide, plus naturelle et attrayante.
Offrir une expérience tactile exceptionnelle
Vous devez vous assurer que les utilisateurs peuvent effectuer efficacement des tâches critiques et importantes à l’aide d’une entrée tactile. Toutefois, certaines fonctionnalités d’application, telles que la manipulation de texte ou de pixel, peuvent ne pas convenir à l’interaction tactile et peuvent être réservées pour l’appareil d’entrée le plus approprié.
Si vous n’avez pas beaucoup d’expérience dans le développement d’applications tactiles, il est préférable d’apprendre en faisant. Obtenez un ordinateur tactile, mettez la souris et le clavier de côté et utilisez uniquement vos doigts pour interagir avec votre application. Si vous avez une tablette, essayez de la tenir dans différentes positions, comme sur votre tour, mentant à plat sur une table, ou dans vos bras pendant que vous êtes debout. Essayez de l’utiliser dans l’orientation portrait et paysage.
Les applications optimisées tactiles qui fonctionnent le mieux avec l’interaction tactile sont généralement les suivantes :
- Naturel et intuitif. Les interactions sont conçues pour correspondre à la façon dont les utilisateurs interagissent avec des objets dans le monde réel.
- Moins intrusif. L’utilisation de l’interaction tactile est silencieuse, et par conséquent, beaucoup moins distrait que de taper ou de cliquer.
- Portatif. Les appareils tactiles sont plus compacts, car de nombreuses tâches peuvent être effectuées sans clavier, souris, stylet ou pavé tactile. Ils sont également plus flexibles, car une surface de travail n’est pas nécessaire.
- Direct et attrayant. L’interaction tactile vous fait sentir que vous manipulez directement des objets sur l’écran.
- Moins précis. Les utilisateurs ne peuvent pas cibler les objets avec précision avec l’interaction tactile, par rapport à une souris ou un stylet.
L’interaction tactile offre une sensation naturelle et réelle d’interaction. La manipulation directe et l’animation terminent cette impression en donnant aux objets un mouvement réaliste, dynamique et des commentaires. Par exemple, considérez un jeu de cartes. Non seulement il est pratique et facile de faire glisser des cartes à l’aide d’un doigt, l’expérience prend une sensation réelle attrayante lorsque vous pouvez tosser, glisser et tourner les cartes comme vous le feriez un jeu physique. Et quand vous essayez de déplacer une carte qui ne peut pas être déplacée, il est préférable d’avoir la carte à résister, mais pas d’empêcher le mouvement, et de s’installer en place lorsqu’elle est libérée, pour indiquer clairement que l’action a été reconnue mais ne peut pas être effectuée.
Heureusement, si votre application est déjà bien conçue, fournir une expérience tactile exceptionnelle est facile à faire. À cet effet, un programme bien conçu :
- Garantit que les tâches les plus importantes peuvent être effectuées efficacement à l’aide d’un doigt (au moins les tâches qui n’impliquent pas beaucoup de manipulation de pixels).
- Utilise des contrôles volumineux pour l’interaction tactile. Les contrôles courants ont une taille minimale de 23 x 23 pixels (13 x 13 DTU) et les contrôles les plus couramment utilisés sont au moins 40 x 40 pixels (23 x 22 DTU). Pour éviter un comportement sans réponse, les éléments d’interface utilisateur doivent avoir au moins 5 pixels (3 DLU) d’espace entre eux. Pour les autres contrôles, assurez-vous qu’ils ont au moins une cible de clic de 23 x 23 pixels (13 x 13 DLU), même si leur apparence statique est beaucoup plus petite. Consultez le dimensionnement de contrôle standard.
- Prend en charge l’entrée de la souris. Les contrôles interactifs ont des affordances claires et visibles. Les objets ont des comportements standard pour les interactions standard de la souris (simple et double-cliquez à gauche, cliquez avec le bouton droit, faites glisser et pointez).
- Prend en charge l’entrée du clavier. L’application fournit des affectations de touches de raccourci standard, en particulier pour les commandes de navigation et de modification qui peuvent également être générées par le biais de mouvements tactiles.
- Garantit l’accessibilité. Utilise UI Automation ou Microsoft Active Accessibility (MSAA) pour fournir un accès programmatique à l’interface utilisateur pour les technologies d’assistance. L’application répond de manière appropriée aux modifications apportées à l’orientation, au thème, aux paramètres régionaux et aux métriques système.
- Élimine les interactions inutiles. Pour éviter toute perte d’accès aux données ou au système, utilisez les valeurs par défaut les plus sécurisées et les plus sécurisées. Si la sécurité et la sécurité ne sont pas des facteurs, l’application sélectionne l’option la plus probable ou la plus pratique.
- Fournit l’équivalent tactile pour le pointage. Ne vous fiez pas au pointage comme seule façon d’effectuer une action.
- Garantit que les mouvements prennent effet immédiatement. Conservez les points de contact sous les doigts de l’utilisateur en douceur tout au long du mouvement, ce qui fournit l’effet du mappage de mouvement directement au mouvement de l’utilisateur.
- Utilise des mouvements standard chaque fois que cela est possible. Mouvements personnalisés uniquement pour les interactions propres à votre application.
- Garantit que les commandes non souhaitées ou destructrices peuvent être inversées ou corrigées. Les actions accidentelles sont plus probables lors de l’utilisation de l’interaction tactile.
Recommandations en matière d’entrée tactile
Avec l’interaction tactile, votre application Windows peut utiliser des mouvements physiques pour émuler la manipulation directe des éléments d’interface utilisateur.
Tenez compte de ces bonnes pratiques lors de la conception de votre application tactile :
La réactivité est essentielle pour créer des expériences tactiles qui se sentent directes et attrayantes. Pour se sentir direct, les mouvements doivent prendre effet immédiatement, et les points de contact d’un objet doivent rester sous les doigts de l’utilisateur en douceur tout au long du mouvement. L’effet de l’entrée tactile doit être mappé directement au mouvement de l’utilisateur. Par exemple, si l’utilisateur fait pivoter ses doigts de 90 degrés, l’objet doit également faire pivoter 90 degrés. Tout retard, réponse hachée, perte de contact ou résultats incorrects détruit la perception de la manipulation directe et aussi de la qualité.
La cohérence est essentielle pour créer des expériences tactiles qui se sentent naturelles et intuitives. Une fois que les utilisateurs ont appris un mouvement standard, ils s’attendent à ce que ce mouvement ait le même effet sur toutes les applications. Pour éviter la confusion et la frustration, n’attribuez jamais de significations non standard aux mouvements standard. Utilisez plutôt des mouvements personnalisés pour les interactions propres à votre programme.
Ensuite, nous allons décrire la langue tactile Windows, mais avant de passer, voici une courte liste de termes d’entrée tactile de base.
mouvement
Un mouvement est l’acte physique ou le mouvement effectué sur, ou par, l’appareil d’entrée (doigt, doigts, stylet/stylet, souris, etc.). Par exemple, pour lancer, activer ou appeler une commande, vous utilisez un seul appui doigt pour un appareil tactile ou pavé tactile (équivalent à un clic gauche avec une souris, un appui avec un stylet ou Entrer sur un clavier).
manipulation
Une manipulation est la réaction en temps réel ou la réponse immédiate d’un objet ou d’une interface utilisateur à un mouvement. Par exemple, les mouvements de diapositive et de balayage entraînent généralement un déplacement d’un élément ou d’une interface utilisateur d’une certaine manière.
Le résultat final d’une manipulation, la façon dont elle est manifeste par l’objet à l’écran et dans l’interface utilisateur, est l’interaction.
interaction
Les interactions dépendent de la façon dont une manipulation est interprétée et de la commande ou de l’action qui résulte de la manipulation. Par exemple, les objets peuvent être déplacés à l’aide des mouvements de diapositive et de balayage, mais les résultats diffèrent selon qu’un seuil de distance est franchi. La diapositive peut être utilisée pour faire glisser un objet ou un panoramique d’une vue tandis que le balayage peut être utilisé pour sélectionner un élément ou afficher une barre d’application.
Langue tactile Windows
Windows fournit un ensemble concis d’interactions tactiles utilisées dans tout le système. L’application de ce langage tactile rend votre application familière à ce que les utilisateurs connaissent déjà. Cela augmente la confiance des utilisateurs en rendant votre application plus facile à apprendre et à utiliser. Pour en savoir plus sur l’implémentation du langage tactile, consultez Mouvements, manipulations et interactions.
appuyez longuement pour apprendre
Le mouvement d’appui et de suspension affiche des informations détaillées ou des visuels d’enseignement (par exemple, une info-bulle ou un menu contextuel) sans valider une action ou une commande. Le mouvement panoramique est toujours possible si un mouvement glissant est démarré pendant l’affichage du visuel.
Important
Vous pouvez utiliser la touche appuyez et maintenez la touche enfoncée pour la sélection dans les cas où le panoramique horizontal et vertical est activé.
État d’entrée : un ou deux doigts en contact avec l’écran.
Motion : Pas de motion.
État de sortie : le dernier doigt se termine par le mouvement.
Effet : afficher plus d’informations.
Mouvement d’appui et de mise en attente.
pointage
Le pointage est une interaction utile, car il permet aux utilisateurs d’obtenir des informations supplémentaires via des conseils avant de lancer une action. L’affichage de ces conseils rend les utilisateurs plus confiants et réduit les erreurs.
Malheureusement, le pointage n’est pas pris en charge par les technologies tactiles, de sorte que les utilisateurs ne peuvent pas pointer lors de l’utilisation d’un doigt. La solution simple à ce problème consiste à tirer pleinement parti du pointage, mais uniquement de manière à ne pas être nécessaire pour effectuer une action. Dans la pratique, cela signifie généralement que l’action peut également être effectuée en cliquant, mais pas nécessairement de la même façon.
Dans cet exemple, les utilisateurs peuvent voir la date du jour en pointant ou en cliquant dessus.
Appuyez pour l’action principale
L’appui sur un élément appelle son action principale, par exemple le lancement d’une application ou l’exécution d’une commande.
État de l’entrée : un doigt en contact avec l’écran ou le pavé tactile et levé avant le seuil de temps d’une interaction d’appui et de suspension se produit.
Motion : Pas de motion.
État de sortie : le doigt se termine par le mouvement.
Effet : lancez une application ou exécutez une commande.
Mouvement d’appui.
Diapositive à panoramique
La diapositive est principalement utilisée pour les interactions panoramiques, mais peut également être utilisée pour déplacer (où le mouvement panoramique est limité à une direction), le dessin ou l’écriture. La diapositive peut également être utilisée pour cibler des éléments petits et denses en effectuant un nettoyage (glisser le doigt sur des objets connexes tels que des cases d’option).
État d’entrée : un ou deux doigts en contact avec l’écran.
Mouvement : faites glisser, avec tous les doigts supplémentaires restant dans la même position par rapport à l’autre.
État de sortie : le dernier doigt se termine par le mouvement.
Effet : déplacez l’objet sous-jacent directement et immédiatement à mesure que les doigts se déplacent. Veillez à garder le point de contact sous le doigt tout au long du mouvement.
Mouvement panoramique.
Balayez pour sélectionner, commander et déplacer
Le glissement du doigt à une courte distance, perpendiculaire à la direction de mouvement panoramique (où le mouvement panoramique est limité à une direction), sélectionne les objets dans une liste ou une grille. Affichez la barre d’application avec des commandes pertinentes lorsque les objets sont sélectionnés.
État d’entrée : un ou plusieurs doigts touchent l’écran.
Mouvement : faites glisser une courte distance avant le seuil de distance d’une interaction de déplacement.
État de sortie : le dernier doigt se termine par le mouvement.
Effet : l’objet sous-jacent est sélectionné ou déplacé ou la barre d’application s’affiche. Veillez à garder le point de contact sous le doigt tout au long du mouvement.
Mouvement de balayage.
Pincer et étirer pour effectuer un zoom
Les mouvements de pincement et d’étirement sont utilisés pour trois types d’interactions : zoom optique, redimensionnement et zoom sémantique.
Le zoom optique ajuste le niveau d’agrandissement de la zone de contenu entière pour obtenir une vue plus détaillée du contenu. En revanche, le redimensionnement est une technique permettant d’ajuster la taille relative d’un ou plusieurs objets d’une zone de contenu sans modifier la vue dans la zone de contenu.
Le zoom sémantique est une technique optimisée tactile pour présenter et parcourir des données structurées ou du contenu au sein d’une vue unique (par exemple, la structure de dossiers d’un ordinateur, une bibliothèque de documents ou un album photo) sans avoir besoin de panoramique, de défilement ou de contrôles d’arborescence. Le zoom sémantique fournit deux vues différentes du même contenu en vous permettant de voir plus de détails au fur et à mesure que vous effectuez un zoom arrière.
État d’entrée : deux doigts en contact avec l’écran en même temps.
Mouvement : les doigts s’écartent (étirement) ou ensemble (pincer) le long d’un axe.
État de sortie : tout doigt vers le haut termine le mouvement.
Effet : effectuez un zoom avant ou arrière sur l’objet sous-jacent directement et immédiatement à mesure que les doigts séparent ou approchent sur l’axe. Veillez à garder les points de contact sous le doigt tout au long du mouvement.
Mouvement de zoom.
Tourner pour faire pivoter
La rotation avec deux doigts ou plus entraîne une rotation d’un objet. Faites pivoter l’appareil lui-même pour faire pivoter l’écran entier.
État d’entrée : deux doigts en contact avec l’écran en même temps.
Mouvement : un ou les deux doigts tournent autour de l’autre, se déplaçant perpendiculairement à la ligne entre eux.
État de sortie : tout doigt vers le haut termine le mouvement.
Effet : faire pivoter l’objet sous-jacent de la même quantité que les doigts ont pivoté. Veillez à garder les points de contact sous le doigt tout au long du mouvement.
Mouvement de rotation.
La rotation n’est logique que pour certains types d’objets, de sorte qu’elle n’est pas mappée à une interaction Windows système.
La rotation est souvent effectuée différemment par différentes personnes. Certaines personnes préfèrent faire pivoter un doigt autour d’un doigt pivot, tandis que d’autres préfèrent faire pivoter les deux doigts dans un mouvement circulaire. La plupart des gens utilisent une combinaison des deux, avec un doigt se déplaçant plus que l’autre. Bien que la rotation lisse vers n’importe quel angle soit la meilleure interaction, dans de nombreux contextes, tels que l’affichage photo, il est préférable de s’installer à la rotation de 90 degrés la plus proche une fois que l’utilisateur se laisse aller. En modification de photo, vous pouvez utiliser une petite rotation pour redresser la photo.
Balayez à partir de la périphérie pour les commandes d’application
Le balayage du doigt à une courte distance du bord inférieur ou supérieur de l’écran révèle les commandes de l’application dans une barre d’application.
État d’entrée : un ou plusieurs doigts touchent la lunette.
Mouvement : faites glisser une courte distance sur l’écran et liftez.
État de sortie : le dernier doigt se termine par le mouvement.
Effet : la barre d’application s’affiche.
Mouvement de balayage à partir du bord.
Développeurs : Pour plus d’informations, consultez DIRECTMANIPULATION_CONFIGURATION énumération.
Contrôler l’utilisation
Ici, nous fournissons quelques instructions pour optimiser les contrôles pour l’utilisation tactile.
- Utilisez des contrôles courants. Les contrôles les plus courants sont conçus pour prendre en charge une bonne expérience tactile.
- Choisissez des contrôles personnalisés conçus pour prendre en charge l’interaction tactile. Vous pouvez avoir besoin de contrôles personnalisés pour prendre en charge les expériences spéciales de votre programme. Choisissez des contrôles personnalisés qui :
- Peut être dimensionné suffisamment grand pour faciliter le ciblage et la manipulation.
- Lorsqu’ils sont manipulés, déplacez et réagissez de la façon dont les objets réels se déplacent et réagissent, par exemple en ayant un élan et une friction.
- Sont pardonnant en permettant aux utilisateurs de corriger facilement les erreurs.
- Ne manquez pas d’inexactitude en cliquant et en faisant glisser. Les objets qui sont supprimés près de leur destination doivent se trouver au bon endroit.
- Faites des commentaires visuels clairs lorsque le doigt est sur le contrôle.
- Utilisez des contrôles contraints. Les contrôles contraints tels que les listes et les curseurs, lorsqu’ils sont conçus pour un ciblage tactile facile, peuvent être mieux que les contrôles sans contrainte comme les zones de texte, car ils réduisent la nécessité d’une entrée de texte.
- Fournissez les valeurs par défaut appropriées. Sélectionnez l’option la plus sûre (pour éviter la perte de données ou d’accès au système) et l’option la plus sécurisée par défaut. Si la sécurité et la sécurité ne sont pas des facteurs, sélectionnez l’option la plus probable ou la plus pratique, ce qui élimine les interactions inutiles.
- Fournissez la saisie semi-automatique du texte. Fournit une liste de valeurs les plus probables, ou les valeurs d’entrée les plus récentes, pour faciliter considérablement l’entrée de texte.
- Pour les tâches importantes qui utilisent plusieursde sélection, si une liste de sélection multiples standard est normalement utilisée, fournissez une option permettant d’utiliser une liste de cases à cocher à la place.
Tailles de contrôle et ciblage tactile
En raison de la grande surface du bout des doigts, les petits contrôles trop proches peuvent être difficiles à cibler précisément.
En règle générale, une taille de contrôle de 23 x 23 pixels (13 x 13 DTU) est une bonne taille de contrôle interactive minimale pour n’importe quel appareil d’entrée. En revanche, les contrôles de rotation à 15 x 11 pixels sont beaucoup trop petits pour être utilisés efficacement avec l’interaction tactile.
N’oubliez pas que la taille minimale est vraiment basée sur une zone physique, et non sur des métriques de disposition telles que des pixels ou des DLL. La recherche indique que la zone cible minimale pour une interaction efficace et précise à l’aide d’un doigt est de 6 x 6 millimètres (mm). Cette zone se traduit par des métriques de disposition comme suit :
| Police | Millimètres | Pixels relatifs | DTU |
|---|---|---|---|
| 9 points d’interface utilisateur Segoe | 6x6 | 23x23 | 13x13 |
| 8 points Tahoma | 6x6 | 23x23 | 15x14 |
En outre, la recherche montre qu’une taille minimale de 10 x 10 mm (environ 40 x 40 pixels) permet une meilleure vitesse et précision, et se sent également plus confortable pour les utilisateurs. En pratique, utilisez cette plus grande taille pour les boutons de commande utilisés pour les commandes les plus importantes ou fréquemment utilisées.
L’objectif n’est pas d’avoir des contrôles géants, seulement ceux qui sont facilement utilisés avec le toucher.
Dans cet exemple, Microsoft Word utilise des boutons de plus de 10 x 10 mm pour les commandes les plus importantes.
Cette version de Calculatrice utilise des boutons de plus de 10 x 10 mm pour ses commandes les plus fréquemment utilisées.
Il n’y a pas de taille parfaite pour les cibles tactiles. Différentes tailles fonctionnent pour différentes situations. Les actions avec des conséquences graves (telles que la suppression et la fermeture) ou les actions fréquemment utilisées doivent utiliser de grandes cibles tactiles. Les actions rarement utilisées avec des conséquences mineures peuvent utiliser de petites cibles.
Recommandations en matière de taille cible pour les contrôles personnalisés
| Guide de taille | Description |
|---|---|
|
7 x 7 mm : taille minimale recommandée 7 x 7 mm est une bonne taille minimale si vous touchez la cible incorrecte peut être corrigée en un ou deux mouvements ou dans un délai de cinq secondes. Le remplissage entre les cibles est tout aussi important que la taille de la cible. |
|
Lorsque l’exactitude importe Fermer, supprimer et autres actions avec des conséquences graves ne peut pas se permettre des appuis accidentels. Utilisez des cibles de 9 x 9 mm si vous touchez la cible incorrecte nécessite plus de deux mouvements, cinq secondes ou une modification de contexte majeure à corriger. |
|
Quand il ne s’adapte pas Si vous vous trouvez à craqueter des choses à ajuster, il est possible d’utiliser des cibles de 5 x 5 mm tant que toucher la cible incorrecte peut être corrigée avec un geste. L’utilisation de 2 mm de remplissage entre les cibles est extrêmement importante dans ce cas. |
Recommandations en matière de taille cible pour les contrôles courants
Pour les contrôles courants, utilisez les tailles de contrôle recommandées. Le dimensionnement de contrôle recommandé satisfait à la taille minimale de 23 x 23 pixels (13 x 13 DLU), à l’exception des cases à cocher et des cases d’option (leur largeur de texte compense un peu), les contrôles spin (qui ne sont pas utilisables avec l’interaction tactile, mais sont redondants) et les séparateurs.
Les tailles de contrôle recommandées sont facilement tactiles.
Pour les boutons de commande utilisés pour les commandes les plus importantes ou fréquemment utilisées, utilisez une taille minimale de 40 x 40 pixels (23 x 22 DTU) chaque fois que cela est pratique. Cela donne une meilleure vitesse et précision, et se sent également plus à l’aise pour les utilisateurs.
Chaque fois que cela est pratique, utilisez des boutons de commande plus volumineux pour les commandes importantes ou fréquemment utilisées.
Pour d’autres contrôles :
Utilisez des cibles de clic plus volumineuses. Pour les petits contrôles, faites en sorte que la taille cible soit supérieure à l’élément d’interface utilisateur visible statiquement. Par exemple, les boutons d’icône de 16 x 16 pixels peuvent avoir un clic de 23 x 23 pixels sur les boutons cibles, et les éléments de texte peuvent avoir des rectangles de sélection de 8 pixels plus larges que le texte et 23 pixels de haut.
C’est bien ça:
Incorrect:
C’est bien ça:
Dans les exemples corrects, les cibles de clic sont supérieures aux éléments d’interface utilisateur visibles statiquement.
Utilisez des cibles de clic redondantes. Il est acceptable que les cibles de clic soient inférieures à la taille minimale si ce contrôle dispose de fonctionnalités redondantes.
Par exemple, les triangles de divulgation progressive utilisés par le contrôle d’arborescence ne sont que 6 x 9 pixels, mais leurs fonctionnalités sont redondantes avec leurs étiquettes d’élément associées.
Les triangles d’arborescence sont trop petits pour être facilement tactiles, mais ils sont redondants dans les fonctionnalités avec leurs étiquettes associées plus grandes.
Respectez les métriques système. Ne codez pas en dur les tailles. Si nécessaire, les utilisateurs peuvent modifier les métriques système ou les ppp pour répondre à leurs besoins. Toutefois, traitez-le comme un dernier recours, car les utilisateurs ne doivent pas normalement avoir à ajuster les paramètres système pour rendre l’interface utilisateur utilisable.
Dans cet exemple, la métrique système pour la hauteur du menu a été modifiée.
Modification du texte
La modification de texte est l’une des interactions les plus difficiles lors de l’utilisation d’un doigt. À l’aide de contrôles contraints, les valeurs par défaut appropriées et la saisie semi-automatique éliminent ou réduisent la nécessité d’entrer du texte. Toutefois, si votre application implique de modifier du texte, vous pouvez rendre les utilisateurs plus productifs en zoomant automatiquement sur l’interface utilisateur d’entrée jusqu’à 150 % par défaut lorsque l’interaction tactile est utilisée.
Par exemple, un programme de messagerie peut afficher l’interface utilisateur à une taille tactile normale, mais zoomer sur l’interface utilisateur d’entrée à 150 pour cent pour composer des messages.
capture d’écran 
Dans cet exemple, l’interface utilisateur d’entrée est zoomée sur 150 %.
Contrôler la disposition et l’espacement
L’espacement entre les contrôles est un facteur important pour rendre les contrôles facilement tactiles. Le ciblage est plus rapide mais moins précis lors de l’utilisation d’un doigt comme appareil pointant, ce qui permet aux utilisateurs d’appuyer plus souvent en dehors de leur cible prévue. Lorsque les contrôles interactifs sont placés très près, mais ne sont pas réellement tactiles, les utilisateurs peuvent cliquer sur l’espace inactif entre les contrôles. Étant donné que le fait de cliquer sur un espace inactif n’a aucun résultat ou commentaires visuels, les utilisateurs sont souvent incertains de ce qui s’est passé.
Ajustez dynamiquement l’espacement en fonction de l’appareil d’entrée utilisé. Cela est particulièrement utile avec l’interface utilisateur temporaire, comme les menus et les menus volants.
Fournissez au minimum 5 pixels (3 DTU) d’espace entre les régions cibles des contrôles interactifs. Si les petits contrôles sont trop espacés, l’utilisateur doit appuyer avec précision pour éviter d’appuyer sur l’objet incorrect.
Rendre les contrôles au sein des groupes plus faciles à différencier en utilisant plus que l’espacement vertical recommandé entre les contrôles. Par exemple, les cases d’option à 19 pixels de haut sont plus courtes que la taille minimale recommandée de 23 pixels. Lorsque vous disposez d’un espace vertical, vous pouvez obtenir à peu près le même effet que le dimensionnement recommandé en ajoutant un espacement supplémentaire de 4 pixels aux 7 pixels standard.
C’est bien ça:
Mieux:
Dans le meilleur exemple, l’espacement supplémentaire entre les cases d’option les rend plus faciles à différencier.
Il peut arriver que l’espacement supplémentaire soit souhaitable lors de l’utilisation de l’interaction tactile, mais pas lors de l’utilisation de la souris ou du clavier. Dans ce cas, utilisez uniquement une conception plus spacieuse lorsqu’une action est lancée à l’aide de l’interaction tactile.
Choisissez une disposition qui place les contrôles proches de l’endroit où ils seront probablement utilisés. Conservez les interactions entre les tâches dans une petite zone dans la mesure du possible et localisez les contrôles près de l’endroit où ils seront probablement utilisés. Évitez les mouvements de main de longue distance, en particulier pour les tâches courantes et pour les glissements.
Considérez que l’emplacement actuel du pointeur est le plus proche qu’une cible puisse être, ce qui en fait trivial d’acquérir. Ainsi, les menus contextuels tirent pleinement parti de la loi de Fitts, comme le font les mini-barres d’outils utilisées par Microsoft Office.
Évitez de placer de petits contrôles près du bord de l’application ou de l’affichage. Les petites cibles proches des bords peuvent être difficiles à toucher (les lunettes d’affichage peuvent interférer avec les mouvements de bord). Pour vous assurer que les contrôles sont faciles à cibler lorsqu’une fenêtre est agrandie, faites-les au moins 23 x 23 pixels (13 x 13 DTU) ou placez-les à l’écart du bord de la fenêtre.
Utilisez l’espacement recommandé. L’espacement recommandé est convivial. Toutefois, si votre application peut tirer parti d’un dimensionnement et d’un espacement plus volumineux, tenez compte du dimensionnement et de l’espacement recommandés pour être minimal, le cas échéant.
Fournissez au moins 5 pixels (3 DTU) d’espace entre les contrôles interactifs. Cela empêche toute confusion lorsque les utilisateurs appuient en dehors de leur cible prévue.
Envisagez d’ajouter plus que l’espacement vertical recommandé dans des groupes de contrôles, tels que des liens de commande, des cases à cocher et des cases d’option, ainsi qu’entre les groupes. Cela les rend plus faciles à différencier.
Envisagez d’ajouter plus que l’espacement vertical recommandé dynamiquement lorsqu’une action est lancée à l’aide de l’interaction tactile. Cela facilite la différenciation des objets, mais sans prendre plus d’espace lors de l’utilisation d’un clavier ou d’une souris. Augmentez l’espacement par un tiers de sa taille normale ou au moins 8 pixels.
Dans cet exemple, les listes de raccourcis de barre des tâches Windows 7 sont plus spacieuses lorsqu’elles sont affichées à l’aide de l’interaction tactile.
Interaction
L’utilisation des contrôles appropriés vous permet d’utiliser uniquement une application tactile optimisée, vous devez également prendre en compte le modèle d’interaction global pris en charge par ces contrôles. Voici quelques recommandations pour vous aider à ce sujet.
Placez le pointage redondant. Le pointage n’est pas pris en charge par la plupart des technologies tactiles, de sorte que les utilisateurs dotés de tels écrans tactiles ne peuvent pas effectuer de tâches nécessitant un pointage.
Pour les applications qui ont besoin d’une entrée de texte, intégrez entièrement la fonctionnalité clavier tactile par :
- Fournir les valeurs par défaut appropriées pour l’entrée utilisateur.
- Fournir des suggestions de saisie semi-automatique le cas échéant.
Note
Développeurs : Pour plus d’informations sur l’intégration du clavier tactile, consultez ITextInputPanel.
Autoriser les utilisateurs à zoomer sur l’interface utilisateur du contenu si votre programme a des tâches qui nécessitent la modification du texte. Envisagez de zoomer automatiquement sur 150 % lorsque l’interaction tactile est utilisée.
Fournissez un panoramique fluide, réactif et un zoom partout où cela est approprié. Redessinez rapidement après un panoramique ou un zoom pour rester réactif. Cela est nécessaire pour faire en sorte que la manipulation directe se sente vraiment directe.
Pendant un panoramique ou un zoom, assurez-vous que les points de contact restent sous le doigt tout au long du mouvement. Sinon, le panoramique ou le zoom est difficile à contrôler.
Étant donné que les mouvements sont mémorisés, affectez-leur des significations cohérentes entre les applications. Ne donnez pas de significations différentes aux mouvements avec une sémantique fixe. Utilisez plutôt un mouvement spécifique à l’application approprié.
Pardon
La manipulation directe rend le toucher naturel, expressif, efficace et attrayant. Toutefois, là où il y a une manipulation directe, il peut y avoir une manipulation accidentelle et donc la nécessité de pardonner.
Pardon est la capacité à inverser ou corriger facilement une action non souhaitée. Vous apportez une expérience tactile qui vous permet d’annuler, de donner de bons commentaires visuels, d’avoir une séparation physique claire entre les commandes fréquemment utilisées et les commandes destructrices, et permettant aux utilisateurs de corriger facilement les erreurs. Associée au pardon, vous empêchez les actions non souhaitées de se produire en premier lieu, ce que vous pouvez faire à l’aide de contrôles et de confirmations limités pour les actions ou commandes risquées qui ont des conséquences inattendues.
Fournissez une commande Annuler. Il est préférable de fournir un moyen simple d’annuler toutes les commandes, mais votre application peut avoir certaines commandes dont l’effet ne peut pas être annulé.
Chaque fois que cela est pratique, fournissez de bons commentaires sur le doigt vers le bas, mais n’effectuez pas d’actions jusqu’au haut du doigt. Cela permet aux utilisateurs de corriger les erreurs avant de les faire.
Chaque fois que cela est pratique, permettre aux utilisateurs de corriger facilement les erreurs. Si une action prend effet sur le doigt vers le haut, autorisez les utilisateurs à corriger les erreurs en glissant pendant que le doigt est toujours vers le bas.
Chaque fois que cela est pratique, indiquez qu’une manipulation directe ne peut pas être effectuée en résistant au mouvement. Autoriser le mouvement à se produire, mais que l’objet se rétablit en place lorsqu’il est libéré pour indiquer clairement que l’action a été reconnue, mais ne peut pas être effectuée.
Disposez d’une séparation physique claire entre les commandes fréquemment utilisées et les commandes destructrices. Sinon, les utilisateurs peuvent toucher accidentellement des commandes destructrices. Une commande est considérée comme destructrice si son effet est répandu et qu’il ne peut pas être facilement annulé ou l’effet n’est pas immédiatement visible.
Confirmez les commandes pour les actions ou commandes à risque qui ont des conséquences inattendues. Utilisez une boîte de dialogue de confirmation à cet effet.
Envisagez de confirmer toutes les autres actions que les utilisateurs ont tendance à effectuer accidentellement lors de l’utilisation de l’interaction tactile, et qui passent inaperçues ou sont difficiles à annuler. Normalement, ils sont appelés confirmations de routine et sont déconseillés en fonction de l’hypothèse que les utilisateurs n’émettent pas souvent de telles commandes par accident avec une souris ou un clavier. Pour éviter les confirmations inutiles, présentez ces confirmations uniquement si la commande a été lancée à l’aide de l’interaction tactile.
Les confirmations de routine sont acceptables pour les interactions que les utilisateurs font souvent accidentellement à l’aide de l’interaction tactile.
Développeurs : vous pouvez faire la distinction entre les événements de souris et les événements tactiles à l’aide de l’API INPUT_MESSAGE_SOURCE.