conseil en ergonomie
conseil en design UX
architecture de l'information
icone conception UX design

La conception tactile est une spécificité des techniques de conception UX design.
Découvrez des exemples illustrés et des ressources pour concevoir vos interfaces tactiles.
Des modèles de conception d'UX tactile et une formation en ligne sont disponibles en accès payant.

Concevoir l'UX pour les écrans tactiles

Révisé en Mars 2021

Expérience tactile

conception tactile

La conception d'interface tactile privilégie une expérience d'utilisation simplifiée et fluide adaptée à une interaction manuelle directe. L'expérience utilisateur tactile (UX tactile) considère le contexte d'utilisation, le terminal numérique utilisé, et la bonne adéquation des fonctions et contenus ventilés dans l'interface, de sorte que l'ensemble soit manipulable et optimisé sur le plan de l'ergonomie. Le concepteur (UX designer, architecte de l'information) doit prévoir des zones d'interactions amples et une interface aérée.

Comment concevoir des interfaces tactiles ?
Quelles sont les spécificités de la conception tactile ?
Qu'est-ce qu'une expérience tactile ?
La conception d'une interface tactile relève du design de l'interaction, du design de l'information, de l'ergonomie des interfaces.

Les interfaces tactiles ont gagné toutes les sphères de la société depuis l'impulsion de l'iphone en 2007. L'usage tactile est si répandu qu'il donne le sentiment d'avoir toujours existé. Pour autant, bien que toutes les générations se soient désormais frottées au tactile, l'expérience d'une interface digitale par le toucher reste un phénomène d'interaction récent et qui induit potentiellement beaucoup de complexité.

Dans la manipulation tactile, l'interaction avec l'écran est directe. Certes, l'interaction directe avec les objets est aussi vieille que l'histoire de l'humanité. L'homme est un animal qui fabrique des outils et qui les utilise pour réaliser des actions. Faut-il parler du fameux silex ?
Non, ne remontons pas jusque-là...
L'interaction directe concerne principalement l'utilisation et la manipulation des objets qui nous entourent, dans la sphère physique : la fourchette, le sac, le stylo...
Parallèlement, nous interagissons de façon indirecte avec énormément de choses, sur le principe du ricoché : la télécommande de la télévision, l'ouverture de la voiture à distance... De même qu'on on manipule indirectement l'interface utilisateur de l'ordinateur à l'aide de la souris.
Alors, qu'est ce qui change avec le tactile ?

L'interface tactile introduit la manipulation directe d'un objet dématérialisé là où l'usage s'était figé à utiliser l'interface utilisateur au travers de la souris... Les conséquences en matière d'ergonomie tactile sont importantes.
Les interactions directes du toucher sur l'interface concernent la manipulation de données abstraites : l'organisation d'un site, un système d'exploitation, un parcours de prise de commande, ne relèvent pas du même registre que les objets physiques et concrets. Un doigt non initié est très bête face à un écran tactile... : que dois-je faire, que puis-je faire, comment-procéder ?
Il faut apprendre, et l'apprentissage des conventions tactiles est encore loin d'être généralisé. D'ailleurs, peut-on vraiment parler de convention et de normes en matière d'ergonomie tactile ? Hélas non. Il y a un code de la route, mais pas encore de code de l'ergonomie tactile...

Ergonomie tactile et design de l'information

La manipulation d'un écran tactile appelle naturellement une ergonomie spécifique. Les doigts, même les plus habiles, sont naturellement moins précis que le curseur de la souris. Sur le plan du design de l'information, les surfaces dédiées aux interactions (liens, call to action) doivent être d'une taille suffisante pour être cliquable aisément. Un carré d'un centimètre semble un standard à partir duquel on peut ajouter ou retrancher un peu de surface : concept de la conception centrée gros doigt. Un basique de l'ergonomie tactile...
Pensez à Shaquille O'Neal, à David Robison ou encore à Lebron James dans la création des zones d'interaction afin de ne pas oublier que tout le monde n'a pas des doigts de pianistes. La réciproque vaut... Il est toujours délicat de centrer une conception sur les cas marginaux : on ne conçoit pas une chaussure pour monsieur tout le monde en partant sur un étalon de conception centré sur du 55...

Sur le plan du design de l'information, la conception tactile appelle des zones cliquables de plus grand format. Pensez aux bornes interactives que vous utilisez pour peser vos fruits et vos légumes en magasin. Aux écrans pupitres dans les gares et les aéroports, ou dans les stations essences...
Quel est leur point commun ?
Des choix limités. Une question par écran (charge de travail). D'importantes zones de clics et une affordance très forte (guidage, incitation). Des interfaces assez basiques : concept de l'interface Playskool (très gros bouton).
Qui ne s'est pas impatienté devant l'écran de la machine à peser les fruits : mais où sont donc ces foutues figues ? Et puis on se rabat sur les raisins pour avoir l'étiquette, parce que définitivement, on n'a pas envie de comprendre l'organisation fruitière alambiquée de Carrefour ou d'Auchan... Pourtant, le scénario d'usage est très calibré. On arrive quand même à galérer. Problème d'architecture de l'information me direz-vous. Oui, et ça compte aussi...

En attendant la manipulation des interfaces avec les yeux, nous restons encore assez imprécis avec la surface de nos doigts, sans la souris, le joystick, ou le clavier... Ce qui nous amène à considérer l'effort. Les interactions tactiles impliquent des efforts plus importants pour réaliser des actions simples : saisir son adresse sur une borne interactive implique le déplacement du bras, manipuler un écran tactile en face à face est inconfortable... Il faut penser au fait que l'ergonomie du poste de travail classique (chaise, table, ordinateur, souris, éclairage) n'est que rarement assurée dans les interactions 100% tactiles. C'est évident mais c'est un prérequis important en conception. L'effort et la dépense d'énergie sont potentiellement plus importants dans les manipulations directes de l'interface.

La problématique de l'effort pour la manipulation des grands écrans tactiles laissent à penser que de nouveaux scénarios d'interactions, plus ergonomiques, marqueront leur avènement dans les années à venir. Comment imaginer que les yeux ne deviennent pas, très bientôt, le support de manipulation numéro 1 des interfaces ?

Quoi qu'il advienne, pour concevoir des interfaces optimisées et agréables à utiliser dans le cadre d'interaction tactile, il faut privilégier des formats de conception plus larges. Cela s'applique à tous les terminaux : borne interactive, tableau de bord embarqué, écran d'objet connecté, tablette, smartphone, façade du micro-ondes, écran du Thermomix, du Kitchen aid ou du Kenwood cooking chef... et bien sûr aux systèmes d'exploitation et aux logiciels sur ordinateur, où les interactions tactiles sont encore très perfectibles.

Si l'ergonomie des interfaces est un enjeu important de l'interaction tactile, le design de l'interaction est bien le sujet dont les standards en matière de conception d'interface sont radicalement dynamités. En effet, l'augmentation de la surface des éléments interactifs et la diminution des éléments à l'écran vont dans le sens des conventions ergonomiques. En revanche, en matière de design d'interaction, les concepteurs d'interfaces sont désormais obligés de proposer des parcours d'utilisation plus sophistiqués...

Conception tactile et design de l'interaction

Le design de l'interaction est le sujet le plus concerné par l'ergonomie tactile. S'il y a moins d'options à l'écran, et moins de choix proposés à l'utilisateur dans chacune des séquences, c'est bien que les séquences de l'interaction évoluent... Les parcours s'étoffent, et sous couvert de simplicité sur le plan visuel, ils se traduisent par une plus grande complexité sur le plan du design.

Les interfaces tactiles induisent effectivement des parcours d'utilisation plus séquencés. En effet, pour diminuer le risque d'erreur dans l'exploration d'un catalogue ou au moment de la prise de commande dans le tunnel d'achat, l'interface se structure autour d'actions plus concises, ce qui a pour effet d'allonger la séquence globale. Les parcours apparaissent plus simples, du fait d'écrans moins surchargés, dans les faits ils sont souvent plus longs, du fait de la fragmentation des étapes.

La réelle problématique du design de l'interaction tactile concerne les interfaces adaptatives. En effet, dans la conception responsive web design, l'interface s'adapte au terminal de consultation, si bien que l'utilisateur peut utiliser le dispositif aussi bien sur son smartphone (interaction directe : doigt) qu'avec son smartphone (interaction indirecte : souris). Il est de plus en plus commun d'exiger que l'interface responsive soit également utilisable sur des terminaux exclusifs : interface embarquée dans un véhicule, écran d'objet connecté, borne spécifique en magasin... Il y a alors une réelle difficulté de conception dans la mesure où les parcours doivent être mutualisés et fonctionnels sur toutes les plateformes et quel que soit l'usage (tactile ou non).

Ainsi, si le design de l'information tend à s'imprégner des codes tactiles autour de zones plus généreuses, le design de l'interaction se disloque autour de la création de parcours différenciés : parcours direct, parcours guidé, parcours rationnel, parcours par étape, parcours matriciel. Le concepteur de l'interface (UI design) doit créer un maximum de scénarios permettant de réaliser une seule et même tâche, afin que les différentes situations d'utilisation soient couvertes.

On touche alors aux limites de la cohabitation entre interface tactile, dans lesquelles les options sont très peu développées (absence de clic droit, de filtre progressif, de densité informationnelle), et les interfaces utilisateurs standardisées, plus sophistiquées et où les choix sont très développés (logiciel, navigateur, site ecommerce de taille critique, site de presse).

On touche aux limites des interfaces à tous les niveaux (ergonomiques, techniques, graphiques) dans les dispositifs digitaux responsive complexes... Les grandes enseignes qui créent des supports interactifs de taille critique se voient obligées de recourir à la création de site spécifique : un site pour les smartphone, un site pour les tablettes, un site pour les ordinateurs de bureau et portable, un site pour les terminaux embarqués.

La conception tactile est bien plus complexe, sur le plan de la structure (design de l'interaction, architecture de l'information) que ce qu'elle veut bien laisser paraître sur le plan visuel (design de l'information, ergonomie de l'interface simplifiée...).

Objectifs de la conception tactile

Adapter l'interface au touché

La conception tactile poursuit l'objectif central de proposer une interaction qualitative au toucher. Cela passe par un maquettage adapté aux spécificités de l'ergonomie tactile, mais aussi et surtout par un médium très pointu sur le plan sensitif : une belle interface reste inutilisable sur un écran tactile de mauvaise qualité. Evident, mais essentiel. Au bûcher les beaux discours sur l'ergonomie, il faut aussi parler du support physique...
Le rôle du concepteur est aussi de composer avec les limites du matériel. Il faut tester le médium, et ne pas hésiter à le condamner si l'interaction tactile est de faible qualité (sensibilité de l'écran, contraste, réactivité, temps de réponse...).

L'interface utilisateur n'est qu'une partie de l'expérience. Dans ce cas, comme dans beaucoup d'autres en matière de design d'interface, on peut rarement désolidariser l'interface du hardware, c'est à dire, de l'objet physique qui supporte l'interface.

La conception tactile, c'est aussi adapter l'expérience aux spécificités du tactile : ergonomie et design de l'information, parcours et design de l'interaction.

Adapter l'expérience aux spécificités tactiles

Parce que les manipulations tactiles impliquent souvent "un effort physique" (portée du bras pour un écran d'ordinateur, relatif certes dans le cadre d'un smartphone) et peuvent parfois être considérées comme élément de distraction voire de perturbation dans un contexte bien déterminé (sécurité routière et manipulation tactile du GPS...), il est de bon usage de simplifier au possible toutes les actions demandées aux utilisateurs finaux :

  • Adaptation de l'interface à la manipulation tactile.
  • Simplification des parcours.
  • Rationalisation des actions en séquences simples.
  • Modélisation d'écrans lisible pour aller à l'essentiel.

Exemples de conception tactile

icone telecharger des modeles pour analyse UX
TÉLÉCHARGER
150 livrables projets !
Kit de livrables projet : 2,60€ le modèle

conception tactile : tableau de bord conception tactile : tableau de bord
ux Peugeot Music
iafactory - Julien MUCKENSTURM
conception d'interface tactile : tablette conception d'interface tactile : tablette
référence ux tunnel commande Cdiscount
iafactory - Julien MUCKENSTURM
design tactile design tactile
guide des gestes tactiles
UX tactile : borne interactive UX tactile : borne interactive
ux Gdf suez ma conso
iafactory - Julien MUCKENSTURM
exemple de conception tactile exemple de conception tactile
ux Peugeot Music
iafactory - Julien MUCKENSTURM

Méthode pour la conception tactile

icone formation ux design en ligne
MAÎTRISER
les méthodes UX design
Formation UX en ligne : 18,00€ l'heure

Spécifier le contexte d'utilisation

Sur le plan des méthodes, une conception d'interface tactile implique une bonne connaissance des situations d'usage dans lesquelles le dispositif sera utilisé.

Une phase d'analyse est incontournable, dans la lignée des méthodes de design d'expérience utilisateur et de conception centrée utilisateur. On cherchera à préciser les contextes de consultation, les terminaux utilisés, la complexité des séquences à adresser. Il faut naturellement avoir une connaissance du degré de familiarisation de l'audience aux spécificités de l'interaction tactile.
Effectivement, si le design de l'expérience utilisateur ne se limite pas uniquement aux aspects de façonnage de l'interface, c'est particulièrement vrai en matière de conception tactile.

Ces travaux peuvent être menés dans le cadre d'une analyse du besoin côté utilisateur ou d'une étude des usages digitaux sur le terrain. Dans tous les cas, il s'agit d'un travail d'enquête rattaché aux techniques d'investigation.

Une phase d'analyse n'est pas si complexe à réaliser ! La méthode de conception tactile peut suivre un cycle court de type analyse - conception pour déboucher rapidement sur des solutions de conception viables pouvant faire l'objet de tests.

Ventilation judicieuse des informations tactiles à l'écran

Inscrivez votre approche de la conception tactile dans l'esprit du Bauhaus des années 1920 (et oui, pas grand-chose à inventer, tout était déjà ...) : esthétique simple et épurée, approche fonctionnelle innovante lorsque c'est possible, en mixant toutes les disciplines relatives au champ disciplinaire de l'expérience utilisateur (architecture de l'information, design d'interaction, design d'information, design émotionnel, ergonomie).

Privilégiez des formats amples, créez un système de grille (grid system) utilisant toute la largeur de l'interface, limitez le bruit à l'écran et les fonctions optionnelles parasites. Plus que dans toute autre interaction, la conception d'une interface tactile doit privilégier l'efficacité...

Parcours d'utilisation flexibles et efficaces

Les interfaces tactiles appellent des séquences directes centrées sur l'action. Elles impliquent un découpage plus radical des processus et des parcours. Une règle à garder en mémoire est la suivante : une grande typologie d'action par page, un seul scénario stratégique par gabarit (objectif).

Pour les dispositifs responsive, il est important de proposer des standards ergonomiques adaptés aux supports mobiles. Il ne s'agit pas ici de décrire les spécificités de la conception d'interface responsive, mais de rappeler qu'un écran d'ordinateur n'est pas un smartphone, et qu'il est judicieux de concevoir des séquences respectant les problématiques de charge de travail en matière d'ergonomie des interfaces.

Limitez les parcours d'utilisation centraux, et prévoyez des alternatives ou des accès complémentaires pour réaliser les actions. Par exemple, en diversifiant l'exploration d'un catalogue, en proposant une prise de commande simplifiée (minifié)...

Démarche pour concevoir à destination des écrans tactiles

Si vous êtes amenés à concevoir un projet avec une interface tactile, les points suivants sont de bons checkpoints :

  • analyse du contexte d'utilisation,
  • recherche utilisateur, étude comparative,
  • clarification du périmètre fonctionnel et éditorial,
  • architecture de l'information (organisation et hiérarchisation des contenus et fonctionnalités - arborescence),
  • scénarisation des parcours utilisateurs, design de l'interaction,
  • modélisation des interactions à l'écran (wireframing) dans un environnement tactile.

Travaux complémentaires à la conception tactile

Une étude des usages digitaux est bienvenue pour caractériser la nature des situations d'utilisation. Cela va de pair avec l'analyse des besoins utilisateurs.
Bien sûr, pour concevoir l'interface tactile de votre projet digital, vous allez devoir passer beaucoup de temps à modéliser les interactions au travers des wireframes - techniques de wireframing ux design...

La conception tactile est une approche générale. Les applications sont multiples et concernent tous les terminaux.
Ainsi, concevoir pour le tactile peut déboucher sur la :

auteur Julien Muckensturm iafactory
linked in julien muckensturm

Ressources pour concevoir le tactile

APPROFONDIR
le design tactile

Livre : Design tactile
Design tactile

Aller plus loin pour la conception tactile

Formation vidéo à visionner :

Livrables à télécharger :

Wireframes à télécharger :

Articles du journal à méditer :

Études de cas à lire :

Travaux à visualiser :

Flux 2.0 à explorer :

Compétences métier pour la conception tactile :

Fiche métier :

Livres à bouquiner :

Autres ressources sur le web :

  • Signalez nous des ressources sympas autour de la conception tactile en utilisant les commentaires !
Plus de techniques de conception
ADAPTATION MULTI-ECRAN
Conception fonctionnelle de vos interfaces mobiles : web mobile, application mobile, logiciel mobile...
conception mobile
ADAPTATION MULTI-ECRAN
Conception de vos interfaces dédiées aux tablettes : web, applications et logiciels dédiés aux tablettes...
conception tablette
ADAPTATION MULTI-ECRAN
Conception d'objets et interfaces connectées : cockpit, tableau de bord, montre, écran de contrôle...
conception objet connecté
Prototype
  • réalisé par iafactory
  • livré sous 7J. ouvrés
  • à partir de 4200€ HT