LA CLOCHE

Il y a ceux qui ont lu cette nouvelle avant vous.
Abonnez-vous pour recevoir les derniers articles.
Email
Nom
Nom de famille
Comment voulez-vous lire The Bell
Pas de spam

Le design plat est récemment devenu populaire dans les applications et les sites Web. Cela ne veut pas dire que tout le monde aime absolument ce style, mais il ne convient certainement pas à toutes les applications et sites. Le design plat présente de nombreux avantages, tels que la simplicité et le minimalisme, ce qui le rend plus facile à utiliser. Pour certaines applications, la conception plate peut être trop simple. Autrement dit, ajoutez des ombres ou des dégradés pour le rendre meilleur.

Beaucoup de gens affirment que la conception Web plate est une conception efficace. Ils disent que c'est un moyen de rendre le projet aussi convivial que possible. Voici quelques exemples de design plat inspirants. Cette sélection de divers portefeuilles est idéale pour comprendre les conceptions plates qui fonctionnent vraiment.


L'ISSLand

Créatif de janvier

Singe minimal

Qu'est-ce que le design plat?

  • Design plat axé sur l'utilisateur
  • Le design plat est simple
  • Design plat - moins de dégradés
  • La conception plate comprend des lignes droites et des coins carrés
  • Un fort contraste de couleur est généralement utilisé
  • Le design plat n'a pas d'ombres, de biseaux, de textures ou de ce qui ressemble à la 3D
  • Le design plat n'existe qu'en 2 dimensions
  • Design plat - la tendance à la simplicité et au minimalisme
  • Design plat - n'utilisez pas d'effets supplémentaires
  • Il n'y a pas de modules complémentaires
  • Design plat - moins de boutons et de kits de carrosserie
  • Le design plat signifie se concentrer sur les polices
  • Les combinaisons de couleurs, les couleurs contrastées et les variations de couleurs intéressantes sont des ingrédients importants dans le design plat.
  • Le design plat est l'un des nombreux modèles. Il convient à certains projets, mais pas à d'autres.

Ce qui n'est pas un design plat

  • Le design plat n'est pas un skeuomorphisme ou un design qui émule la forme et les contours de la «réalité».
  • Le design plat n'inclut pas les boutons brillants
  • Le design plat n'inclut pas la décoration
  • Dans le design plat, vous ne trouverez pas les concepts traditionnels de "profondeur"
  • Le design plat ne convient pas à tous les projets

Le design plat est-il simplement un design efficace?

Certains considèrent que le design plat lui-même est un design efficace. Autrement dit, cela simplifie l'utilisation des sites et des applications, vous permet de trouver information nécessairesans être distrait. Bien entendu, le design plat n'est pas le seul à faciliter la recherche d'informations. Si tout est bien fait, les utilisateurs n'auront aucun problème. Le projet doit être simple et facile pour ceux qui sont capables de l'utiliser. Certaines personnes préfèrent utiliser un design plat, tandis que d'autres préfèrent un style de design différent.

Éléments pour un design plat

Vous aimez le design plat? Voici quelques éléments qui peuvent être utilisés pour un design plat.

Pack d'icônes plat

Le design plat est une direction de conception clé pour les années à venir, nous vous invitons donc à mieux le connaître et à apprendre les 5 principes fondamentaux qui le sous-tendent.

Apprendre à connaître design platohm

En russe, le design plat se traduit par «design plat», et il est devenu un favori absolu après présentations Apple OS IOS. Une approche minimaliste de la conception pour la convivialité était au premier plan. Le pari est fait sur le confort de l'utilisateur. Il s'agit d'une protestation prononcée contre le «squerforming» (visualisation d'objets, comme dans la réalité). Le choix s'est porté sur des solutions esthétiques plus simplifiées et en même temps simples. Les utilisateurs qui en ont assez des visualisations réalistes ont accueilli cette direction avec enthousiasme, et de plus en plus de projets Web passent à ce format.

Je voudrais noter que "plat" ne veut pas dire "ennuyeux". Les solutions de design plat peuvent être belles, elles sont plus raffinées, plus propres, sans redondance, se transformant en «îlot de tranquillité». Ils rendent enfin le contenu compréhensible. Il reste à apprendre les principes de base pour les appliquer dans la pratique.

Principe n ° 1: à bas les effets inutiles

Le design "plat" ne cherche pas à transmettre des volumes, il est donc basé sur une visualisation bidimensionnelle. Cela signifie que vous ne verrez ni ombres, ni réflexes, ni reflets avec des textures (à l'exception des ombres longues). Seul le transfert des contours, et rien de plus.

Principe n ° 2: le plus simple est le meilleur

Il est recommandé d'utiliser des figures monosyllabiques dans la conception, ainsi que de suivre la clarté des contours, qui est conçue pour souligner la légèreté et l'apesanteur. De plus, de tels éléments laconiques imitent bien le capteur, générant une envie d'interagir avec l'objet (un appel à appuyer, toucher). Cependant, la simplicité des éléments n'est pas égale à la simplicité de la conception dans son ensemble - elle ne s'applique qu'au contour. En conséquence, tout ce que l'utilisateur voit est clair pour lui et il peut facilement l'utiliser.

Principe n ° 3: la typographie et son importance

Le design plat encourage une extrême prudence lors de l'utilisation des polices. Autrement dit, leur caractère est obligé de compléter le schéma de conception, sans le contredire. De plus, dans le design plat, la police est également un élément clé de navigation.

Principe n ° 4: accents de couleur

Non seulement le type, mais aussi la couleur sont une partie essentielle du design plat. La grande majorité des palettes sont basées sur 2-3 couleurs, bien que, bien sûr, il y ait des exceptions. Habituellement juteux et lumineux, mais des couleurs pures sont choisies. Comme indiqué, il n'y a pas de dégradés ou de transitions inutiles.

Principe n ° 5: Choisissez le minimalisme

Le design plat est un exemple frappant d'une tendance mondiale telle que le minimalisme. Les concepteurs abandonnent les «cloches et sifflets» inutiles, s'éloignent des approches complexes et implicites de la visualisation, qui donnent des résultats sous la forme d'activité de l'utilisateur.

Plat ou presque plat? Nous recherchons un compromis!

En conclusion, je voudrais noter qu'aujourd'hui il existe une synergie entre la conception plate et non plane. Il s'agit d'un design "presque plat". C'est l'application la plus courante du concept décrit, lorsque, avec des éléments simples et laconiques et un espace bidimensionnel, les concepteurs utilisent 1 à 2 techniques pour la profondeur et la perspective.

La tendance de 2017 était également la conception semi-plate - conception semi-plate. Influencé par le Material Design, il est devenu un peu plus spatial. Des ombres claires apparaissent qui rendent le dessin semi-plat. Le design plat est toujours d'actualité aujourd'hui, en raison des ombres, il est devenu plus profond et plus complexe, mais le concept de base n'est pas violé.

Dans cet article, je vais vous présenter le design plat. Vous avez probablement déjà entendu quelque chose à ce sujet, car l'appartement est devenu l'une des principales tendances du Web ces dernières années.

Aujourd'hui, nous allons examiner ce qu'est le design plat, comment il est né et ce dont vous avez besoin pour créer un design épuré, dynamique et réactif.

tu peux trouver bons exemples design plat sur http://market.envato.com/. Il existe des tonnes de mises en page, d'icônes et de modèles pour vous donner une solide compréhension de ce à quoi ressemble le design moderne. .

1. Qu'est-ce que le design plat?

Design plat - style moderne interface utilisateur, ainsi que la conception graphique, caractérisée par le minimalisme. Le design plat se caractérise par l'utilisation d'un minimum d'éléments et l'absence d'effets divers de texture, d'ombre et de lumière, par exemple: couleurs mélangées, dégradés, reflets, etc.

Flat s'oppose au skeuomorphisme( le skeuomorphisme est un principe de conception, lorsqu'un produit a l'apparence d'un autre, c'est-à-dire lorsque divers éléments d'interface sont copiés à partir d'objets réels - traduction env.) Cependant, il faut dire que le design plat n'est pas du tout aussi simple qu'il y paraît à première vue. Il inclut certaines caractéristiques du skeuomorphisme, mais nous en reparlerons un peu plus tard.

En général, flat aide à garder l'utilisateur concentré sur le contenu sans être distrait par les visuels. Le design plat met l'accent sur la simplicité des éléments tout en rendant l'interface plus réactive, agréable et plus facile à utiliser.

2. Un peu d'histoire

Le design plat est connu pour avoir existé bien avant qu'il ne devienne une tendance mondiale sur le Web. Le design plat était très populaire dans les années 80 en raison du fait que la technique à l'époque n'était pas encore assez développée pour supporter des effets, des textures et des ombres complexes. Cependant, même dans ce cas, la conception tendait au séphomorphisme, essayant de rendre les éléments d'interface aussi réalistes que possible.

Le design plat, dans la forme dans laquelle nous le voyons maintenant, a commencé à gagner en popularité après que Microsoft a commencé à produire des produits dans le style dit métro. Metro est une conception d'interface utilisateur de Microsoft qui surprend par son style et sa simplicité.

En 2010 Microsoft a publié Téléphone Windows 7, qui utilisait un design plat avec des arêtes vives et des graphiques simples hérités d'un premier produitMicrosoft (Zune). Plus tard, inspiré par le succès, Microsoft a publié le système d'exploitation Windows 8 basé sur le même style Metro plat.

Après tout, le design plat a culminé en 2013 lorsque Apple a publié iOS 7 présentant fondamentalement nouveau design avec des éléments d'interface utilisateur entièrement repensés, y compris des icônes et des polices. Apple a créé principes visuels de l'interface utilisateur et de la conception d'icônes .

Peu de temps après, Google a également commencé à utiliser le style plat dans ses applications et ses pages Web, en l'appelant Conception matérielle ... Google a même une section entière consacrée à ce style, y compris une description des objectifs de la conception Web, ses principes et des directives pour créer divers objets de conception: icônes, mises en page, etc.

Depuis ce temps, plat est devenu focus clé dans la conception Web en rendant les sites Web, les applications et les éléments d'interface élégants, propres et élégants.

Ainsi, il existe trois exemples mondiaux de design plat d'entreprises, sans lesquels il est difficile d'imaginer le monde moderne de la technologie:

Conception Metro de Microsoft

Conception Apple iOS 7

Conception matérielle de Google

3. N'oubliez pas la propreté

Le design plat est apparemment appelé «plat» en raison du manque d'éléments tridimensionnels et d'effets réalistes tels que des dégradés, des textures, des reflets, des demi-teintes, des ombres. N'oubliez pas que le style plat est une manière bidimensionnelle (plate) de représenter des objets.

De plus, dans le design plat, les objets sont représentés de manière très simplifiée et stylisée.

Et parfois même une simple silhouette ou les contours d'un objet sont utilisés, c'est-à-dire juste assez pour rendre l'objet reconnaissable, mais pas le surcharger avec des détails mineurs.

Le minimalisme est devenu une tendance mondiale de nos jours: la simplicité des formes et l'utilisation d'arêtes vives créent un design épuré et agréable. Les formulaires simples sont plus faciles à comprendre et à comprendre. Cela garde le design minimaliste, propre, sans lui donner un aspect occupé et désordonné.

4. Perfection

Sachez que lorsqu'il s'agit de créer des icônes plates et des éléments d'interface utilisateur, vous devez les rendre nets, nets et parfaits au pixel près. autant que possible. De plus, cela s'applique aux graphiques raster et vectoriels.

Le programme Adobe Photoshop tout est clair ici: cela fonctionne avec des graphiques bitmap basés sur des pixels.

Concernant le programme Adobe Illustrator, puis il utilise des graphiques vectoriels, constitués de courbes et de lignes, appelées vecteurs, qui sont définies par des formules mathématiques.

Il était une fois Adobe Illustrator n'était pas beaucoup programme pratique pour créer des graphismes au pixel près. La bonne nouvelle est que dernières versions Illustrateur d'acier super outil pour créer de bons graphiques.

Je dois dire que graphiques vectoriels implique principalement de travailler avec des formes simples et plates, des couleurs unies et des grilles. Adobe Illustrator est très flexible dans les paramètres et vous permet d'adapter la grille à vos besoins, d'aligner des objets et d'utiliser divers types claquer. Cela facilite la création du design parfait qui semble propre et élégant sur n'importe quel écran. Si vous voulez apprendre à créer des graphiques parfaits, vous devriez lire l'article: Comment créer des illustrations au pixel près à l'aide d'Adobe Illustrator .

5. Couleur

L'une des caractéristiques les plus spécifiques du design plat, en plus des ombres, est l'utilisation de la couleur. La plupart des couleurs utilisées par le design plat dans leurs éléments ne sont constituées que de quelques couleurs de base.

La couleur dans un design plat se distingue par sa luminosité, sa saturation et sa richesse.Le jeu de couleurs plat ne se limite pas à quelques couleurs spéciales; il contient de nombreuses nuances et leur choix dépend uniquement de ce que vous représentez, qu'il s'agisse d'icônes de bonbons ou d'objets rétro dans une palette rétro sophistiquée.

Disons que vous êtes un concepteur d'interface et que vous maîtrisez les palettes de couleurs, vous expérimentez une barre de couleurs dans programmes Photoshop et Illustartor, mélangeant les couleurs à votre guise. Cependant, ce processus est assez compliqué et nécessite beaucoup d'intuition, d'expérience et de compétences. Voici quelques outils qui peuvent vous aider à créer votre propre palette de couleurs.

Certains d'entre eux conviennent à toutes sortes de design et d'illustration, pas seulement à un design plat. Par exemple, Adobe Color CC, mieux connu sous le nom de Cooler. Aujourd'hui, il est disponible à la fois sur le site Web et directement via les produits Adobe. Le Cooler est un outil très flexible qui vous permet de créer votre propre palette de couleurs ou de choisir parmi des palettes personnalisées de la bibliothèque.

Coolors est un autre générateur de palette de couleurs simple et pratique. Appuyez simplement sur la barre d'espace et le programme générera une palette de couleurs, vous pourrez corriger les couleurs, il y a aussi une fonction d'exportation.

Il existe quelques autres services similaires avec des palettes personnalisées qui pourraient vous être utiles. Cependant, il existe un outil spécialement créé pour la conception à plat: FlatUIColors.com de Designmodo - un service avec un ensemble de couleurs «plates», très pratique à utiliser. Ce site est devenu très populaire auprès des designers à la recherche de bonnes combinaisons de couleurs pour des designs parfaits. Essayez-le!

Et vous pouvez également trouver une plus grande variété de couleurs et de palettes dans Guide de conception matérielle de Google.

6. Longues ombres

Comme mentionné ci-dessus, le design plat se caractérise par sa simplicité, beaucoup d'espace libre - c'est pourquoi flat rejette l'utilisation de tout effet. Cependant, il existe un effet typique du design plat. Cet effet est devenu une tendance et une caractéristique de l'appartement.

Nous parlons maintenant de longues ombres. Ils ont certaines caractéristiques typiques qui rendent cet effet reconnaissable, à savoir l'inclinaison de 45 degrés et grande taille (L'ombre peut être plusieurs fois plus longue que le sujet lui-même. Par conséquent, de longues ombres donnent à l'appartement un effet de profondeur.

Cet effet donne à l'objet un aspect plus tridimensionnel, tout en le conservant dans un contexte de conception plate.

7. Utilisation des polices

La typographie joue un grand rôle dans le design plat. Souvent, le texte devient l'élément principal de la composition.

Flat utilise généralement des polices de caractères simples pour rendre la conception dans son ensemble propre et lisible. Vous pouvez trouver de nombreuses polices gratuites dans Adobe Typekit si vous utilisez des produits Adobe. Font Squirrel a également de nombreuses bonnes polices gratuites. Mais n'oubliez pas de lire la licence si vous comptez utiliser la police dans le commerce.

Le plus souvent dans un design plat, il est habituel d'utiliser des majuscules et des couleurs contrastées, ce qui rend le texte plus lisible.

Utilisez les polices avec précaution, rappelez-vous qu'elles doivent mettre en valeur et correspondre au motif, et non ressembler à un élément distinct. Cela ne signifie pas que vous ne pouvez pas utiliser de polices serif ou de polices complexes manuscrites. Gardez-le au minimum et gardez tout en équilibre. Cependant, flat utilise encore plus souvent des polices sans empattement, car elles semblent plus strictes et soignées.

8. Avantages et inconvénients du design plat

Malgré le fait que le design plat soit devenu si populaire en raison de ses nombreux avantages, il présente toujours des inconvénients auxquels les concepteurs sont confrontés lorsqu'ils utilisent ce style. Jetons un coup d'œil aux avantages et aux inconvénients.

avantages

Popularité

Le flat design est devenu une tendance, recueillant de plus en plus de retours positifs / de la part des designers et des web designers, et il ne semble pas du tout perdre du terrain. Au contraire, il se répand de plus en plus, acquiert de nouvelles formes et fonctionnalités, devient de plus en plus créatif.

Simplicité

Le design plat est simple, minimaliste et propre. Flat on the Web aide les utilisateurs à se concentrer sur le contenu plutôt que d'être distraits par les visuels. Cela fonctionne également pour les interfaces applications mobiles: design épuré avec gros boutons fait usage appareils mobiles parfait.

Luminosité

La couleur est un autre avantage intéressant dans le design plat. Les couleurs vives et saturées semblent attrayantes et propres, et l'absence de dégradés rend le design élégant. De plus, ces couleurs pures rendent le design plus positif, présentable et plat crée la bonne ambiance.

désavantages

L'appartement a bien d'autres avantages, mais aucun design n'est parfait et nous ne pouvons l'idéaliser. Voici quelques-uns des inconvénients du design plat que nous devons mentionner:

Absence de réponse

Parfois, le manque de détails ou de visuels importants rend le processus de création d'une interface conviviale difficile, ce qui rend généralement l'ensemble de la conception insensible. Tous les utilisateurs ne trouvent pas un appartement confortable, car il peut être difficile de trouver des éléments sur une page Web sur lesquels vous devez cliquer ou appuyer sur l'écran. téléphone portablecar ils ne sont pas interactifs.

Problèmes d'impression

Comme mentionné précédemment, toutes les polices ne peuvent pas s'adapter à un design plat. Parfois, une police de caractères aussi riche et aux arêtes vives semble vraiment équilibrée et élégante. Cependant, si la police n'est pas choisie correctement, elle peut détruire la conception entière. Vous devez vraiment avoir une bonne idée des polices qui conviennent pour les polices plates et de celles qui ne le sont pas. Le manque d'expérience rend le choix d'une police très difficile.

Visuels faibles

En raison des limitations dans l'utilisation des effets, des couleurs et des polices, flat peut paraître trop simple et trop froid. Son minimalisme peut également être son principal inconvénient - d'autres modèles plats finissent par avoir exactement le même aspect que le vôtre. Par conséquent, il est très difficile de rendre vos icônes ou pages Web différentes de la conception de quelqu'un d'autre car vous utilisez les mêmes formes simplifiées, des palettes de couleurs limitées et des polices similaires. En conséquence, le design plat peut devenir ennuyeux avec le temps.

9. Futures tendances du design plat

Cela ne veut pas dire que le flat design s'est complètement formé et s'est arrêté à sa manière, c'est peut-être à cause de ses défauts, mentionnés ci-dessus, que le flat a tendance à se développer et à changer, à acquérir de nouvelles fonctionnalités et à améliorer l'expressivité visuelle.

Si vous regardez de près le dernier exemple de design plat, vous remarquerez peut-être qu'il progressivement de ses outils rigoureux et commence à ajouter des effets subtils tels que des dégradés, des ombres, des éclairages et autres effets visuels.

Ces petites choses donnent au design plat une certaine profondeur sans surcharger les détails comme dans le design skeuomorphic. Ces améliorations mineures rendent l'appartement plus réactif et confortable, ainsi que lui apporter un nouveau look, rendant l'appartement plus flexible et polyvalent.

Ainsi, l'appartement ne perd pas ses caractéristiques, mais il devient plus intéressant et flexible.- ça va vraiment mieux.

conclusions

Ainsi, nous avons discuté de certains faits de l'histoire du design plat et parlé des couleurs, des formes et de la typographie. Nous avons examiné différents points de vue, insisté sur les avantages et les inconvénients de l'appartement et appris quelques-uns des principes fondamentaux de la création d'un bon design.

J'espère que vous avez appris de nouvelles informations de cet article, ou du moins que vous l'avez trouvé intéressant. Vous devez essayer de créer un design plat si vous ne l'avez pas déjà fait.

Après tout, que faut-il mentionner d'autre sur le design plat?

Si vous aimez vraiment le plat avec ses bords nets, ses couleurs juteuses et ses polices nettes, sa pureté et son minimalisme, alors allez-y!

C'est tendance, mais comme pour tout autre style graphique, ne vous limitez pas à une seule technique. Si flat est tendance, cela ne signifie pas que vous ne pouvez pas utiliser d'autres styles dans votre projet. Le skeuomorphisme, avec ses petits détails et textures, peut également devenir bonne décision... Surtout, rappelez-vous que le design est différent pour chaque projet, il doit exprimer son esprit, son but, son essence, tout en restant pratique et fonctionnel. Vers l'avant!

Le mot «plat» dans la traduction de l'anglais signifie «plat». Depuis sa création, le soi-disant design plat a continué à tenir sa position depuis plusieurs années maintenant, occupant une position de leader sur le marché.

Comment tout a commencé

La conception Web a changé plusieurs fois depuis sa création. Il a parcouru un long chemin, des éléments simples et ennuyeux aux éléments tridimensionnels, convexes et presque matériels. Cela peut être facilement vu dans l'exemple de la modification de l'apparence du système d'exploitation Windows. La composante visuelle se développe parallèlement au développement de la technologie. Mais ses nouvelles tendances indiquent plutôt un retour au minimalisme et à la simplicité.

Du skeuomorphisme au design plat

Le style précédant l'appartement était le skeuomorphisme. C'est la principale tendance du design depuis très longtemps. Le skeuomorphisme est un style pseudo-volume, dont tous les éléments imitent apparence objets réels ( carnet, réveil), à l'aide d'ombres, de textures naturelles et plus encore. Ses principaux exemples ont été trouvés dans les premières interfaces de smartphone. Il a commencé à perdre sa position après 2010, lorsque les concepteurs de grandes entreprises ont commencé à se tourner vers la simplification et à développer les interfaces des utilisateurs a commencé à se débarrasser de la caractéristique principale du skeuomorphisme - la tridimensionnalité.

Un excellent exemple visuel de la différence de styles est la photo ci-dessous. L'image de gauche est un dessin plat et l'image de droite est skeuomorphe.

Caractéristiques du style plat

Flat est un style 2D. Il n'a absolument aucun effet visuel tel que des transitions de couleurs douces, des ombres, des textures volumétriques. Bref, tout ce qui fait une image en trois dimensions.

Le contenu informatif principal est constitué d'icônes (icône du design plat). Ils doivent être aussi clairs que possible pour l'utilisateur si ça arrive sur les applications pour smartphones. Pour les sites Web, les icônes sont les principaux éléments qui reflètent sa spécificité et son message d'information. En règle générale, ils sont présentés sous la forme de simples formes géométriques, cercle ou carré, avec une image conventionnelle caractéristique.

Lors du développement de Flat-design, une attention particulière est portée à la palette de couleurs. Il doit être monotone, non intrusif ou distrayant pour l'utilisateur. Le plus souvent, une couleur pure et plusieurs nuances contrastées sont utilisées. À propos, il existe de nombreux services Internet avec des couleurs de conception plates que vous pouvez utiliser en copiant les codes hexadécimaux des couleurs que vous aimez.

La typographie (texte) est tout aussi importante. En raison de la simplicité générale, le composant textuel se distingue particulièrement. Cela signifie qu'il doit être lisible et ne pas contredire le style général. Cela dépendra de votre choix de police et de couleur.

Exemples de design plat

Commençons par le fait que les icônes de nombreuses ressources Internet bien connues sont passées du côté plat et réseaux sociaux... Il n'y a pas si longtemps, les géants Google et YouTube ont également changé leur design en plat. en fonctionnement système Windows, à commencer par le chiffre huit, a complètement abandonné tous les signes de volume dans les icônes, ce qui a plu à l'œil de certains utilisateurs dans versions précédentes, et a commencé à adhérer au design plat. Les développeurs d'applications mobiles pour iOS et Android ont emboîté le pas.

Les sites d'une page (landing pages) utilisent largement les avantages du Flat design, pour lequel le rôle décisif n'est pas joué par une apparence prétentieuse, mais par la fonctionnalité et la lisibilité.

Évolution du design plat

Au début, le design Flat était en effet complètement plat, ce qui créait certaines difficultés pour les utilisateurs habitués aux boutons en relief. Si dans le skeuomorphisme, la cliquabilité des boutons était immédiatement perceptible, alors dans les premières variations de la conception à plat, il n'était pas toujours possible de déterminer l'interactivité des éléments la première fois.

Après que Microsoft a publié Windows 8, conçu dans un style plat, tous les utilisateurs n'ont pas été en mesure de comprendre immédiatement la nouvelle interface et les icônes sur lesquelles ils pouvaient cliquer. L'apparence des éléments n'indiquait aucune interaction possible avec eux. Cette conception était plus pratique pour les applications mobiles, qui ont repris cette idée. Et le premier à le faire pomme dans la conception iOS 7.

Cependant, le design plat ne reste pas immobile et évolue vers une complication. Aujourd'hui, il ressemble de plus en plus à un design semi-plat ou, comme on l'appelle aussi, Flat 2.0. Des effets de profondeur, d'ombres, de dégradés ont commencé à y apparaître. La profondeur dans la conception plate est obtenue en plaçant des éléments à différents niveaux ou à un angle.

Quoi qu'il en soit, le style est au sommet de sa popularité et est très demandé. Ainsi, si vous envisagez de concevoir votre site Web, vous pouvez opter en toute sécurité pour le design plat. Et si vous avez besoin d'éléments manquants pour votre site, vous pouvez trouver sur Internet un grand nombre d'éléments d'interface utilisateur de conception plate gratuits (gratuits à télécharger), par exemple des icônes, des polices, des modèles et d'autres composants nécessaires de l'interface utilisateur.

Avantages et inconvénients du style

Sans aucun doute, dans la vie trépidante d'aujourd'hui, un style informatif aussi discret est plus pratique que son prédécesseur. Le design plat présente un certain nombre d'avantages indéniables.

La chose la plus importante est peut-être chargement rapide les pages Web. Les sites qui utilisent un design plat s'ouvrent beaucoup plus rapidement que les sites surchargés d'animations et d'autres objets lourds. Le temps de chargement est particulièrement important pour l'optimisation du référencement et la promotion du site Web.

L'apparence simplifiée facilite la lecture du texte et vous permet de vous concentrer sur le contenu principal.

Le design est harmonieux et holistique, ce qui crée une impression générale agréable.

Rien ne peut être parfait et le design plat ne fait pas exception. Malgré toute sa simplicité apparente, il n'est pas si facile de développer une conception Web plate vraiment réussie. Il y a une chance de le rendre ennuyeux et peu attrayant. Ou vice versa, être trop intelligent avec le design et oublier la fonctionnalité. La tâche principale du développement de Flat-design est de maintenir l'équilibre parfait entre beauté et convivialité.

Le flat design (flat design) est aujourd'hui l'une des principales tendances, à la fois dans le domaine de la conception web et des technologies de création d'interfaces utilisateurs. Les exemples récents les plus notables sont la décision audacieuse de Microsoft dans cette direction, avec Windows 8 et le nouveau design de Google, avec une volonté claire de se plonger dans le minimalisme.

Voici des exemples d'éléments de définition.

La vie après le Web 2.0

Sous la forme de formes arrondies d'éléments avec toutes sortes d'effets - 3D, ombres, reflets et reflets, dégradés, gaufrage. Le mot de tout ce qui crée de la profondeur et du volume. Les commandes volumineuses et vibrantes, la brillance, les textures et d'autres manifestations de ce genre cèdent la place à des représentations simples et bidimensionnelles d'objets visuels.

Conception de flotteur

La typographie au cœur du style

Notez que c'est la base de la construction d'un site plat. La simplicité des éléments de design Flat, ainsi que les principes du minimalisme, renforcent la valeur de la typographie. Contenu textuel il est possible en principe de remplacer certains graphiques ou images lourds. Aujourd'hui, la typographie est devenue design sur de nombreux sites. Naturellement, comme le design plat est souvent minimaliste, le caractère des polices doit être coordonné avec schéma général, style et composition. Par exemple, les majuscules sont souvent utilisées pour les éléments ou les en-têtes.

Coderwall

Lisez aussi: 12 couleurs primaires et exemples de leur perception par les utilisateurs

Palette de couleurs design plat

Le design plat s'oriente également vers l'expansion de la diversité des couleurs. Les concepteurs Web utilisent de plus en plus la palette de couleurs pour mettre en œuvre, peut-être, le principe de conception de base: le site doit être différent du leur.

Singe minimal

Espace libre, grands éléments

Du début à la fin, il a une base minimaliste, ce qui signifie qu'il adopte également ses principes de base: gros blocs de contenu, grands éléments, espace libre, absence de tracas inutiles et de prétention.

Conception de la barbe

Icônes du design plat, boutons, illustrations

Les boutons, icônes, icônes et illustrations prennent également une apparence 2D. Ils doivent correspondre au style donné sur toutes les pages du site, transmettre l'ambiance du site lui-même et être faciles à comprendre pour tout utilisateur.

Choisir une couleur pour les icônes, ainsi que pour les icônes elles-mêmes, n'est pas une tâche facile. Vous pouvez utiliser des couleurs unies. En vous efforçant de décorer le design, vous devez réfléchir à la manière de rendre le site convivial. D'une part, il est important de ne pas violer le style, et d'autre part, il est nécessaire de rendre les icônes visibles. Dans les illustrations, nous recherchons le minimalisme, en évitant les effets 3D auparavant populaires.

Lisez aussi: 20+ sites Web inspirants avec des illustrations plates dans la conception

Exemples de modèles de site Web d'interface utilisateur plate

Exemples de sites dans le style de Flat design

Identité

83 Design Collectif

Frunatique

Le groupe parapluie

Fondation SLCL

Mon feutre

Behzad

Atlant

Simple comme du lait

Famille Weranda

LA CLOCHE

Il y a ceux qui ont lu cette nouvelle avant vous.
Abonnez-vous pour recevoir les derniers articles.
Email
Nom
Nom de famille
Comment voulez-vous lire The Bell
Pas de spam