{"id":251789,"date":"2023-09-12T11:10:00","date_gmt":"2023-09-12T08:10:00","guid":{"rendered":"https:\/\/inform.click\/ce-que-le-bauhaus-peut-nous-apprendre-sur-la-conception-infographique\/"},"modified":"2023-09-12T11:26:00","modified_gmt":"2023-09-12T08:26:00","slug":"ce-que-le-bauhaus-peut-nous-apprendre-sur-la-conception-infographique","status":"publish","type":"post","link":"https:\/\/inform.click\/fr\/ce-que-le-bauhaus-peut-nous-apprendre-sur-la-conception-infographique\/","title":{"rendered":"Ce que le Bauhaus peut nous apprendre sur la conception infographique"},"content":{"rendered":"

\n Compar\u00e9 aux beaux-arts, le design a toujours \u00e9t\u00e9 per\u00e7u comme moins inspirant en raison de sa nature pratique. Nous avons seulement pris conscience de l’incroyable puissance du design depuis le si\u00e8cle dernier gr\u00e2ce \u00e0 quelques mouvements de conception qui changent de paradigme.\n<\/p>\n

\n Le Bauhaus<\/a> a \u00e9t\u00e9 l’un de ces mouvements qui ont donn\u00e9 au design<\/strong> une place unique dans l’humanit\u00e9: une discipline unique qui a fusionn\u00e9 l’art et l’artisanat avec une approche philosophique.\n<\/p>\n

\n \u00ab\u00a0Bauhaus\u00a0\u00bb – un terme signifiant litt\u00e9ralement \u00ab\u00a0maison de construction\u00a0\u00bb en allemand – \u00e9tait une \u00e9cole d’art fond\u00e9e par l’architecte Walter Gropius<\/a> en 1919. Lorsque l’\u00e9cole du Bauhaus existait, elle avait ses racines dans trois villes – Dessau (1925-1932), Weimar (1919-1925) et Berlin (1932-1933).Bien que de courte dur\u00e9e et finalement ferm\u00e9 \u00e0 cause du parti politique nazi, le Bauhaus en tant que mouvement a eu une \u00e9norme influence sur l’art, le design et l’architecture qui continue jusqu’\u00e0 nos jours. Parmi les artistes et designers du Bauhaus les plus connus figurent Paul Klee, Johannes Itten, Mies Van der Rohe, Wassily Kandinsky et L\u00e1szl\u00f3 Moholy-Nagy.\n<\/p>\n

\n Plut\u00f4t que de se concentrer sur l’id\u00e9al \u00e9litiste des beaux-arts, le Bauhaus \u00e9tait suffisamment radical \u00e0 l’\u00e9poque pour int\u00e9grer des principes d’art et de design tels que la th\u00e9orie des couleurs, la composition avec une recherche incessante d’une fonctionnalit\u00e9 utile. Il y a beaucoup \u00e0 apprendre des principes r\u00e9volutionnaires du Bauhaus pour la conception infographique. Nous passons ici en revue leurs le\u00e7ons pour rafra\u00eechir votre r\u00e9flexion sur la conception de l’information avec un curieux m\u00e9lange de flair artistique et de rationalit\u00e9 moderniste.\n<\/p>\n

\n L’h\u00e9ritage du Bauhaus
\n<\/h5>\n

\n Il y a les six principes fondamentaux du Bauhaus. Ils sont bas\u00e9s sur une approche minimaliste, d\u00e9finie par des couleurs simples et un design \u00e9pur\u00e9. Le Bauhaus en tant que mouvement, au-del\u00e0 d’\u00eatre une \u00e9cole d’art, avait certaines convictions qui ont fa\u00e7onn\u00e9 son approche de l’art et du design :\n<\/p>\n

    \n
  1. Les produits pourraient \u00eatre fabriqu\u00e9s en s\u00e9rie mais aussi honorer l’esprit artistique de l’individualit\u00e9 et servir la majorit\u00e9 de la population. M\u00eame si une id\u00e9e similaire existait d\u00e9j\u00e0 en Allemagne, elle est apparue sous les feux de la rampe apr\u00e8s le Bauhaus.\n <\/li>\n
  2. L’\u00e9cole d’art du Bauhaus croyait \u00e9galement que les \u00e9tudiants devaient \u00eatre bien \u00e9quip\u00e9s dans les domaines artistique, social, \u00e9conomique, technique et spirituel. Cela ferait ressortir le meilleur d’eux-m\u00eames et en ferait des acteurs essentiels de la soci\u00e9t\u00e9.\n <\/li>\n
  3. La Bauhaus School of Arts a pr\u00e9f\u00e9r\u00e9 les professeurs avant-gardistes aux universitaires qualifi\u00e9s. La cr\u00e9ativit\u00e9 artistique a \u00e9t\u00e9 encourag\u00e9e par eux.\n <\/li>\n
  4. Un autre de ses principes comprenait une fusion des arts appliqu\u00e9s et des beaux-arts.\n <\/li>\n
  5. Les adeptes du Bauhaus croyaient qu’un designer devait avoir une exp\u00e9rience approfondie des mat\u00e9riaux.\n <\/li>\n
  6. Ils croyaient fermement au design rationnel et \u00e9taient captiv\u00e9s par un sens moderne de la beaut\u00e9.\n <\/li>\n<\/ol>\n

    \n Le\u00e7ons du Bauhaus pour la conception infographique\n<\/p>\n

    \n Les graphistes peuvent en apprendre beaucoup sur le design moderne qui capture une combinaison d’art, d’abordabilit\u00e9 et d’utilit\u00e9. Examinons les le\u00e7ons que nous pouvons appliquer \u00e0 la conception infographique aujourd’hui.\n<\/p>\n

    \n 1 La forme suit la fonction
    \n<\/h5>\n

    \n Une conception efficace de l’information consid\u00e8re la communication comme sa priorit\u00e9 absolue. De temps en temps, nous voyons une infographie magnifiquement styl\u00e9e qui ne parvient pas \u00e0 transmettre un message m\u00e9morable. L’objectif principal d’une infographie est de communiquer des informations – la forme et le style doivent fonctionner pour atteindre cet objectif et non l’inverse.\n<\/p>\n

    \n
    \n Les c\u00e9l\u00e8bres tables gigognes de Josef Albert jouent sur les formes minimalistes et les combinaisons de couleurs.\n<\/p>\n

    \n L’\u00e9cole du Bauhaus a appris aux \u00e9tudiants \u00e0 enlever les d\u00e9corations inutiles qui n’avaient pas de but fonctionnel. L’expression \u00abla forme suit la fonction\u00bb, invent\u00e9e par l’architecte am\u00e9ricain Louis Sullivan, capture parfaitement l’air du temps du Bauhaus. En suivant cette r\u00e8gle, une bonne infographie doit donner la priorit\u00e9 \u00e0 la lisibilit\u00e9 et r\u00e9duire l’encombrement visuel pour cr\u00e9er une mise au point visuelle claire. En d’autres termes, nous devrions annoncer la mort aux d\u00e9tails ornementaux excessifs.\n<\/p>\n

    \n Vous trouverez ci-dessous une infographie qui suit cette r\u00e8gle. Utilisant des couleurs minimales et des formes g\u00e9om\u00e9triques de base, il communique des informations complexes avec un design tr\u00e8s \u00e9pur\u00e9 et \u00e9pur\u00e9.\n<\/p>\n

    \"\"<\/a> Les routines quotidiennes des cr\u00e9ateurs c\u00e9l\u00e8bres<\/p>\n

    \n 2 La hi\u00e9rarchie visuelle est reine
    \n<\/h5>\n

    \n L’\u00e9cole du Bauhaus a accord\u00e9 une attention particuli\u00e8re aux relations form\u00e9es entre deux contraires. Par exemple, il expliquait le lien entre l’obscurit\u00e9 et la lumi\u00e8re, la gauche et la droite ou le grand et le petit. Et cette relation entre les \u00e9l\u00e9ments cr\u00e9e une hi\u00e9rarchie visuelle.\n<\/p>\n

    \n Prenez les peintures de composition embl\u00e9matiques de Kandinsky (Mondrian?), Par exemple. La taille et la position du rectangle rouge cr\u00e9ent un point focal visuel, formant une relation avec les couleurs et les formes contrast\u00e9es adjacentes qui est tr\u00e8s facile \u00e0 suivre pour nos yeux.\n<\/p>\n

    \"\"<\/a> La peinture de Kandinsky \u00ab\u00a0Blanc-blanc\u00a0\u00bb d\u00e9montre une hi\u00e9rarchie visuelle claire.<\/p>\n

    \n La le\u00e7on ici est de cr\u00e9er une orientation visuelle claire dans la conception infographique en utilisant le contraste, les formes et le positionnement spatial. Dans l’exemple infographique ci-dessous, l’utilisation des couleurs rouge et verte forme un fort contraste qui met en \u00e9vidence la diff\u00e9rence quantitative, tandis que les formes qui se chevauchent au centre cr\u00e9ent un point focal visuel clair.\n<\/p>\n

    \"\"<\/a> Une ann\u00e9e de nourriture \u00e0 NYC infographique.<\/p>\n

    \n 3 La couleur comme m\u00e9dium
    \n<\/h5>\n

    \n Un \u00e9tudiant brillant de l’\u00e9cole des arts du Bauhaus, nomm\u00e9 Josef Albers<\/a>, a d\u00e9velopp\u00e9 le sujet dans son livre embl\u00e9matique, \u00ab\u00a0Interaction of Color\u00a0\u00bb. Josef nous a appris que les couleurs sont relatives et rarement consid\u00e9r\u00e9es comme leurs propri\u00e9t\u00e9s physiques r\u00e9elles. En tant que m\u00e9dium, les couleurs peuvent \u00eatre \u00ab trompeuses \u00bb et \u00ab provocatrices \u00bb. Par cons\u00e9quent, comprendre comment les couleurs interagissent les unes avec les autres peut grandement d\u00e9terminer votre message.\n<\/p>\n

    \n Dans l’exemple illustrant la relativit\u00e9 des couleurs ci-dessous, les carr\u00e9s de la m\u00eame couleur de brun sont per\u00e7us comme ayant des nuances diff\u00e9rentes en raison du contexte dans lequel ils se trouvent. Comprendre les propri\u00e9t\u00e9s intrins\u00e8ques d’une palette de couleurs est la premi\u00e8re \u00e9tape. Pour transmettre le bon message, il faut \u00e9galement tenir compte de l’interaction entre les couleurs lors du choix d’un jeu de couleurs.\n<\/p>\n

    \"\"<\/a> Josef Albers sur la relativit\u00e9 des couleurs.<\/p>\n

    \n Actuellement, les concepteurs choisissent les meilleures palettes pour rendre les sites Web color\u00e9s et correspondre aux propri\u00e9t\u00e9s intrins\u00e8ques des nuances.\n<\/p>\n

    \n La le\u00e7on que les couleurs ont des liens plus profonds est ce qu'emploient les designers modernes. Ainsi, ils choisissent prudemment la meilleure combinaison de couleurs et en font ressortir le sens.\n<\/p>\n

    \n D’autres artistes du Bauhaus ont contribu\u00e9 \u00e0 la th\u00e9orie des couleurs en plus de Josef Albers, comme Johannes Itten<\/a> et sa sph\u00e8re de couleur. La cat\u00e9gorisation de la couleur en couleurs primaires, secondaires et tertiaires<\/strong> est aujourd’hui encore largement utilis\u00e9e pour la conception graphique. La th\u00e9orie des couleurs d’Itten peut guider le concepteur d’infographie pour choisir le meilleur sch\u00e9ma de couleurs pour ses conceptions.\n<\/p>\n

    \"\"<\/a> Cercle de 12 couleurs de Johannes Itten.<\/p>\n

    \n Avec cette th\u00e9orie des couleurs \u00e0 l’esprit, il est beaucoup plus facile de choisir le meilleur sch\u00e9ma de couleurs pour votre infographie sur la base des principes de coh\u00e9rence<\/strong> et de simplicit\u00e9<\/strong>. Une bonne infographie utilise une palette de couleurs coh\u00e9rente tout en gardant une combinaison de couleurs simple. Vous voulez que vos couleurs soutiennent la communication d’informations au lieu d’obstruer ou de distraire votre lecteur du message cl\u00e9.\n<\/p>\n

    \n Par exemple, si vous devez concevoir une infographie sur la fabrication du caf\u00e9, il est pr\u00e9f\u00e9rable d’utiliser le marron comme couleur dominante, car c’est la couleur associ\u00e9e aux grains de caf\u00e9, tout en gardant la palette de couleurs simple. Dans cette infographie<\/a> Nespresso, le design transmet le th\u00e8me en utilisant la couleur marron partout.\n<\/p>\n

    \n Pour utiliser les couleurs de mani\u00e8re coh\u00e9rente et simple pour votre conception infographique, vous pouvez envisager 3 sch\u00e9mas de couleurs: monochromatique, triadique et compl\u00e9mentaire<\/strong>. Un jeu de couleurs monochromatique utilise des couleurs de la m\u00eame teinte mais de saturations diff\u00e9rentes, veillez donc \u00e0 d\u00e9finir vos couleurs de mani\u00e8re \u00e0 ne pas para\u00eetre trop ternes. Pour les d\u00e9butants, il est plus facile de commencer avec un jeu de couleurs triadique o\u00f9 les couleurs sont \u00e0 \u00e9gale distance sur la roue chromatique. Les couleurs compl\u00e9mentaires se trouvent aux extr\u00e9mit\u00e9s oppos\u00e9es de la roue chromatique et sont id\u00e9ales pour cr\u00e9er un contraste.\n<\/p>\n

    \"\"<\/a> 3 types de sch\u00e9mas de couleurs pour l’infographie.<\/p>\n

    \n Enfin, tenez toujours compte du contexte de votre infographie pour choisir les couleurs qui \u00e9voquent les bonnes associations. Par exemple, si vous concevez une infographie pour la saison de No\u00ebl, il est pr\u00e9f\u00e9rable de s’en tenir au jeu de couleurs rouge et vert.\n<\/p>\n

    \n 4 La typographie compte beaucoup
    \n<\/h5>\n

    \n L’un des plus grands h\u00e9ritages de l’\u00e9cole d’art du Bauhaus est la typographie. Les dirigeants du Bauhaus pensaient que la typographie faisait partie int\u00e9grante des graphiques et que les mots devaient \u00eatre plac\u00e9s \u00e0 des angles vifs. Cependant, le sens d’un mot \u00e9tait plus prioritaire que sa conception.\n<\/p>\n

    \n Cette conviction a enseign\u00e9 aux designers contemporains une le\u00e7on majeure. Il les a encourag\u00e9s \u00e0 faire preuve de cr\u00e9ativit\u00e9 avec les styles de police, mais les a \u00e9galement avertis de ne pas s’\u00e9carter du message r\u00e9el qu’ils souhaitaient exprimer. Selon le Bauhaus, la fonction premi\u00e8re de la typographie est de communiquer, et la communication doit appara\u00eetre sous la \u00abforme la plus courte, la plus simple et la plus p\u00e9n\u00e9trante \u00bb.\n<\/p>\n

    \"\"<\/a> Les meilleures polices de caract\u00e8res Bauhaus visent la lucidit\u00e9 et la simplicit\u00e9.<\/p>\n

    \n Pour la conception infographique, en r\u00e8gle g\u00e9n\u00e9rale, nous devons utiliser des polices lisibles et simples afin de communiquer clairement. Des polices trop d\u00e9coratives pour le texte de copie rendront la lecture difficile et distrayante \u00e0 regarder car les textes sont rarement le point central de la conception.\n<\/p>\n

    \n 5 La disposition de la grille
    \n<\/h5>\n

    \n Un bon alignement fait toute la diff\u00e9rence dans la conception graphique. Les pionniers du Bauhaus croyaient en une approche minimaliste de l’organisation visuelle, o\u00f9 tout est \u00e9troitement serr\u00e9 dans des rectangles et des carr\u00e9s. La grille est parfaitement logique pour les concepteurs Bauhaus \u00e0 l’esprit pratique. De nombreux \u00e9l\u00e9ments de conception du Bauhaus sont conformes \u00e0 une grille stricte, comme la couverture du livre et l’\u00e9chiquier ci-dessous.\n<\/p>\n

    \"\"<\/a> Conception pour la grille.<\/p>\n

    \n De nos jours, le syst\u00e8me de grille est un syst\u00e8me d’alignement couramment utilis\u00e9 par les graphistes et les concepteurs de sites Web pour la mise en page. Il reste un syst\u00e8me efficace pour maintenir la hi\u00e9rarchie visuelle tout au long de la section de contenu. Pour la conception infographique, il est indispensable de suivre le syst\u00e8me de grille car plusieurs \u00e9l\u00e9ments doivent \u00eatre arrang\u00e9s, organis\u00e9s et structur\u00e9s pour cr\u00e9er une hi\u00e9rarchie visuelle claire.\n<\/p>\n

    \"\"<\/a> Comment le syst\u00e8me de grille est utilis\u00e9 dans la conception graphique.<\/p>\n

    \n En utilisant un syst\u00e8me de grille bas\u00e9 sur<\/strong> des colonnes comme la grille \u00e0 6 colonnes ci-dessus, vous pouvez d\u00e9finir une ligne directrice sur la fa\u00e7on dont vos \u00e9l\u00e9ments de conception interagissent avec chacun. Cela jette les bases de relations visuelles solides dans votre conception. De plus, les syst\u00e8mes de grille peuvent \u00eatre utilis\u00e9s pour cr\u00e9er du rythme et du mouvement. Dans la conception des couleurs du magazine Bauhaus ci-dessus, la grille en position diagonale cr\u00e9e une sensation de mouvement tandis que les \u00e9l\u00e9ments dens\u00e9ment peupl\u00e9s au centre de la grille produisent une sensation de gravit\u00e9.\n<\/p>\n

    \n Si le syst\u00e8me de grille bas\u00e9 sur des colonnes est le ciment qui maintient votre contenu ensemble, l’utilisation de marges<\/strong> aide \u00e0 d\u00e9sencombrer votre affichage dense d’informations. Vous avez probablement remarqu\u00e9 \u00e0 quel point l’utilisation g\u00e9n\u00e9reuse d’espaces blancs et de larges marges dans les conceptions Bauhaus cr\u00e9e un look \u00e9pur\u00e9 et \u00e9pur\u00e9.\n<\/p>\n

    \n Enfin, avoir un syst\u00e8me de grille vous aide \u00e0 briser la grille. Votre conception devient imm\u00e9diatement percutante lorsque vous enfreignez d\u00e9lib\u00e9r\u00e9ment les r\u00e8gles. Cela rendra votre infographie instantan\u00e9ment plus m\u00e9morable parmi les nombreuses mises en page infographiques \u00e0 l'emporte-pi\u00e8ce. Prenez l’infographie ci-dessous \u00e0 titre d’exemple, la rupture de la grille rectangulaire en haut cr\u00e9e un impact visuel saisissant tandis que le reste de la grille de la page a \u00e9t\u00e9 conserv\u00e9 intact pour conserver l’harmonie visuelle de la conception globale.\n<\/p>\n

    \"\"<\/a> Bon exemple de casser la grille.<\/p>\n

    \n \u00c0 ton tour
    \n<\/h4>\n

    \n Voici les cinq le\u00e7ons essentielles du Bauhaus que vous pouvez utiliser dans votre prochaine conception infographique. Les trouvez-vous faciles \u00e0 comprendre et pratiques \u00e0 suivre ? Avez-vous d\u00e9couvert d’autres principes du Bauhaus adapt\u00e9s aux conceptions infographiques ?\n<\/p>\n

    \n Et si vous \u00eates pr\u00eat \u00e0 franchir le pas, essayez ces principes de conception avec un cr\u00e9ateur d’infographie tel que Visme qui est fourni avec des mod\u00e8les, afin que vous puissiez vous concentrer sur le choix de la police, de la couleur et de la disposition visuelle appropri\u00e9es.\n<\/p>\n<\/p>\n

    \n Source d’enregistrement: instantshift.com<\/a>\n<\/div>\n","protected":false},"excerpt":{"rendered":"

    Compar\u00e9 aux beaux-arts, le design a toujours \u00e9t\u00e9 per\u00e7u comme moins inspirant en raison de sa nature pratique. Nous avons seulement pris conscience de l’incroyable puissance du design depuis le si\u00e8cle dernier gr\u00e2ce \u00e0 quelques mouvements de conception qui changent de paradigme. Le Bauhaus a \u00e9t\u00e9 l’un de ces mouvements qui ont donn\u00e9 au design une place unique dans l’humanit\u00e9 : une discipline unique qui a fusionn\u00e9 l’art et l’artisanat avec une approche philosophique. \u00ab\u00a0Bauhaus\u00a0\u00bb – un terme signifiant litt\u00e9ralement \u00ab\u00a0maison de construction\u00a0\u00bb en allemand – \u00e9tait une \u00e9cole d’art fond\u00e9e par l’architecte Walter Gropius en 1919. Lorsque l’\u00e9cole Bauhaus existait, elle avait ses racines dans trois villes – \u2026<\/p>\n","protected":false},"author":1,"featured_media":191028,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_wp_rev_ctl_limit":""},"categories":[392,197,522,353,652,600,54],"tags":[],"class_list":["post-251789","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-conception","category-creation-de-sites-web","category-divers-fr","category-divertissement","category-sites-internet","category-technologie-et-plus","category-web-et-wordpress"],"_links":{"self":[{"href":"https:\/\/inform.click\/fr\/wp-json\/wp\/v2\/posts\/251789","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/inform.click\/fr\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/inform.click\/fr\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/inform.click\/fr\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/inform.click\/fr\/wp-json\/wp\/v2\/comments?post=251789"}],"version-history":[{"count":0,"href":"https:\/\/inform.click\/fr\/wp-json\/wp\/v2\/posts\/251789\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/inform.click\/fr\/wp-json\/wp\/v2\/media\/191028"}],"wp:attachment":[{"href":"https:\/\/inform.click\/fr\/wp-json\/wp\/v2\/media?parent=251789"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/inform.click\/fr\/wp-json\/wp\/v2\/categories?post=251789"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/inform.click\/fr\/wp-json\/wp\/v2\/tags?post=251789"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}