Flat 2.0 et comment cela résout les problèmes d'utilisabilité de Flat Design

Le design plat existe depuis les années 1950, lorsque le style typographique international a été mis au point. Ces derniers temps, il a gagné en popularité depuis le lancement du nouveau logiciel Microsoft conception métropolitaine axée sur la géométrie et la typographie langue, d'abord dans le nouveau Windows Phone en 2010, puis dans Windows 8 en 2012.

Le design plat se caractérise par la absence d'effets tridimensionnels et d'éléments visuels brillants afin de réaliser propreté, minimalisme, et clarté. Cela va à l'encontre du style de conception qui prédominait auparavant, le skeuomorphism qui utilise des boutons brillants et des illustrations imitant des objets 3D réels..

Le design plat vise essentiellement à rationaliser les sites Web, à mettre l’accent sur le contenu, à offrir des interactions plus intuitives et à offrir une expérience utilisateur plus rapide et plus fonctionnelle. Il est également facile d'utiliser ses éléments simples en forme de boîte et ses dispositions basées sur une grille pour une conception réactive..

Problèmes d'utilisabilité de la conception à plat

Bien que la conception plate nous apporte une aide précieuse et une formidable boîte à outils pour fournir à nos utilisateurs des sites Web rapides et sans encombrement, elle peut poser certains problèmes d’utilisation, en particulier lorsqu’elle est trop utilisée..

Aucun signifiant visuel de la cliquabilité

Si nous utilisons des effets tridimensionnels, cela donne naturellement une illusion de profondeur à nos dessins. Cela aide les utilisateurs rapidement trouver des éléments interactifs, ceux sur lesquels on peut soit cliquer (comme des boutons et des icônes), soit remplir (comme des champs de formulaire). L’un des principaux problèmes du design plat est qu’il est difficile pour les utilisateurs de reconnaître les éléments cliquables.

Avant l’époque du flat, les concepteurs de sites Web indiquaient généralement la possibilité de cliquer sur des solutions visuelles telles que dégradés, textures, bords relevés ou ombres portées faire en sorte que les boutons et autres objets cliquables ressemblent à une pression sur.

La conception à plat manque de ces signifiants visuels et doit résoudre la même tâche avec un ensemble d'outils beaucoup plus petit: couleurs, formes, proximité, et éléments contextuels.

Pourquoi est-ce un problème? Essayons une expérience.

Regardez cette capture d'écran ci-dessous. Essayez de deviner quels éléments sont cliquables sur la base de cette capture d'écran. Ce ne sont pas ceux que vous penseriez en premier. Nous pouvons trouver de nombreux autres problèmes d’utilisabilité similaires sur le Web..

Découvrabilité réduite du fait de l'absence d'axe Z

Les gens dans la vie réelle trouvent des objets et se déplacent dans trois dimensions: les axes x, y et z. Lorsqu'ils rencontrent un site Web plat et minimaliste sans effets 3D, ils vivent une expérience différente de celle à laquelle ils sont habitués, avec lesquels ils sont principalement familiers..

Cela signifie qu'ils doivent faire plus d'efforts pour découvrir les relations entre les objets, et comprendre la hiérarchie visuelle du site. Par exemple, nous devons passer plus de temps sur la page d'accueil du réseau de développeurs Microsoft pour décoder visuellement les informations et la fonction des différents éléments du site..

La règle empirique dans la conception UX est de toujours essayer de minimiser la charge cognitive sur l'utilisateur afin de maximiser la convivialité. Comme on peut le constater dans de nombreux cas, cela n’arrive pas toujours avec un design plat.

Faible densité d'information

Le design plat a également été critiqué pour avoir risqué une faible densité d'informations par le groupe d'experts Nielsen-Norman de UX.

Dans leurs critiques sur la convivialité de Windows 8, ils ont utilisé des exemples d'applications Windows Store et le site Web du Los Angeles Times pour montrer les problèmes que faible densité d'information (avoir peu d’histoires sur l’écran initial, des titres sans résumé, un regroupement à peine reconnaissable, etc.) peuvent causer du point de vue de la convivialité.

Sous un autre aspect, moins d’informations peut également être vu comme éliminant les distractions, permettant aux utilisateurs de se concentrer uniquement sur des choses importantes, mais si le minimalisme est excessif, il peut facilement sacrifier l’objectif principal d’un site, c’est-à-dire transformer les informations pour les spectateurs..

La montée de l'appartement 2.0

Alors que de plus en plus de concepteurs reconnaissent les défauts d’utilisation du design plat, une nouvelle version, plus mature, est apparue: “Appartement 2.0” ou “Presque plat” conception. Alors que le passage du skeuomorphism à l’appartement était radical, l’évolution du design plat est beaucoup plus insaisissable.

Le nouveau style est toujours plat, mais ça rajoute un peu de trois dimensions aux dessins sous la forme de ombres subtiles, rehauts, et couches. Flat 2.0 - s’il est bien utilisé - peut résoudre les problèmes d’utilisabilité susmentionnés en ramenant un peu de réalisme (skeuomorphism), et en ajoutant de la profondeur et des détails, tout en conservant les avantages du minimalisme tels que sites Web rationalisés, clarté et temps de chargement des pages plus rapide.

Conception matérielle

Le nouveau langage de conception de Google, appelé Material Design, est probablement l'exemple le plus remarquable du style Flat 2.0. Google a publié Material Design avec Android L en 2014. Bien que Material Design conserve les principales caractéristiques du design plat, il utilise certaines métaphores de la physique pour aider les utilisateurs à trouver rapidement des analogies entre le monde réel et le monde numérique..

Material Design utilise l’axe des z, donne profondeur subtile à la conception, et utilise intelligemment les couches par en les séparant par des ombres portées et des animations. Google a décrit en détail comment cela fonctionne, et il vaut vraiment la peine de le lire pour en comprendre les principes et les règles..

Conclusion

Étant donné que les bons designers cherchent toujours à améliorer l'expérience de leurs utilisateurs, le secteur de la conception Web évolue constamment. Le design plat a rapidement remplacé le skeuomorphism, entraînant mises en page minimalistes basées sur la grille et éléments simplistes qui ont récemment envahi le Web (cela a donné lieu à des discussions sur le fait que la conception de sites Web devient ennuyeuse, voire mourante, mais elle ne pourrait pas être plus éloignée de la vérité).

Flat 2.0 apporte des réponses aux problèmes perçus du design plat. C'est un compromis judicieux entre fonctionnalité, esthétique et facilité d'utilisation. Bien sûr, nous n’avons pas besoin d’utiliser les kits d’interface matérielle partout, mais comprendre la philosophie derrière cela peut nous donner une base solide sur comment développer notre propre style conformément aux dernières découvertes en matière de conception d'expérience utilisateur.