Dvacet designových stylů

Od prázdné stránky minimalismu po ornament viktoriánského tisku: odkud se každý styl vzal, jak ho poznat a jak ho designéři tvoří dnes.

Design · Vizuální styly · 20 min

Designový styl je soubor rozhodnutí, která chodí spolu: paleta, druh písma, způsob, jak stránku zaplnit nebo vyprázdnit, a nálada, kterou lidé poznají během vteřiny. Když styly znáte jménem, snáz zadáte práci klientovi, najdete reference a pravidla porušíte záměrně. Tento článek prochází dvacet z nich, od přísné mřížky švýcarského designu po zářící stuhy polárních gradientů. U každého najdete krátkou historii, znaky, podle kterých ho poznáte, recept na barvy, písmo a nástroje a plakát nakreslený v daném stylu. **Všech dvacet plakátů jsou původní ilustrace vytvořené pro tento článek**, takže ukazují jazyk každého stylu, aniž by kopírovaly cizí dílo.

Styly málokdy vzniknou z ničeho. Většina má svůj kořenový okamžik, třeba umělecké hnutí, novou technologii nebo film, a po letech se vrací, když je objeví nová generace. Graf řadí všech dvacet podle těchto kořenů: viktoriánský ornament od 30. let 19. století, surrealismus od manifestu André Bretona z roku 1924, švýcarský design z Curychu a Basileje 50. let, pixel art z arkádových automatů konce 70. let a nejmladší, glassmorphismus a polární gradienty, z obrazovek konce 10. let 21. století. Prázdná kolečka označují návraty a mnohé přicházejí dvacet až čtyřicet let po originálu, kdy je vzhled dost starý na to, aby budil nostalgii, ale ještě ne tak starý, aby působil jako historie.

Minimalismus

Minimalismus ořezává design tak dlouho, dokud každý zbylý prvek nemá svůj úkol. Vyrostl z minimalistického umění 60. let, kde Donald Judd a Agnes Martin zredukovali sochu a malbu na kvádry, mřížky a linie, a své designové motto našel ve větě Dietera Ramse *Weniger, aber besser*: méně, ale lépe. Na stránce to znamená velkorysý prázdný prostor, jedno nebo dvě písma, přísné zarovnání a neutrální barvy s jediným akcentem. Prázdné místo není zbytek; je to nejsilnější prvek plakátu, který oko žene rovnou k červenému kruhu. Produktové weby, aplikace a luxusní obaly mluví tímto jazykem, protože působí klidně a sebejistě. Rizikem je fádnost: když je na stránce tak málo, je vidět každé rozhodnutí o mezerách a písmu. Obvyklými nástroji jsou Figma a Illustrator a skutečná práce se odehrává spíš v hodnotách mezer než v kreslení.

Maximalismus

Maximalismus je odpověď, kterou architekt Robert Venturi dal v roce 1966 na „méně je více“: „Méně je nuda.“ Oslavuje vzor na vzoru, křiklavé barvy, vrstvený ornament a písmo, které křičí. Proslavila ho skupina Memphis, kterou v roce 1981 v Miláně založil Ettore Sottsass, svými klikyháky, potisky terrazza a bonbonovými barvami, a od konce 10. let 21. století se vrací v módě, interiérech i vizuálních identitách značek. Dobrý maximalismus je přesto uspořádaný. Na plakátu paprsky, puntíky, květy i pruhy opakují stejné čtyři barvy a písmo sedí přesně uprostřed, takže chaos má páteř. Bez této hranice se změní v šum. Designéři ho stavějí v Illustratoru pomocí vzorků a nástrojů Repeat a pak ve Photoshopu vrství textury a fotografie.

Surreálný design

Surreálný design si půjčuje logiku snů: obyčejné předměty na nemožných místech, měřítko bez smyslu, světlo, které se řídí vlastními pravidly. Hnutí začalo Surrealistickým manifestem André Bretona v roce 1924 a malíři jako Salvador Dalí a René Magritte mu dali jeho poznávací znamení: ostré, realistické podání absurdních nápadů. Právě tato kombinace je dodnes klíčová. Dveře na ilustraci jsou nakreslené prostě, s uvěřitelným stínem na podlaze, a proto noční obloha v nich, schodiště do mraku a oko na nebi působí znepokojivě. Dnes styl žije na obalech alb, v módních kampaních a v umění na sociálních sítích a obvykle vzniká skládáním fotografií ve Photoshopu nebo modelováním scény v Blenderu či Cinema 4D. Generativní nástroje jako Generative Fill ve Photoshopu umožní nápady rychleji načrtnout, ale nejsilnější surreálné obrazy stále začínají jedním jasným, podivným nápadem.

Švýcarský design

Švýcarský design, nazývaný také mezinárodní typografický styl, vzešel z Curychu a Basileje v 50. letech. Josef Müller-Brockmann, Armin Hofmann a Emil Ruder ho postavili na mřížce, textu zarovnaném vlevo s nepravidelným pravým okrajem, objektivní fotografii a bezpatkovém písmu; Helvetica i Univers vyšly v roce 1957 a staly se jeho typickými písmy. Výsledek působí racionálně, protože racionální je: každý prvek sedí na sloupci a asymetrie je vypočítaná. Na plakátu obrovské slovo malými písmeny a nakloněný červený pruh vypadají volně, ale slovo, textové bloky i drobné popisky začínají na slabé šestisloupcové mřížce za nimi. Kniha Müllera-Brockmanna *Grid Systems in Graphic Design* (1981) je dodnes příručkou. V praxi si nejprve nastavíte mřížku v InDesignu nebo Figmě, vyberete jednu bezpatkovou rodinu a necháte velikost a polohu dělat práci, kterou v jiných stylech dělá barva a ornament.

Y2K design

Y2K design zachycuje optimismus přelomu tisíciletí, zhruba let 1997 až 2004, kdy byl internet nový a budoucnost vypadala naleštěně. Jeho přísadami jsou písmo z tekutého chromu, duhové pastely, bubliny, průsvitný plast jako u iMacu G3 od Applu z roku 1998, drátěné glóby a všude třpytky. Prostupoval videoklipy, displeje mobilních telefonů a rané weby a kolem roku 2020 se silně vrátil přes módu a sociální sítě, často díky lidem příliš mladým na to, aby si originál pamatovali. Chrom na „2000“ je tu jen gradient s ostrým tmavým pruhem uprostřed, stejný trik, jaký designéři kdysi dělali nástroji pro přechod a Bevel and Emboss ve Photoshopu. Dnes skutečný chrom renderují Blender a Cinema 4D, zatímco ploché pastelové vrstvy kolem obstará Illustrator nebo Figma.

Editoriál

Editoriální design je řemeslo časopisů, novin a dlouhých textů: postarat se, aby spousta textu a několik silných obrazů působily jako jeden příběh. Jeho moderní podoba hodně vděčí Alexeji Brodovičovi, artdirektorovi *Harper's Bazaar* v letech 1934 až 1958, který pracoval s bílým prostorem, ořezanou fotografií a dramatickým měřítkem. Znaky jsou velký titulek časopisu, často v kontrastním patkovém písmu, jeden dominantní obraz, upoutávky na obálce v jasné hierarchii a drobné detaily jako číslo vydání a čárový kód. Obálka tu patří časopisu, který neexistuje, ale drží se skutečných konvencí: vlasy modelky překrývají titulek, nadpis je druhá největší věc na stránce a podpírají ho drobné bezpatkové řádky. Standardem oboru je Adobe InDesign, s alternativami Affinity Publisher a QuarkXPress, a styl se přesunul i na web v podobě dlouhých článků, jako je tento.

Pixel art

Pixel art bere každý jednotlivý pixel jako záměrný tah štětcem. Zrodil se z omezení: arkádové automaty a domácí konzole konce 70. a 80. let měly drobná rozlišení a malé palety, takže umělci kladli každý bod ručně. Nintendo Entertainment System například kreslil obraz o pouhých 256 × 240 pixelech. Z těchto omezení se stala estetika, kterou dnes udržují hry jako *Stardew Valley* (2016) a *Celeste* (2018) a ikony a avatary všude kolem. Dobrý pixel art se vyhýbá rozmazaným hranám, používá hrstku barev a detail spíš naznačuje, než aby ho kreslil; scéna tu leží na mřížce 40 × 50 s omezenou paletou, stínování vzniká záměnou barvy za tmavší a v místech, kde se potkávají pásy oblohy, je šachovnicový dithering. Oblíbeným nástrojem je Aseprite, alternativou Pyxel Edit a nástroj Tužka ve Photoshopu. Pixel art vždy zvětšujte metodou nejbližšího souseda, aby každý pixel zůstal ostrý.

Clay styl

Clay styl vypadá tak měkce, že byste ho chtěli zmáčknout: zaoblené tvary, matné povrchy, pastelové barvy, jemné stíny a veselý, hračkovitý charakter. Kořeny má v loutkové animaci, jako jsou Wallace a Gromit studia Aardman, poprvé uvedení v roce 1989, ale nedávný trend pochází z 3D ilustrace. Zhruba od roku 2020 se aplikace a weby zaplnily nafouklými renderovanými postavičkami a ikonami a v návrhu rozhraní získal vzhled jméno „claymorphism“. Efekt závisí víc na světle než na tvaru. Každá kulička je tu radiální gradient se světlým bodem vlevo nahoře a tmavším okrajem plus měkký stín pod ní, což je ručně udělaná verze toho, co spočítá 3D renderer. Běžnými nástroji jsou Blender, Cinema 4D a prohlížečový Spline; v CSS dají dva vnitřní stíny a jeden vnější na zaobleném boxu plochou verzi stejného dojmu.

Glassmorphismus

Glassmorphismus dává panelům rozhraní vzhled matného skla: průsvitná karta rozostřuje barevné tvary za sebou a doplňuje ji tenký světlý okraj a jemný odlesk. Ranými verzemi byly Aero Glass ve Windows Vista (2007) a materiál Acrylic ve Fluent Design System od Microsoftu (2017) a do módy ho v roce 2020 uvedl macOS Big Sur od Applu, tedy ve stejném roce, kdy se mezi designéry rozšířil název „glassmorphism“. Funguje jen tehdy, když je za sklem něco výrazného, a proto barevné skvrny za kartou neustále plují. Na webu je celý efekt jediná vlastnost CSS, backdrop-filter: blur(), a ve Figmě efekt Background blur. Nebezpečím je čitelnost: text na rozmazaném, pohyblivém pozadí může neprojít kontrolou kontrastu, takže sklo nechte mírně neprůhledné a text tučný.

Cyberpunk

Cyberpunk je vzhled „high tech, low life“: deštěm zmáčené ulice, věže neonových nápisů, hluboké fialové proťaté elektrickou purpurovou a azurovou. Pochází spíš z fikce než z designu, především z filmu *Blade Runner* Ridleyho Scotta (1982), románu *Neuromancer* Williama Gibsona (1984) a *Akiry* Kacuhira Ótomoa (1988), a pro nové publikum ho v roce 2020 osvěžila videohra *Cyberpunk 2077*. Jeho grafickými znaky jsou záře, glitch a tma. Titulek tu tvoří tři kopie téhož slova, posunuté od sebe v purpurové, azurové a bílé, aby napodobily rozladěnou obrazovku, a záře každého nápisu je rozmazaná kopie položená pod ostrou linku. Designéři to stavějí ve Photoshopu pomocí záře vrstev, v After Effects efekty záře a rozdělení RGB a celá 3D města v Blenderu nebo Unreal Engine.

Pop art

Pop art vzal obrazy reklamy a komiksů a pověsil je do galerií. Začal v 50. letech v londýnské Independent Group, kde Richard Hamilton v roce 1956 vytvořil svou slavnou koláž, a v 60. letech explodoval v New Yorku s Andym Warholem a Royem Lichtensteinem. Jeho jazyk se snadno pozná: ploché základní barvy, silné černé obrysy, bubliny, zvukové efekty a body Ben-Day, tisková metoda, kterou Benjamin Day zavedl v roce 1879 a která skládá tóny z drobných barevných teček. Všechno na plakátu, od pole teček po výbuch za „POW!“, je vzor nebo plochý tvar se silným obrysem. Tečky napodobí filtr Color Halftone ve Photoshopu a rastrové vzory v Illustratoru a tajemstvím je střídmost v barvách: stačí tři barvy a černá.

Retro

Retro design si půjčuje z minulosti, na kterou mnoho diváků rádo vzpomíná, nejčastěji z 50. až 80. let. Tento plakát se opírá o 70. léta: teplé oranžové, hnědé a hořčicové tóny, vrstvené duhové oblouky, masivní zaoblené písmo a vrstva zrna, která napodobuje starý tisk. Retro se od historického stylu, jako je viktoriánský, liší tím, že mu nejde tolik o přesnost jako o pocit; vybere pár signálů doby a přežene je. Značky ho používají kvůli nostalgii a vřelosti, proto ho vídáme na obalech potravin, u řemeslných nápojů a v hudbě. Tajnou přísadou je nedokonalost: jemná textura, paleta vybledlá jako na slunci, hrany ne příliš ostré. Opotřebení dodají Procreate a Photoshop s texturovými štětci, písmolijny prodávají mnoho písem oživených ze starých katalogů a to, které je použité zde, Shrikhand, je bezplatné písmo od Googlu se stejně masivním dojmem.

Koláž

Koláž skládá obraz z útržků: z trhaného papíru, vystřižených fotografií, novin, lepicí pásky a barvy. Georges Braque a Pablo Picasso vlepovali papír do svých obrazů od roku 1912 a dadaisté, především Hannah Höchová, z fotomontáže udělali ostrou politickou zbraň. Koláž působí ručně a trochu rebelsky, protože střihy jsou vidět; hrany jsou hrubé, měřítka se tlučou a nic nepředstírá, že je jedna fotografie. Na plakátu má každý papírový tvar natržený obrys a mírné pootočení, páska je průsvitná a písmena vypadají jako vystřižená z různých časopisů, ve stylu vyděračského dopisu, který koncem 70. let proslavily punkové letáky. Někteří designéři dodnes pracují s nůžkami a skenerem. Digitálně tu práci odvedou masky vrstev ve Photoshopu a naskenované textury papíru a pro skládání koláží na iPadu je oblíbený Procreate.

Vektorová grafika

Vektorová grafika je postavená z matematických křivek místo pixelů, takže se dá zvětšit z ikony v telefonu na billboard, aniž by ztratila ostrost. Její křivky jsou Bézierovy křivky, které v 60. letech vyvinul inženýr Pierre Bézier pro navrhování aut v Renaultu, a k designérům je v roce 1987 přinesl Adobe Illustrator. Styl, který s nimi přichází, je čistý: ploché barevné výplně, hladké hrany, geometrické tvary a často žádné obrysy. Krajina tu je čistě vektorová a jeden kopec je zobrazený jako vybraný v editoru, s kotevními body a táhly, která řídí každou křivku; sledujte, jak se táhlo otočí a kopec se s ním přetvaruje. Illustrator, Affinity Designer, bezplatný Inkscape i Figma fungují takto a ukládají do SVG, vektorového formátu webu, ve kterém je nakreslený i každý obrázek tohoto článku.

Futuristický styl

Futuristický design si představuje zítřek a zítřek každé doby vypadá jinak. Kosmický věk 50. a 60. let nám dal tvary bumerangu, bistra ve stylu Googie a čisté bílé interiéry filmu *2001: Vesmírná odysea* (1968); dnešní verze je tmavší a uhlazenější, převzatá z rozhraní ve sci-fi filmech a z grafiky kosmických agentur. Jejími znaky jsou hluboká pozadí, zářící gradienty, tenké linky, velkorysé prostrkání a široké geometrické písmo jako Orbitron, použitý zde. Drobné technické detaily, jako souřadnice, ryskové značky a rohové závorky, naznačují přesnost, aniž by říkaly cokoli konkrétního. Důležitý je i pohyb, takže družice na oběžné dráze a skenovací linka jsou součástí vzhledu. Designéři kreslí vrstvu rozhraní ve Figmě nebo Illustratoru, planety a objekty renderují v Cinema 4D nebo Blenderu a obrazovky animují v After Effects.

Ručně psaný styl

Ručně psaný design používá lettering, psací písma a čmáranice, aby působil osobně, jako by ho skutečný člověk udělal právě pro vás. Na cedulích a plakátech existoval odjakživa, ale v 10. letech 21. století zažil boom s trendem ručního letteringu a štětcových písem, kterému pomohly tablety: iPad Pro a Apple Pencil přišly v roce 2015 a Procreate se stal standardní kreslicí aplikací letteristů. Kouzlo tkví v nepravidelnosti, takže čáry se chvějí, účaří se naklánějí a slova se podtrhávají a zakroužkovávají jako v sešitě. Na ilustraci se čmáranice samy dokreslují, a tak se styl často objevuje i v animaci. Mnoho značek kombinuje jedno ručně psané slovo s úhledným bezpatkovým písmem, aby stránka zůstala čitelná. Letteristé často skicují v Procreate a tvary pak obtáhnou jako vektory v Illustratoru; písmo zde je Caveat, bezplatné písmo od Googlu.

Bohémský styl

Bohémský neboli boho design má jméno po umělcích, kteří v Paříži 19. století žili nekonvenčním životem, a vzhled po kontrakultuře, cestování a lidových řemeslech 60. a 70. let. Je teplý a zemitý: terakota, písková, rezavá a šalvějová, přírodní textury, makramé, tkané vzory kilimů, pampová tráva, oblouky a slunce. Spíš než přísný systém je boho nálada sesbíraných věcí, které k sobě tak docela neladí. Ilustrace vrství oblouk, slunce, šalvějové kopce, vlnící se trávy, makramé závěs a tkaný okraj v šesti zemitých tónech. Styl je běžný v interiérech, svatebních tiskovinách, módě a wellness značkách. Designéři ho malují v Procreate nebo Illustratoru texturovými štětci a šablonové nástroje jako Canva zpřístupnily boho paletu širokému okruhu lidí. Když design přebírá vzor z konkrétní kultury, vyplatí se vědět, odkud ten vzor pochází.

Graffiti

Graffiti design přenáší energii ulice na stránku. Moderní graffiti vyrostlo ve Filadelfii a New Yorku na konci 60. a v 70. letech, kdy writeři pokrývali vagony metra tagy, throw-upy a barevnými piecy a do sebe zaklesnutá písmena „wildstylu“ se stala samostatnou uměleckou formou. Jeho znaky jsou silné obrysy, písmena, která se naklánějí a překrývají, stékající barva, opar spreje, odlesky a za tím vším cihlová nebo betonová zeď. „FRESH“ tu sleduje klasickou stavbu: tmavý posunutý stín vzadu, silný černý obrys, bílá keyline, gradientová výplň a pár jisker, se stékajícími kapkami barvy. Na zdech writeři pracují se sprejem; pro tisk a obrazovku umělci skicují sprejovými štětci v Procreate nebo Photoshopu a písmena dolaďují jako vektory v Illustratoru.

Polární záře

Design polární záře, často nazývaný aurora nebo mesh gradienty, používá měkké, zářící pásy barev, které se do sebe rozpouštějí jako severní světla. Od konce 10. let 21. století se rozšířil na webech technologických firem a v pozadích aplikací jako teplejší alternativa k ploché barvě a často se za obsahem pomalu pohybuje. Barvy jsou obvykle zelené, tyrkysové, modré a fialové na tmavém podkladu a tvary jsou velké a silně rozmazané, takže není vidět žádná hrana. Ilustrace dělá přesně tohle: tři vlnité tvary, každý gradient, rozmazané a plující různou rychlostí po noční obloze. Ve Figmě efekt vzniká z velkých rozmazaných elips (Layer blur), Illustrator nabízí Gradient Mesh a volné gradienty a na webu se dělá rozmazáním v CSS nebo malým shaderem ve WebGL. Text držte na klidném místě, protože jasné pásy snižují kontrast.

Viktoriánský styl

Viktoriánský styl patří do doby vlády královny Viktorie, 1837 až 1901, do věku průmyslového tisku. Nové lisy a chromolitografie zlevnily ornament, takže plakáty a obaly zaplňovaly každý centimetr rámečky, ozdobnými tahy, rytými ilustracemi a mnoha písmy najednou: dřevěným písmem, patkovými a psacími písmy na jediném listu. Paleta je sytě vínová, lahvově zelená, zlatá a pergamenová. William Morris a hnutí Arts and Crafts se proti továrně vyráběnému ornamentu postavili, což něco vypovídá o tom, jak těžkopádný uměl být. Etiketa tu používá jeho konvence: symetrii, oválný medailon s rytým stínováním, stuhu, rohové kudrlinky a tři písma v jasném pořadí. Dnes se styl objevuje na whisky, v holičstvích, u lékárnických značek a ve steampunku. Designéři ho stavějí v Illustratoru pomocí ornamentálních štětců a rytinových textur a písma jako IM Fell, digitální oživení písem ze 17. století, dodají dobový dojem.

Najděte svůj styl na mapě

Výběr stylu začíná u pocitu, který potřebujete, ne u trendu roku. Mapa rozmisťuje všech dvacet na dvě osy, od klidného k hlučnému a od digitálního k ručnímu, jako hrubé redakční vodítko, nikoli měření. Klidné digitální styly jako minimalismus, švýcarský design a glassmorphismus se hodí k produktům, které mají působit důvěryhodně a snadno se používat. Hlučné ruční styly jako graffiti, koláž a maximalismus se hodí ke značkám, které chtějí působit živě a osobně. Mnoho nejlepších návrhů míchá dva sousedy na mapě, třeba švýcarskou mřížku s jedním ručně psaným slovem nebo futuristické rozhraní změkčené barvami polární záře. Klepnutím na kterýkoli bod se k danému stylu vrátíte.

Zdroje a další čtení

Philip B. Meggs a Alston W. Purvis, *Meggs' History of Graphic Design* (Wiley, 6. vyd. 2016)
Josef Müller-Brockmann, *Grid Systems in Graphic Design* (Niggli, 1981)
Robert Venturi, *Complexity and Contradiction in Architecture* (MoMA, 1966)
Dieter Rams, deset principů dobrého designu („Weniger, aber besser“)
André Breton, *Manifeste du surréalisme* (1924)
William Gibson, *Neuromancer* (1984); Ridley Scott, *Blade Runner* (1982)
Michal Malewicz, „Glassmorphism in user interfaces“ (UX Collective, 2020)
Barbara Radice, *Memphis: Research, Experiences, Failures and Successes of New Design* (Rizzoli, 1984)
Písma použitá na plakátech pocházejí z Google Fonts: Archivo, Playfair Display, Caveat, Press Start 2P, Orbitron, Permanent Marker, Bangers, Shrikhand, Fredoka, IM Fell English, Rubik Mono One a Amatic SC

*Každý plakát v tomto článku je původní ilustrace nakreslená ve vašem prohlížeči v duchu svého stylu, nikoli kopie skutečného díla. Data na časové ose a pozice na mapě jsou přibližné a redakční.*