Le design a parcouru un long chemin pour obtenir une apparence moderne et épurée. Comme nous allons parler de Flat design et de Material Design, je vous propose de faire un petit bond dans l’histoire afin de mieux comprendre d’où nous sommes partis.

Tout d’abord, un peu d’histoire…

 

Tout commence avec le Skeuomorphisme. Ce style est caractérisé par des éléments d’interface informatique reproduisant des objets physiques. Ce terme est devenu populaire en 2007 lors de la sortie du premier Iphone.

A cette époque, il était important pour les designers de créer des interfaces simples et familières pour les utilisateurs (non-)expérimentés. Le Skeuomorphisme fut inventé pour habituer la population au passage du réel vers le numérique.

Aujourd’hui, nous sommes à l’aire de la simplicité amélioré. Mais ce n’est pas pour autant que ce style de design a disparu. Nous pouvons encore le voir dans le domaine de la production de jeu vidéo, le but étant d’immerger au maximum le joueur dans le gameplay.

Qu’est ce que le Flat Design? 

 

Le Flat Design (littéralement “Design plat”)  est la réaction au Skeuomorphisme, il consiste à la combinaison d’élément graphique (icône, police, couleurs…). Il supprime totalement les éléments superflus, à l’inverse du Skeuomorphisme, pour laisser place à la simplicité. Ce style graphique considère donc la simplicité comme la clé pour atteindre un résultat parfait. Fini les ombres, les dégradés et autres textures! La tendance est aux formes simple et aux aplats de couleurs.

Pourquoi avons-nous besoin de ces changements?


Tout d’abord, c’est une question de vitesse de fonctionnement.
Le design skeuomorphe est surchargé de textures détaillées et d’autres éléments déjà mentionnés. Tous ces éléments ralentissent le temps de chargement d’une application.

Les autres avantages du Flat Design est qu’il permet de créer des interfaces attrayantes avec n’importe quelle résolution d’écran. Les éléments se complètent, l’utilisateur n’est donc pas distrait par le contenu trop lourd du graphisme.

De plus, les images bidimensionnelles peuvent aider à naviguer à travers différents type de contenu. De telles images peuvent être comprises clairement grâce à leur aspect schématiques et assez simple. Microsoft est un pionnier dans l’application du Flat Design dans leurs produits (Windows est un très bon exemple).

Les modifications apportées à ce nouveau système d’exploitation visaient à prendre en charge les appareils mobiles et les tablettes. C’est pourquoi la principale fonctionnalité qui a été mise à jour était l’écran de démarrage, qui affiche maintenant les programmes sur une grille de tuiles. C’est très pratique si l’on considère Windows comme un système d’exploitation multi-plateforme.

Malheureusement, cela n’a pas vraiment fonctionné. L’UI du système d’exploitation n’est pas optimal. Les utilisateurs sont confus car les éléments sont trop similaires. Ils n’arrivent pas à aller au bout de leurs actions. Les éléments cliquables ressemblent à des logos simples. Microsoft échoue à l’idée principale de toute conception numérique – pour simplifier l’interaction avec le produit. Avec Windows 10, Microsoft se rattrape en prenant en compte la réaction des utilisateurs.

L’entreprise Apple, depuis IOS 7 sortie mi-2013, décide de s’adapter, elle aussi, au Flat Design. Ce changement fut bien mieux accueillis par les utilisateurs car Apple n’a pas essayé de refondre complètement leurs icônes. Ils ont simplement effectué des corrections aux designs existants en ajoutant des aplats. Cela fonctionne très bien, les utilisateurs n’ont aucun problème à reconnaître les outils.

Qu’est ce que le Material Design?

 

Google est à l’origine du style Material Design. On pourrait le nommé “Material Design de Marque” car elle a été créée selon une vision particulière du design. En réalité, c’est une branche du Flat Design.

Si Apple a ajouté la planéité à un design existant, Google a apporté ses corrections, mais maintenant avec une simplicité améliorée.

La raison pour laquelle Google a décidé d’introduire son design est claire.

En tant que propriétaire d’Android OS, Google présente un langage de design pour que tout les support soient à jour graphiquement.

 

Quelle sont les principales caractéristiques du Material Design? Nous allons vous expliquer.

Le Flat Design présentait encore plusieurs inconvénient. Pour les utilisateur inexpérimentés, les interactions étaient encore un peu compliquées.

Comme dit précédemment, dans le cas de Microsoft, les éléments cliquables se distinguaient à peine des textes et icônes non cliquable. Google a essayé de résoudre ce problème et introduit des ombres dans leur design. Les objets deviennent tridimensionnels, ce qui permet aux utilisateur de distinguer les éléments importants.

 

 

 

Voici une autre divergence: l’utilisation de nuances de couleur.

Nous pouvons appeler le Material Design une “édition à plat” car c’est un mélange de Flat Design avec certaines caractéristiques du Skeuomorphisme (les nuances, les couches et l’animation)  pour rendre ce style plus convivial et lisible.

Il est grand temps d’analyser toutes les informations mentionnées précédemment et de faire une liste des avantages et des inconvénients.

La comparaison:

Flat Design :

  1. Les avantages

    • Minimaliste et branché. 
    • Facilement compréhensible.
    • L’utilisateur peut saisir l’idée à l’aide d’icônes et d’images simples.
    • Gain de temps.
    • Augmentation de la vitesse de chargement des éléments, ce qui signifie un meilleur UX.
    • Destiné au contenu.
    • Rien dans ce design ne détourne l’utilisateur du contenu lui-même.
    • Égalité.
    • Il s’affiche sur n’importe quel appareil.
    • Rend le processus de développement logiciel / site Web plus rapide en réduisant le code.
  2. Les Inconvénients

    • La simplicité ne suffit pas.
    • Le Flat Design peut sembler sans relief et ennuyeux dans certains cas.
    • Limité dans l’utilisation des éléments graphiques.
    • Pas assez intuitif.
    • Interaction compliquée pour les utilisateurs inexpérimentés.
    • Omniprésent.
    • Il est difficile de se démarquer de la foule lorsque tout le monde a un modèle de design plat similaire.

Material Design:

  1. Les Avantages

    • Minimaliste et branché. 
    • Plus convivial.
    • Plus facile à utiliser.
    • La conception matérielle est un bon choix pour un utilisateur avec n’importe quel niveau d’interaction numérique.
    • Contient des éléments skeuomorphes qui sont utilisés pour améliorer l’UX.
    • Developer-friendly. Avec une ligne directrice particulière fournie par Google. De cette façon, vous pouvez vous y référer si vous avez rencontré des problèmes en travaillant votre projet.
    • Développe l’animation pour les solutions web.
    • Nous ne pouvons pas ignorer le fait que l’animation fournit une nouvelle expérience utilisateur.
  2. Les inconvénients

    • C’est la propriété de Google. Il sera difficile de changer quelque chose sans la permission du détenteur des droits.
    • Les animations dans les applications peuvent affecter les consommations d’énergie de votre appareil.
    • Les concepteurs sont limités en raison des règles de Google en matière de style.
    • Un jour, ce fait pourrait arrêter le développement du style.

Conclusion

 

Il est idiot d’affirmer quel est le design le plus beau ou le plus pratique car tous les goûts sont différents. Les deux sont modernes et élégants. Ils sont similaires et différents en même temps. Le Material Design a été créé comme une alternative à la planéité complète. Il a ajouté une pincée de skeuomorphisme dans sa structure.