Principes de conception de l'UX mobile

Un bon design est un bon design, n'est-ce pas ? C'est vrai, mais il y a des considérations spécialisées qui entrent en jeu selon le support de cette conception. Les principes de conception pour quelque chose comme une application conçue pour fonctionner sur un ordinateur de bureau sont généralement légèrement différents des conventions de conception UX mobiles les plus efficaces.

Même au sein d'une catégorie générique telle que la "conception UX mobile", il existe des différences entre la conception d'une application et la conception d'un site Web mobile. Lorsque les utilisateurs téléchargent une application, ils ne veulent pas seulement la version mobile du site Web. Ils veulent une expérience unique qui justifie le temps passé à télécharger l'application (ainsi que l'espace qu'elle occupe sur leur téléphone). Les utilisateurs n'hésitent pas à supprimer une application qu'ils ne trouvent pas utile : 75 % des téléchargements d'applications ne sont ouverts qu'une seule fois.

La conception mobile, en général, ne peut être négligée. Dans le monde, plus de personnes accèdent à Internet à partir de leurs appareils mobiles et tablettes qu'à partir d'ordinateurs de bureau. Ignorer ces utilisateurs n'est plus quelque chose que les concepteurs UX peuvent justifier. Il est important que les concepteurs mobiles tiennent compte des meilleures pratiques UX mobiles à chaque étape du processus de conception.

Mettre l'utilisateur en premier

Cela devrait aller de soi, mais dans tout projet de conception, l'utilisateur doit toujours passer en premier, et les besoins des utilisateurs sont encore plus importants (et plus spécifiques) sur les appareils mobiles. Si les concepteurs ne répondent pas aux besoins des utilisateurs mobiles, ces utilisateurs passeront très rapidement à d'autres sites Web, applications ou distractions.

Voici quelques mesures que les concepteurs peuvent prendre pour répondre aux besoins spécifiques des utilisateurs mobiles.

Rendre la navigation intuitive

La navigation sur les sites mobiles et les applications doit être plus intuitive que sur les sites de bureau. Les utilisateurs doivent être en mesure d'identifier immédiatement comment se déplacer dans une application mobile ou un site Web. Cela peut être réalisé grâce à des modèles de conception reconnaissables (tels que des menus hamburger) ainsi qu'à des icônes reconnaissables (une icône "accueil" pour l'écran d'accueil, une bulle de discussion pour la messagerie, etc.).

Si les utilisateurs doivent réfléchir à la façon de naviguer, ils sont plus susceptibles de se désengager du site Web ou de fermer l'application et de rechercher une solution plus simple.

Créez une expérience transparente sur tous les appareils

Qu'un utilisateur accède au contenu d'une application, d'un site Web mobile ou d'un site Web de bureau, la transition entre leur utilisation doit être transparente. Les éléments de conception doivent se refléter (les concepteurs ne doivent pas utiliser le bleu pour l'application et le rouge pour le site Web, par exemple).

Non seulement une expérience transparente facilite les choses pour les personnes utilisant un site Web ou une application, mais elle renforce également la confiance avec la marque.

Concentrez-vous sur les objectifs de l'utilisateur

Les objectifs qu'une personne a sur une application mobile ou un site Web sont probablement différents de ceux qu'elle a sur un site de bureau complet. Par exemple, sur une application de restaurant, un visiteur ne voudra probablement faire qu'une poignée de choses : afficher le menu, effectuer une réservation ou obtenir un itinéraire. Dans la plupart des cas, ils ne consultent pas l'historique complet de l'entreprise sur leur téléphone mobile. Ce type de contenu peut être masqué dans des menus ou des sous-menus.

Réfléchissez à ce qu'un utilisateur veut réellement faire sur une application mobile. Une chose importante que les concepteurs oublient souvent est la nécessité d'une connexion pour les tâches de base. Les applications bancaires, par exemple, demandent souvent une connexion afin de faire quoi que ce soit sur l'application. Mais des tâches telles que trouver l'emplacement du guichet automatique le plus proche n'ont pas vraiment besoin que l'utilisateur se connecte. Rendre ces fonctionnalités faciles d'accès est un excellent moyen d'améliorer l'expérience utilisateur.

Autoriser la personnalisation

Pour les applications mobiles, la personnalisation est essentielle pour améliorer l'expérience utilisateur. La personnalisation peut également aider à atteindre les objectifs marketing. C'est un gagnant-gagnant pour toutes les parties prenantes concernées.

La personnalisation doit pousser les utilisateurs vers le contenu qu'ils recherchent et s'éloigner du contenu qui n'est pas pertinent pour eux. Cela peut également éliminer les distractions sur le site, rationaliser des composants tels que le processus d'achat et s'assurer que les messages marketing sont synchronisés avec ce que le visiteur veut réellement.

Cependant, trop de personnalisation peut être un piège facile dans lequel tomber. Le niveau de personnalisation doit correspondre au niveau de confiance d'un utilisateur envers l'application et l'entreprise. À quelle fréquence les internautes se sentent-ils déconcertés ou étranges lorsqu'un site Web affiche des annonces pour quelque chose auquel ils ont pensé (ou parlé) mais qu'ils n'ont même pas recherché ? Bien sûr, c'est juste la nature prédictive des algorithmes publicitaires avancés, mais ce niveau de personnalisation peut encore laisser les visiteurs inquiets.

Facilitez toujours les choses

Lorsqu'une personne visite un site Web ou une application sur un appareil mobile, elle souhaite terminer la tâche à accomplir le plus rapidement possible. C'est au concepteur de rendre l'exécution des tâches nécessaires aussi simple que possible. Éliminer tout ce qui n'est pas absolument vital pour chaque tâche est un bon point de départ. Il est également essentiel de simplifier les tâches nécessaires sur une interface mobile.

Par exemple, de nombreuses applications et sites de commerce électronique offrent désormais une option d'appareil photo pour saisir les informations de carte de crédit. Plutôt que de saisir un numéro de carte, les acheteurs peuvent diriger leur appareil photo vers leur carte de crédit et l'application lira automatiquement le numéro.

D'autres choses comme spécifier le type d'entrée dans les champs de formulaire (de sorte que, par exemple, lorsqu'une adresse e-mail est l'entrée attendue, le symbole @ et ".com" apparaissent sur l'écran du clavier principal).

Bonnes pratiques d'intégration

Une bonne intégration est essentielle pour les applications mobiles. Mais la définition de "bon" varie considérablement entre les différents types d'applications. Les applications simples à utiliser, telles que les listes de tâches ou les navigateurs Web, nécessitent une intégration minimale. Quelques écrans de démarrage indiquant des fonctionnalités uniques suffisent à la plupart des utilisateurs pour commencer.

Mais les applications plus complexes, comme celles pour les services financiers ou la gestion de projet, nécessitent une intégration plus complète.

Utiliser les gestes établis

Celui-ci devrait aller de soi, mais les concepteurs mobiles doivent tenir compte des gestes établis que les gens sont déjà habitués à utiliser sur leurs appareils. Des choses comme pincer pour zoomer ou balayer sont devenues intuitives pour la plupart des utilisateurs et doivent être utilisées chaque fois que possible.

Dans les cas où un concepteur décide de s'écarter d'un geste établi, il est important d'informer les utilisateurs de cet écart, soit pendant le processus d'intégration, soit lorsque le cas d'utilisation apparaît pour la première fois.

Conception de mise en page mobile

La conception de mises en page mobiles n'est pas entièrement différente de la conception de tout autre type de mise en page, mais il y a certaines considérations que les concepteurs doivent prendre en compte.

L'une des principales considérations est la taille des cibles à écran tactile. Alors qu'une souris ou un trackpad peut cliquer avec une précision extrême, le bout des doigts est beaucoup moins précis. Idéalement, les cibles devraient être de 7 à 10 mm sur l'écran d'un appareil mobile. Cela permet au bout du doigt de toucher la cible sans avoir à viser trop attentivement.

Un domaine connexe à prendre en compte est les commandes de position des mains et la « zone du pouce » sur les appareils mobiles, la zone de l'écran d'un téléphone qui peut être facilement accessible avec le pouce lorsqu'une personne tient son téléphone d'une main. Mettre la majorité du contenu interactif (et en particulier les appels à l'action) dans cette zone est essentiel pour créer une expérience utilisateur positive.

Il est important que les conceptions mobiles éliminent le plus d'encombrement possible. Le minimalisme est l'ami du designer lorsqu'il s'agit d'applications mobiles. Essayer de tout entasser dans une interface utilisateur de bureau dans un écran qui est une fraction de la taille rend la conception à l'étroit et peut être écrasante.

Se concentrer sur les objectifs, minimiser les options de navigation (les menus et les sous-menus peuvent aider à cela) et généralement éliminer tout élément qui n'est pas essentiel pour que les utilisateurs fassent ce qu'ils doivent faire créera une interface utilisateur plus rationalisée et conviviale.

Tout en réduisant l'encombrement à l'écran, les concepteurs doivent s'assurer de ne pas négliger certaines considérations de conception clés. L'une de ces considérations est de s'assurer que les différents éléments de conception ont un contraste suffisant. Les gens regardent souvent leurs appareils mobiles dans des conditions moins qu'idéales. Des choses comme la lumière du soleil peuvent rendre les éléments sur un écran difficiles à voir, mais un contraste élevé aide à rendre les éléments plus visibles.

La typographie est une autre considération clé. Il est important d'avoir une hiérarchie typographique claire dans une conception mobile. Les titres et les en-têtes doivent être faciles à repérer et les polices, en général, doivent être plus grandes. Personne n'aime plisser les yeux sur son écran pour essayer de lire de gros blocs de texte sur son téléphone. Des en-têtes clairs, des listes à puces ou numérotées et des paragraphes courts rendent le texte mobile plus lisible.

Une dernière considération concernant l'interface utilisateur est l'utilisation de transitions et d'animations. Une animation peut être un signal important pour un utilisateur que quelle que soit l'action qu'il vient d'entreprendre, il a fait quelque chose. Les animations et les transitions claires entre les écrans ou les fonctions d'une application mobile sont des informations clés qui créent une expérience utilisateur plus satisfaisante.

Meilleures pratiques UX mobiles

Tous les éléments ci-dessus sont des considérations importantes lors de la conception d'applications mobiles et de sites Web. Mais il existe d'autres bonnes pratiques UX mobiles à suivre pour garantir la meilleure expérience utilisateur possible.

Concentrez-vous sur la vitesse

Malgré la disponibilité généralisée des données 4G, les réseaux mobiles sont encore généralement plus lents que les services wifi ou haut débit. Et dans de nombreuses régions du monde, la 4G n'existe pas et les utilisateurs mobiles sont bloqués avec la 3G ou des vitesses de données plus lentes.

Cela signifie que les sites Web mobiles et en particulier les applications mobiles doivent être rapides. L'inclusion de contenu dans une application qui n'a pas besoin d'être téléchargée à chaque chargement de l'application rendra l'application plus rapide. De même que le chargement du contenu uniquement lorsque cela devient nécessaire (bien que l'anticipation du contenu qui sera nécessaire et son préchargement puissent faire apparaître une application plus rapidement pour l'utilisateur).

C'est un équilibre entre ne pas charger de contenu qui ne sera pas utilisé (et utiliser des données) et créer la perception de la vitesse en préchargeant le contenu dont les utilisateurs auront probablement besoin ensuite.

Une façon de créer l'illusion de vitesse et d'apaiser les utilisateurs impatients consiste à utiliser des espaces réservés jusqu'au chargement du contenu. L'application mobile de Facebook le fait, avec ce qui semble effectivement être un chargement filaire raffiné dès que l'application s'ouvre, en conservant de l'espace pour les publications qui se chargent au fur et à mesure qu'elles se téléchargent. Cet écran de transition signale aux utilisateurs qu'il se passe quelque chose avec le contenu avant qu'il ne soit réellement chargé.

Fournir des commentaires aux utilisateurs

Donner aux utilisateurs des commentaires lorsqu'ils effectuent des actions sur une application mobile est un aspect important d'une expérience utilisateur positive. Comme mentionné précédemment, les animations et les transitions sont un moyen de donner des commentaires.

La rétroaction tactile et audio est également possible avec les appareils mobiles. Fournir un retour tactile lorsque certaines actions sont effectuées est particulièrement populaire avec les jeux mobiles, ainsi qu'avec les messages d'erreur. Le retour audio est populaire avec des fonctions sur toutes sortes d'applications. Néanmoins, les concepteurs ne doivent pas se fier au retour audio, car de nombreuses personnes gardent leur téléphone silencieux à tout moment.

Minimiser la saisie de données

Une autre meilleure pratique clé de l'expérience utilisateur mobile consiste à minimiser la quantité de données à saisir. Cela a été abordé précédemment, mais plus une personne doit entrer de données dans une application mobile, plus elle est susceptible d'abandonner la tâche.

Remplir un formulaire avec quatre ou cinq champs n'est peut-être pas un gros problème sur un ordinateur de bureau ou portable, mais sur un appareil mobile, ces quatre ou cinq champs peuvent suffire à détourner un utilisateur, surtout s'il ne peut pas voir son but. Assurez-vous que chaque champ d'un formulaire rempli sur un appareil mobile est nécessaire. Éliminez ceux qui ne le sont pas.

C'est un domaine où donner aux gens la possibilité d'utiliser l'un de leurs comptes existants (comme un compte Facebook, Google ou Twitter) plutôt que de s'inscrire à partir de zéro peut grandement améliorer les conversions. Lorsqu'un utilisateur n'a qu'à cliquer pour autoriser l'accès plutôt que de remplir un formulaire pour une nouvelle inscription, il est plus susceptible de le faire. Ne vous fiez pas uniquement à ces applications secondaires - certains utilisateurs se méfient encore de lier leurs comptes et prendront le temps de remplir un formulaire.

Conclusion

Le respect de ces principes de conception UX mobiles établis créera une meilleure expérience utilisateur globale pour les personnes visitant un site mobile ou utilisant une application mobile. Les concepteurs n'ont que quelques secondes pour attirer l'attention des utilisateurs avant d'abandonner une application ou un site au profit d'un site plus convivial, intuitif ou simplifié.

Les superbes conceptions mobiles sont de plus en plus courantes et la barre a encore été relevée en ce qui concerne ce que les utilisateurs attendent de leurs applications mobiles. Les concepteurs ne peuvent plus considérer la conception mobile comme une réflexion après coup et doivent plutôt y consacrer autant de temps, de considération et de ressources qu'ils le font pour les conceptions sur d'autres formats.

Pour en savoir plus sur le blog Toptal Design :

• Mobile UX Design - Meilleures pratiques, contraintes et collaboration avec les développeurs
• Fidélisez les utilisateurs avec ces inspirations d'intégration d'applications mobiles
• Le guide fondamental de l'utilisabilité mobile
• Principes heuristiques pour les interfaces mobiles
• UX eCommerce pour l'expérience mobile