Comment web design et mobile design sont en train de converger - EXIT Studio

Ces dernières années, l’acquisition et l’utilisation de supports mobiles – de la simple consultation de site à la concrétisation d’un achat – n’a eu de cesse d’augmenter. Tablettes et smartphones prennent le pas sur l’usage jusqu’alors démocratisé des PC de bureaux et autres ordinateurs portables. Et tandis que l’emploi de supports mobiles surpasse le web, nous sommes témoin de l’influence toujours plus imposante du responsive design (design pour mobile) sur le web design. De sorte qu’en 2014, l’augmentation de l’usage de support mobile au niveau mondial ne peut plus être ignorée.

Comment web design et mobile design sont en train de converger - EXIT Studio

Le responsive design, bien plus que l’ajustement à différents supports

« Responsive Web Design is the approach that suggests that design and development should respond to the user’s behavior and environment based on screen size, platform and orientation… » – Smashing Magazine.

Traduction :

« Le responsive web design est l’approche qui suggère que design et développement doivent répondre au comportement et à l’environnement des utilisateurs, sur base de la taille de l’écran, la plateforme et l’orientation … ».

Il ne s’agit pas simplement de résolutions d’écran et d’images ré-ajustables. Chaque produit (application mobile ou site) doit être conçu spécifiquement et distinctivement pour chaque support (et non faire l’objet d’un simple copier/coller). Pourquoi ? Tout simplement parce que chaque appareil a lui-même été conçu avec une finalité d’utilisation spécifique et possède des contraintes techniques qui lui appartiennent. Ainsi, développer une application pour smartphone et ne pas concevoir son pendant sur tablette rendra dommageable l’expérience utilisateur, ainsi que l’utilisation même de l’outil (du site, de l’application).

Comment web design et mobile design sont en train de converger - EXIT Studio

Il nous est déjà arrivé à tous d’installer une application développée pour mobile sur une tablette. L’application s’avère souvent inutilisable car non optimisée pour le support, la résolution d’écran mais également les contraintes et possibilités techniques. Par exemple, la tablette dispose d’un clavier virtuel et permet de connecter un clavier physique, ce que le Smartphone ne permet pas. D’un point de vue de l’optimisation du produit, les possibilités techniques spécifiques à un support pourront apporter à l’application ou au site une plus-value, comme elle pourrait la rendre complètement inutilisable (par exemple, si le clavier virtuel de la tablette apparaît au-dessus des champs d’un formulaire que l’internaute est en train de compléter).

À cette fin, Matt Gemmel a listé une série de différences entre les appareils à écran tactile large (tablette) et à écran tactile plus petit (smartphone) ayant un impact sur la manière avec laquelle nous devons envisager le design d’un produit : http://mattgemmell.com/ipad-application-design/

Comment web design et mobile design sont en train de converger - EXIT Studio

L’impact des écrans tactiles larges sur le responsive design

Si l’iPad a largement popularisé l’écran tactile dit « large », ce dernier fut également à la source du développement de nombreux autres supports du même type. Les supports hybrides ont participé à complexifier encore davantage le design et le développement de nouveaux produits. Bien que tablettes et smartphones soient similaires en termes d’hardware et d’OS, la diversité des produits témoigne de la diversification des usages pour lesquels ces derniers ont été conçus (iPhone, iPad, Kindle, etc.). L’impact que les écrans larges ont sur la conception graphique des produits est donc assez conséquent.

Comment web design et mobile design sont en train de converger - EXIT Studio

L’unification de l’expérience digitale à travers les différents supports

Bien que chaque application, page web, etc. doive être envisagée, conçue puis développée de manière spécifique pour chaque appareil, contexte d’utilisation et finalité d’usage ; il est hors de question que l’expérience utilisateur soit également unifiée. En effet, l’unification du design sur les différents supports permet principalement de ne pas « dépayser » l’internaute et ainsi, optimiser l’expérience utilisateur. Ce dernier ne doit pas se sentir perdu lorsqu’il décide de passer d’un appareil à un autre. Imaginons un individu en plein processus d’achat. Ce dernier commence par consulter les articles d’un site de vente en ligne sur sa tablette tactile. Sa consultation terminée et son article ciblé, ce dernier préfère réaliser son achat via son ordinateur de bureau. La cohérence graphique de l’interface entre les différents supports permettra à l’internaute de se repérer immédiatement, ce qui permettra d’éviter (notamment) l’abandon, en cours de route, du processus d’achat. En effet, le manque de cohérence graphique est responsable de lourdes pertes en termes de conversion.

Du point de vue du designer et du développeur web, envisager dès le départ le design d’un site de manière globale (pour tous les supports sur lesquels ce dernier devra s’afficher) a un impact non négligeable sur la création en elle-même (tant au niveau de l’efficacité du travail que sur les choix graphiques qui vont suivre). Il ne faut pas oublier qu’en plus de devoir adapter les designs aux différents appareils, les web développeurs doivent également se soumettre aux contraintes des différents navigateurs (ainsi qu’à leurs trop nombreuses versions). Les designs, déjà très épurés par la tendance, s’envisagent désormais davantage en blocs (carrés). Face à une idée un peu plus complexe et délicate à mettre en place puis à décliner, on préférera la simplicité de formes simples et de zones bien délimitées (en carrés, rectangles, lignes, bandes colorées, et j’en passe). Dans un contexte de crise, certaines agences – dans une recherche constante de diminution des coûts par l’augmentation de l’efficacité – se tournent bien volontiers vers ce type de design, bien plus simple à implémenter et à concevoir.

Comment web design et mobile design sont en train de converger - EXIT Studio

En conclusion

Si le secteur reste sous-tendu par des tendances auxquelles acteurs du web /designers et développeurs ne peuvent échapper (flat design, etc.), le risque de tomber dans le travers d’un minimalisme accru (design simpliste en blocs) – du fait de la simplification que cela apporte à la déclinaison du site web en site mobile, ainsi que sur les divers navigateurs – est bien présent. Envisager le design en amont et ce, pour tous les supports, est une excellente chose puisque cela permet tant d’optimiser le design en lui-même que le temps auquel on va s’y consacrer. Veillons à ce que cela ne bride pas pour autant la créativité des designers. Il devient donc indéniable que la prolifération et la diversification des supports tactiles (allant du smartphone à la tablette) a un impact conséquent sur le web design, tant en terme de conception qu’en termes d’expérience utilisateur. Concevoir une interface au design responsive, c’est être amené à prendre en compte, pour chaque support :

  •  les résolutions d’écran ;
  •  les divers navigateurs et leurs nombreuses versions ;
  •  les finalités et contextes d’utilisation ;
  •  les contraintes et possibilités techniques.

Et ce tout en veillant à conserver une cohérence et une homogénéité graphique constante.

Mots-clés

  • Responsive Design
  • Mobile Design
  • Desktop
  • Tablette
  • Smartphone
  • Mobile

Sources

Plus d'articles pouvant vous intéresser

Voir tous les articles

Envie de faire partie de l’aventure EXIT Studio ?

Envie d’un site attractif et performant, tant optimisé pour le référencement qu’accessible sur tablettes et smartphones ?

Demander un devis