Design des applications mobile vs. Desktop: comment optimiser votre expérience utilisateur ?

Dès 2014, l’utilisation d’Internet pour les applications mobiles a éclipsé l’utilisation pour les applications de bureau (aux États-Unis), et peu de temps après en 2016, la navigation Internet totale sur mobile a dépassé celle sur les ordinateurs (dans le monde). Cette vague a changé le jeu du design numérique.

Comment pouvez-vous créer une expérience exceptionnelle pour les utilisateurs d’applications de mobile et ordinateur? C’est un défi.

Aujourd’hui, les propriétaires de sites Web et les développeurs se démènent toujours pour rattraper leur retard. Les stratégies de design pour ordinateurs qu’ils avaient passées à perfectionner au cours des deux dernières décennies sont maintenant devenues une compétence secondaire, et le pouvoir s’est déplacé vers ceux qui comprennent mieux le mobile.

Pour les entrepreneurs comme pour les développeurs, la survie dépend désormais de la compréhension des différences entre les designs des applications de bureau et des applications mobiles et de la manière de tirer le meilleur parti des deux.

Dans cet article, nous vous présentons quelques bonnes pratiques afin que vous puissiez créer l’expérience utilisateur ultime.

Design des application mobile vs. Desktop: les grandes différences.

Taille de l’écran (Screen size)

Desktop = grand

Cela signifie beaucoup plus que la possibilité d’ajouter plus de choses. La taille de l’écran affecte tous les aspects de la conception, en particulier la navigation.

Les applications de bureau peuvent prendre en charge les barres de navigation fixes, tandis que les mobiles sont généralement limités aux menus déroulants. Ceci est très efficace pour la découverabilité, car les utilisateurs peuvent trouver de nouvelles sections qu’ils ne connaissaient pas auparavant. Par exemple, saviez-vous qu’eBay vend des moteurs et d’autres pièces automobiles ? Si vous utilisez leur application mobile, vous devrez faire tout votre possible pour l’apprendre.

Mobile = petit

Les applications mobiles doivent conserver de l’espace sur l’écran partout où elles le peuvent, vous devez donc savoir quels éléments sont suffisamment importants pour être affichés. Deux tendances intéressantes sont nées de cet obstacle : le minimalisme et la carte des hamburgers. Les deux ont eu tellement de succès qu’ils se sont également infiltrés dans la conception de bureau, où ce sont des choix stylistiques plutôt que des nécessités.

Interaction

Desktop = curseurs

Les applications de bureau peuvent tirer pleinement parti de l’interactivité du curseur : des éléments tels que du texte survolé ou des animations déclenchées par le curseur. Cela permet aux applications de bureau d’afficher des écrans entiers remplis d’images, avec un texte descriptif n’apparaissant qu’au survol.

Mobile = gestes

Vous ne pouvez pas survoler les applications mobiles, mais vous avez une liste infinie de gestes littéralement à portée de main. Glisser, secouer ou piquer à l’ancienne offre un tout nouvel ensemble d’opportunités aux applications (et elles les rendent plus amusantes). Pouvez-vous imaginer à quel point Tinder serait ennuyeux si vous deviez cliquer ?

Organisation du contenu (Organizing content)

Desktop = colonnes (columns)

Tout contenu sur un bureau peut apparaître dans un format multi-colonnes traditionnel, tout comme le contenu imprimé dans les journaux et les magazines. Cela offre beaucoup de flexibilité pour concevoir des mises en page et positionner du texte, des images et des éléments d’interface utilisateur.

Mobile = défilement (scrolling)

Une fois que le contenu atteint une certaine longueur, les applications mobiles doivent utiliser un long défilement. Et ce n’est pas une mauvaise chose ! Les utilisateurs mobiles préfèrent en fait le défilement continu, et cette technique économise de l’espace sur l’écran tout en rendant l’interaction plus amusante avec les gestes. Comme le minimalisme et le menu hamburger, le défilement long est une autre tendance de conception mobile qui s’est transférée sur les ordinateurs de bureau en raison de sa popularité.

Mobile = portrait / paysage

Contrairement aux écrans de bureau, les applications mobiles peuvent basculer entre les vues portrait et paysage à volonté. Pour les concepteurs et les propriétaires de sites Web, c’est une bénédiction et une malédiction. Deux orientations d’écran permettent plus de fonctionnalités et une meilleure personnalisation de l’utilisateur, mais cela peut souvent nécessiter deux fois plus de travail de conception.

Fonctionnalité

Desktop = grandes tâches

À en juger par les résultats d’une enquête du panel Gallup, les utilisateurs préfèrent les applications de bureau pour des tâches plus longues et plus complexes. Une raison : les écrans mobiles limitent le nombre de fonctions disponibles à la fois. C’est l’une des raisons pour lesquelles Adobe a opté pour une application hybride Photoshop Mix au lieu de porter tout Photoshop sur mobile.

Mais plus précisément, c’est une question de mentalité. Le mobile fonctionne pour les courtes poussées et les tâches rapides qui se présentent en ce moment (pensez à des comparaisons de prix ou chercher le nom d’un nouveau joueur recruter par votre équipe préférée). Lorsque des tâches plus longues se présentent, les utilisateurs préfèrent trouver un siège et s’installer dans des applications de bureau avec plus de fonctions, plus de contenu et plus de fonctionnalités spéciales.

Mobile = expérimental

Ce que le mobile manque de fonctionnalités, il le compense par l’ingéniosité. À l’heure actuelle, la conception mobile est à la pointe de la technologie et offre des tonnes de fonctionnalités exclusives que les ordinateurs de bureau ne peuvent tout simplement pas faire.

Voici quelques exemples :

•          Réalité virtuelle

•          Réalité augmentée

•          Plusieurs caméras

•          Accéléromètres et capteurs gyroscopiques

•          Listes de contacts mobiles

•          Capteurs magnétiques

Meilleures pratiques pour le design d’applications de bureau et mobiles

Qu’est-ce que tout cela signifie concrètement ? Que devriez-vous faire différemment pour chaque média ? Examinons les conseils de conception spécifiques pour vous aider à optimiser les designs de chacun.

Optez pour Mobile-First

Si vous créez une application pour ordinateur et mobile, commencez d’abord par la version mobile. Il est plus facile d’ajouter des éléments lorsque vous augmentez la taille de l’écran que de supprimer des éléments lorsque vous réduisez la taille de l’écran. Passer au bureau en premier a tendance à impliquer davantage de retours en arrière.

Prioriser les éléments

Les écrans mobiles n’ont de la place que pour les parties les plus importantes de votre conception. Vous devez savoir ce qu’ils sont. Répertoriez tous vos éléments de conception et classez-les du plus important au moins important. Cela aide plus tard lorsque vous décidez quels éléments obtiennent les meilleurs emplacements d’écran et lesquels se cachent dans les menus de hamburgers. PS : c’est tout aussi utile pour la conception de bureau.

Travailler avec des colonnes

Comme nous l’avons mentionné, les applications de bureau permettent des formats multi-colonnes, qui permettent des options telles qu’un menu de navigation à gauche ou à droite, des barres latérales pour les widgets et les publicités, et de la place pour les structures de cartes. Cela ne volera pas sur les appareils mobiles, mais là où une seule colonne centralisée est la meilleure.

Organisez le contenu de votre application verticalement (avec des publicités en bas). Mettez des images au-dessus ou en dessous du texte, mais rarement à côté.

Profitez des avantages du mobile

Nous savons que vous ne voulez pas entendre « plus de travail », mais il y a une différence entre concevoir pour mobile et créer simplement une application de bureau pour un appareil mobile. Utilisez toutes les choses amusantes que vous pouvez faire avec le mobile, y compris des commandes gestuelles inventives et des capteurs spéciaux. Celles-ci n’améliorent pas seulement la convivialité des applications mobiles, elles les rendent également plus amusantes et se démarquent.

N’oubliez pas la mentalité de l’utilisateur

L’état d’esprit de l’utilisateur est l’une des plus grandes différences entre le mobile et le bureau. Les tâches sur les applications mobiles doivent être rapides et instantanément compréhensibles en un coup d’œil. Imaginez que quelqu’un essaie d’utiliser votre application en étant en retard pour prendre un vol. Il doit supporter des coups d’œil sporadiques rapides et être utilisable au milieu des distractions. Gardez les tâches complexes sur le terrain de bureau.

Faites de vos applications des alliées

Nous pouvons donner l’impression que les ordinateurs de bureau et mobiles sont des rivaux acharnés, mais la vérité est que la plupart du temps, les utilisateurs utilisent les deux appareils, même pour différents domaines de la même tâche.

Prenez les achats en ligne, par exemple. Le rituel commun consiste à parcourir les produits sur un appareil mobile (où l’utilisateur peut se mettre à l’aise ou vérifier en déplacement), puis à effectuer l’achat réel sur un ordinateur de bureau (où le clavier facilite le remplissage des formulaires). Dans cet esprit, restez à jour sur les meilleures tactiques de conception pour les deux.

Il ne s’agit pas de créer la meilleure expérience de bureau. Ou la meilleure expérience mobile. Il s’agit de créer la meilleure expérience, point final. Pour ce faire, optimisez à la fois le bureau et le mobile pour tenir compte de tous les facteurs.