Design plat et skeuomorphisme

Les thèmes de conception de design plat et de skeuomorphism ont été largement discutés récemment, en particulier avec la version bêta d'iOS 7. Malgré cela, de nombreuses personnes ignorent encore ces termes et leur signification. Aujourd'hui, nous allons explorer quelques-unes des caractéristiques clés du design plat et en quoi cette tendance du design est différente du skeuomorphism.

Les styles de conception sont généralement étiquetés comme une tendance temporaire. À chaque fois qu'un "nouveau" style émerge, rien ne garantit qu'il va réussir ou rester. Toutefois, à mesure que de plus en plus de concepteurs du secteur commencent à s’adapter à un style de conception particulier, ce style devient plus omniprésent et utile. Cela étant dit, il est courant de penser que la conception plate est nouvelle. Ce n'est pas. Le design plat et les designers plats existent depuis longtemps, mais la nouveauté est le battage publicitaire et l’adhérence de l’industrie que nous avons constatés ces dernières années..

Le design plat est chaud!

Google Embrasse Flat Design



Nous savons tous que Google a une identité forte, guidée par d’excellentes règles de conception. Leur objectif est de fournir une identité visuellement cohérente, simple et moderne. On peut affirmer qu'ils ont affiné leur style de conception avec une approche réductrice, axée sur la couleur et la géométrie. Leur directive sur les actifs visuels sur Behance est très intéressante à revoir!

Microsoft adopte un design plat

Pre-flat Microsoft: Windows Mobile 6.5

En 2010, Microsoft avait décidé que son approche en matière de conception ne répondait pas aux attentes et aux besoins de ses utilisateurs. Au lieu de se concentrer uniquement sur les caractéristiques d'un produit, ils ont décidé de repenser leur approche esthétique en mettant davantage l'accent sur l'expérience de l'utilisateur..

Windows Phone 8

Cela a amené Microsoft à participer à une nouvelle philosophie de conception leur permettant de modifier les éléments visuels (et le comportement) de leurs produits. Ou comme ils aiment le décrire, "faire plus avec moins". C’est ce que Microsoft a réalisé avec sa récente refonte graphique, la sortie de Windows 8 fin 2012 constituant un jalon dans sa nouvelle stratégie de conception..


Design plat et skeuomorphism défini

Un design réaliste est toujours un skeuomorphism, mais un skeuomorphism n'est pas toujours un design réaliste.

Le skeuomorphisme, en particulier pour le design, signifie que nous essayons de ressembler quelque chose que nous savons. Le terme est souvent utilisé de manière incorrecte dans l'industrie. Les concepteurs pensent souvent que le skeuomorphism signifie que vous répliquez l'original. Cependant, un Skeuomorphism ne doit pas nécessairement être une réplique proche d'un objet! En d'autres termes, un design réaliste est toujours un skeuomorphism, mais un skeuomorphism n'est pas toujours un design réaliste. Pour rendre cela encore plus déroutant, le design plat peut être skeuomorphic (mais ce n’est pas obligé).

Rendons les choses plus claires avec une série de photos.

Conception par Alex Volkov

Vous remarquerez qu'il s'agit d'une conception extrêmement réaliste d'un coffre-fort. Ceci est un exemple parfait de skeuomorphism, car il tente de ressembler à quelque chose que nous connaissons (le véritable objet physique, un coffre-fort). En outre, c'est également un excellent exemple de conception réaliste, car elle prend en compte la profondeur, l'éclairage, les ombres, la texture, etc..

le skeuomorphism tente de ressembler à quelque chose que nous connaissons.

Conçu par Justin Pervorse

Ceci est un bon exemple de design plat, car il simplifie un coffre-fort avec des lignes simples et des couleurs fraîches. De toute évidence, il est également assez "plat". toutefois, cette conception intègre également le skeuomorphism parce qu'il essaye de ressembler à un vrai coffre-fort. Vous pouvez évidemment reconnaître la porte du coffre-fort, par exemple.

Conception par Andrew Hesham

Enfin, voici un autre excellent exemple de design plat. Bien que ce ne soit pas une conception skeuomorphic. Vous pouvez comprendre que cette icône ressemble à quelque chose de sécurisé grâce à la combinaison de la forme d’un bouclier et du trou de la clé. Cela dit, cela ne ressemble en aucun cas à un véritable coffre-fort ou à un cadenas. Il emprunte d'autres métaphores pour rendre le sens reconnaissable. Pour résumer: le design plat utilise des éléments et des formes simples associés à des couleurs principalement vives pour souligner la simplicité et la clarté.

Le design plat utilise des éléments et des formes simples combinés à des couleurs principalement vives pour souligner la simplicité et la clarté.

C’est l’explication générale, même si de nombreux acteurs de l’industrie font souvent référence à conception skeuomorphic chaque fois qu'ils signifient une conception réaliste, comme dans le premier exemple. On se réfère à design plat chaque fois que nous entendons une approche plus minimaliste, en deux dimensions. Parfois, le terme design plat skeuomorphic est utilisé, car il combine le meilleur des deux mondes, comme le montre la deuxième image, le coffre-fort plat, skeuomorphic.

Dans iOS 7, Apple combine à la fois un design plat skeuomorphic, tel que l'icône de l'appareil photo, et un design plat non skeuomorphic, tel que l'icône de photos ou l'icône du centre de jeu, par exemple..

iOS 7 icônes

Design Skeuomorphic 101

En général, les applications conçues dans un style skeuomorphic ressemblent et se comportent comme leurs homologues du monde réel. Les gens associent souvent le design skeuomorphic à Apple. Quelques exemples intéressants incluent leur iCal et certaines de leurs conceptions d'icônes (celles antérieures à iOS 7)..


Le design skeuomorphic est souvent un style très exigeant. Il n'est pas facile de reproduire un objet de la vie réelle dans une conception en deux dimensions. De plus, le réalisme est souvent intégré au design skeuomorphic pour le rendre encore plus performant. Un des problèmes auxquels les concepteurs sont confrontés est que ces dessins doivent "se sentir bien". Il est facile pour les utilisateurs de repérer une erreur dans un dessin lorsque vous décidez de créer quelque chose de réaliste. La conception de textures, d'ombres, de profondeurs et de couleurs parfaites pour une interface ou une icône demande beaucoup de travail. Toutefois, la conception skeuomorphic est particulièrement utile lors de la création de produits numériques destinés à un public cible plus âgé, qui pourrait ne pas être familiarisé avec le monde numérique. Cela donne à l'utilisateur le sentiment de reconnaître le produit qu'il utilise. Une bonne remarque cependant est que presque tout le monde a maintenant commencé à reconnaître le "langage numérique" et que nous avons souvent les mêmes comportements numériques dans les interfaces..



Design plat 101

Le design plat tente de mettre l’accent sur la convivialité et la simplicité. C'est souvent une approche minimaliste accompagnée de couleurs vives. Chaque fois que vous entendez parler de design plat par d'autres concepteurs, le mot "expérience utilisateur" est souvent utilisé dans les conversations. En général, les utilisateurs pensent que la conception plate offre à la fois une plus grande facilité d'utilisation et une expérience utilisateur supérieure à celle des conceptions skeuomorphes..

Certains designers de renom, avec leurs principes de conception tels que Dieter Rams, considèrent le design plat ou "le moins de design possible", le meilleur moyen de créer un design durable..

Capture d'écran de Hype Machine, un design plat

La bataille en cours?

Il y a une règle d'or. Choisissez un style que vous aimez et concevez le mieux possible.

Souvent, lorsque vous lisez des articles qui traitent de design plat ou skeuomorphic, cela se termine toujours comme une bataille entre les deux styles. Ils ont tous les deux leurs forces et leurs faiblesses, mais en général, il existe une règle d'or: choisissez un style que vous aimez et concevez-le du mieux possible. Le design plat semble plus facile que le design skeuomorphic, mais en réalité, il est également difficile de créer un grand design plat, tout comme il est difficile de créer un superbe design skeuomorphic. Il est facile de créer un design plat médiocre, il est très difficile de créer un bon design plat. La simplicité est difficile et son raffinement prend du temps.


Conclusion

Même pour les utilisateurs, tout est une question de goût. Certaines personnes aiment le skeuomorphism, d’autres préfèrent le plat, d’autres encore les deux styles. En tant que designer, je recommande fortement de pratiquer autant de styles de design que possible. Plutôt qu'un conflit entre différents styles, nous devrions accepter leurs différences et en faire un choix qui renforce votre application. Un bon design se démarque dans la foule, alors réfléchissez bien à ce qui correspond le mieux à votre concept!