OBSAH Část B 1 Kompoziční prvky ............................................................................ 10 1.1
Linie ............................................................................................................ 10
1.1.1 Síla linie ................................................................................................. 10 1.1.2 Průběh linie ............................................................................................ 11 1.1.3 Směr linie ............................................................................................... 12 1.2
Tvar ............................................................................................................. 14
1.2.1 Realistické, deformované a stylizované tvary ....................................... 15 1.3
Objem .......................................................................................................... 16
1.4
Tónová hodnota ........................................................................................... 17
1.5
Textura ........................................................................................................ 18
1.6
Negativní prostor ......................................................................................... 19
1.6.1 Zaměnitelnost negativního prostoru ...................................................... 19 1.6.2 Rám obrazu ............................................................................................ 20 1.7
Abstrakce a teorie barev .............................................................................. 20
2 Kompoziční pravidla ........................................................................ 21 2.1
Gestalt ......................................................................................................... 21
2.2
Soulad (Harmonie) ...................................................................................... 22
2.2.1 Soulad (Rozmístění linií) ....................................................................... 22 2.2.2 Soulad (rozmístění tvarů)....................................................................... 23 2.2.3 Opakování linií ...................................................................................... 23 2.2.4 Opakování tvarů ..................................................................................... 24 2.3
Rytmus ........................................................................................................ 25
2.3.1 Druhy rytmů ........................................................................................... 25
2.4
Ohnisko ....................................................................................................... 26
2.4.1 Sekundární ohniska ................................................................................ 27
3 Abstrakce .......................................................................................... 28 3.1
Příklady abstrakce ....................................................................................... 28
3.2
Čtyři základní metody abstrakce ................................................................. 29
4 Teorie barev ...................................................................................... 31 4.1
Aditivní a subtraktivní barvy ...................................................................... 31
4.1.1 RGB model ............................................................................................ 31 4.1.2 CMYK model ........................................................................................ 32 4.1.3 Míchání barev ........................................................................................ 32 4.2
Barvený kruh ............................................................................................... 33
5 Průmyslový design ........................................................................... 34 5.1
Grafické řešení – logo ................................................................................. 34
5.2
Kritéria hodnocení ....................................................................................... 34
5.3
Porovnání loga komerčních společností...................................................... 35
“Web fiktivní hudební skupiny” “Estetika grafické kompozice”
Martin Hübelbauer
Část B – Estetika Grafické Kompozice 1 Kompoziční prvky Kompoziční prvky jsou tím z „čeho“ se kompozice skládá, naopak kompoziční pravidla popisují uspořádání, zásady a principy těchto prvků. Základními kompozičními prvky jsou linie, tvar, objem, tónová hodnota, negativní prostor, textura a barva. Kompoziční prvky se dají přirovnat k notám, jsou nástroji, kterými lze napsat hudbu a kompoziční pravidla jsou jako správná syntaxe notového zápisu.
1.1 Linie Linie je tím nejzákladnějším kompozičním prvkem, a základem většiny grafických řešení, linie se také využívají k náčrtům a skicám díky své jednoduchosti, přirozenosti a snadné možnosti vyjádření myšlenky.
Obr. 24 – Schématický náčrt auta (internet) Zdroj: kiquedesigns.com/sketchbook
1.1.1 Síla linie Linie nejsou jen rovné čáry či schémata, nakreslit je možno jako tenké a jemné čáry, které jsou buďto inspirované přírodou a zakřivené (organické), nebo mohou být nakresleny silnými přímkami a vzbuzovat dojem umělý (syntetický). Linie mohou být kresleny i naopak, a to přímé a slabé, nebo důrazné a všemožně zakřivené, variace tvorby linií závisí jen na grafikovi a jeho řešení příkladem je obr. 24.
10
“Web fiktivní hudební skupiny” “Estetika grafické kompozice”
Martin Hübelbauer
Linie se používají nejčastěji k definování tvaru obrazu, ale tento kompoziční prvek je možno použít v celém grafickém řešení, shluk linií vytvoří tónovou hodnotu (kapitola tónová hodnota) a opakování linií utvoří texturu (kapitola textura).
Obr. 25 – Tónová hodnota (internet) Zdroj: http://goo.gl/dGmnkI 1.1.2 Průběh linie Linie viditelné a linie naznačené jsou dva nejčastější druhy linií využívané při grafickém řešení za použití kompozičních pravidel. Viditelná linie je čára, která je bezprostředně viditelná (má šířku), na druhou stranu linie naznačená je čára která nemá žádnou šířku a to znamená, že není vidět a je to pouze spojnice mezi dalšími různými prvky grafického řešení.
Obr. 26 – Příklad viditelné, a dvou naznačených linií (originál, internet) Zdroj: http://goo.gl/wpZ77x
11
“Web fiktivní hudební skupiny” “Estetika grafické kompozice”
Martin Hübelbauer
1.1.3 Směr linie Směr je neodmyslitelně důležitá vlastnost každé linie, směr vyvolává dojem pohybu, stability nebo klidu a to vše díky lidským zkušenostem, například s gravitací. Svislé linie působí stabilně, to díky zkušenosti se stáním, pokud člověk stojí rovně a nic nenarušuje jeho rovnováhu, působí stabilně a vyrovnaně, stejně tak jako budovy tyčící se k obloze.
Obr. 27, 28 – Voják v pozoru a Empire State Building (internet) Zdroj: http://goo.gl/6s8hXh, http://goo.gl/JY2jGk Vodorovné linie mohou také vyvolat pocit stability, ale na rozdíl od svislých linií evokují klid a harmonii, příkladem tohoto fenoménu jsou naše zkušenosti se spánkem, při spánku je člověk ve vodorovné poloze, která uklidňuje stejně jako pohled na vodní hladinu, duny velké pouště, anebo nízké vrcholky kopců v dálce, to vše jsou vodorovné linie evokující stabilitu a klid.
12
“Web fiktivní hudební skupiny” “Estetika grafické kompozice”
Martin Hübelbauer
Šikmé linie naopak způsobují pocit napětí, rychlosti a nebezpečí, převažující směr linií může razantně změnit pocit a vnímání výsledného grafického řešení, jinou techniku skečů či schémat využije například architekt (převažují svislé linie). Na rozdíl od grafika pracujícím na návrhu sportovních vozů (převažují šikmé linie).
Obr. 29 – Padající komín (internet) Zdroj: http://goo.gl/08mDrE
13
“Web fiktivní hudební skupiny” “Estetika grafické kompozice”
Martin Hübelbauer
1.2 Tvar Dalším kompozičním prvkem po linii je tvar, tvar je definován jako dvourozměrný objekt (nemá hloubku či objem). Tvar může mít hloubku v reálném životě, ale pokud mluvíme o tvaru ve světě digitálním tak je tvar pouze dvourozměrný. Trojrozměrné objekty jsou na monitoru technicky zobrazovány také dvourozměrně (Monitor je plocha definovaná pouze výškou a šířkou). Tvar je velice důležitým kompozičním prvkem, jelikož je to prvek, který nám nejvíce pomůže nejlépe identifikovat vzdálené objekty, dávno předtím než bude zřetelná barva, textura, objem či tón, bude tvar jedinou možností identifikovat pozorovaný objekt, příkladem identifikace z dálky je postava člověka, čím více se člověk přibližuje, tím víc detailů se postupně odhaluje, zda je to muž či žena, co má na sobě a podobně, člověk dokáže rozlišit většinu každodenních objektů bez detailů jako je barva či struktura povrchu, na to je potřeba jen vidět tvar.
Obr. 30 – Postava muže (internet) Zdroj: http://goo.gl/fbWiwH
14
“Web fiktivní hudební skupiny” “Estetika grafické kompozice”
Martin Hübelbauer
1.2.1 Realistické, deformované a stylizované tvary Realismus – Realismus zobrazuje tvary tak jak vypadají ve skutečnosti, jejich dimenze jsou realistické, jejich velikost není přehnaně velká či malá, nejsou nijak deformované, jejich rozmístění je nenápadné a osvětlení odpovídá přírodním zákonům. Realistické obrazy a jiná grafika je to, co je určeno co možná nejširšímu možnému publiku, jde o to je pochopit co možná nejsnáze, jejich poselství má být jasné a přesné, například obraz hory, pod takovým vyobrazením si drtivá většina pozorovatelů vybaví horu bez jakékoliv námahy či snahy pochopit dílo. Deformace – Deformace a realismus jsou si stále blízko, a to tím že většina proporcí z reálného světa zůstává stejná, naopak jiné části například lidského těla jsou záměrně zvětšeny či zmenšeny, tato změna proporcí má za úkol poukázat na fyzický či mentální stav objektu či člověka, příkladem můžou být nadpřirozeně velké svaly znázorňující sílu, či nepřirozeně malý mozek poukazující na omezenost či hloupost individua.
Obr. 31, 32 – Pepek námořník a mozek Homera Simpsona (internet) Zdroj: http://goo.gl/jijzw8, http://goo.gl/zxD0fU
Stylizace – Nízká míra abstrakce (kapitola abstrakce) a snaha zachovat prvky realismu se nazývá stylizace, stylizace je v podstatě zjednodušená kresba či logo, které neklade přílišné nároky na pochopení, ale přesto nabídne velké množství vizuální informace.
15
“Web fiktivní hudební skupiny” “Estetika grafické kompozice”
Martin Hübelbauer
Obr. 33, 34 – WWF & Nasa logo (internet) Zdroj: http://goo.gl/bA7UtR, nasa.gov
1.3 Objem Objem stejně jako tvar charakterizuje objekty, umožňuje lidem vnímat, co představují a lépe na jim porozumět po přidání dalších kompozičních prvků jako je například barva či textura. Na běžných grafických řešeních (například obrazy) je možno věrně zobrazit pouze osy x, y což může být někdy problém, jelikož je objem definován třemi dimenzemi, výškou a šířkou stejně tak jako u tvaru, ale také osou z (hloubka). Toto je hlavní důvod proč se dá věrně objem zachytit pouze z celé řady úhlů, toho se dá dosáhnout pomocí hardware a software podporující zachycení třetí osy Z nebo časového sledu obrázků. (Formát GIF). Objem, který je kriticky důležitý pro umělecká odvětví jako je například sochařství či architektura, pro tyto odvětví umění však platí stejná pravidla kompozice jako pro objekty dvourozměrné.
Obr. 35 – Statický 3D Model (internet) Zdroj: http://goo.gl/ajrv03 16
“Web fiktivní hudební skupiny” “Estetika grafické kompozice”
Martin Hübelbauer
1.4 Tónová hodnota Kompoziční prvek závislý na světle a rozdílech v něm. Je to hodnota, která určuje světlost či tmavost tónu a umožňuje vidět kontrast mezi nimi. Kontrast mezi tónovými hodnotami odhaluje jejich tvar, velký kontrast tónových hodnot například černá x bílá, evokuje silný rozdíl, hloubku či vzdálenost, naopak nepatrný rozdíl působí mělce a je těžší rozpoznat detaily bez bližšího prohlédnutí kompozice. Malé rozdíly v tónové hodnotě také působí pochmurně, či vážně.
Obr. 36, 37 – Příklady vysoké (high-key) a nízké (low-key) tónové hodnoty (internet) Zdroj: http://goo.gl/zbeMi3, http://goo.gl/w0m7r3 Pokud jsou tónové hodnoty světlé, mluvíme o takzvaném high-key lighting. Toto řešení se většinou prezentuje jako radostnější, otevřenější a jasnější, naopak tmavé tónové hodnoty, nazývané low-key, působí ponuře, tmavě a stísněně. (internet - 23) Pomocí tónových hodnot se také na dvourozměrném obrazu dá naznačit objem, světlejší části objektů s objemem jsou ty, na které přímo dopadá světlo, a ty na které světlo nedopadá, jsou v pozadí a ve stínu.
17
“Web fiktivní hudební skupiny” “Estetika grafické kompozice”
Martin Hübelbauer
Obr. 38 – Objem naznačený pomocí (low-key) tónových hodnot (internet) Zdroj: http://goo.gl/UmgRpv
1.5 Textura Textura, nebo také povrchová struktura objektu, existují dva druhy povrchové struktury: hmatatelný a vizuální. Vizuální textura technicky ani není textura, ale jen její iluze. Nemůžeme jí nahmatat nebo se jí dotknout, na druhou stranu hmatatelná textura je příklad textury, kterou můžeme nahmatat, cítit.
Obr. 39 – Příklad hmatatelné textury (internet) Zdroj: en.wikipedia.org/wiki/Pottery 18
“Web fiktivní hudební skupiny” “Estetika grafické kompozice”
Martin Hübelbauer
1.6 Negativní prostor Negativní prostor či vztah obrazce a pozadí je situace kdy prázdná plocha (pozadí) obklopuje prostor pozitivní (obrazec). Negativní prostor se dá u většiny kompozic rozeznat relativně snadno, ale jsou i případy kdy tyto dvě hodnoty splývají nebo se dají zaměnit. (kapitola – abstrakce)
Obr. 40, 41 – Vztah obrazce a pozadí (bílá = obrazec, černá = pozadí). (originál) 1.6.1 Zaměnitelnost negativního prostoru Jsou kompozice, ve kterých se dají oba prostory snadno zaměnit, to se týká hlavně abstraktivního umění, ale není to vždy pravidlem.
Obr. 42 – Ukázka zaměnitelnosti negativního prostoru. (pohár či tváře?). (internet) Zdroj: http://goo.gl/lbKDJV 19
“Web fiktivní hudební skupiny” “Estetika grafické kompozice”
Martin Hübelbauer
1.6.2 Rám obrazu
Obr. 43 – Vliv rámu obrazu na celkovou kompozici (originál) Na obr. 43 lze vidět vliv rámu obrazu na prvky jako je negativní prostor. Obrázek vlevo nahoře nemá žádný rám a působí jako součást celé stránky. Ostatní obrázky s rámy jen poukazují na změnu v negativním prostoru v závislosti na druhu rámu, a na dopad, který to vyvolá na celou kompozici.
1.7 Abstrakce a teorie barev Poslední dva kompoziční prvky jsou barva a abstrakce, tyto prvky jsou však velmi obsáhlé a tak mají svou vlastní kapitolu (kapitola abstrakce) a (kapitola teorie barev).
20
“Web fiktivní hudební skupiny” “Estetika grafické kompozice”
Martin Hübelbauer
2 Kompoziční pravidla Jak bylo řečeno, kompoziční prvky jsou tím z „čeho“ se kompozice skládá, a kompoziční pravidla popisují uspořádání, zásady a principy těchto prvků. Kompoziční pravidla dále závisí na tom, jaké grafické řešení mají splnit, a také mohou vysvětlit, proč některá grafická řešení působí zajímavě, nudně, srozumitelně nebo naopak chaoticky a bez řádu.
2.1 Gestalt Gestalt (internet 25) znamená celkový vzhled, či celková hodnota něčeho, v případě grafiky je gestalt celkový vzhled či dojem z kompozice. Gestalt je základní kompoziční pravidlo a vychází z takzvané gestaltové teorie, ta v podstatě zkoumá lidské vnímání vizuálních prvků, tato teorie zjednodušeně tvrdí že pozorovatel kompozice bude automaticky, avšak podvědomě hledat smysl či řád mezi jednotlivými prvky kompozice, či mnohem rozsáhlejší celek který může mít s jednotlivými prvky společného jen málo.
Obr. 44 – Ukázky tvarové teorie (internet) Zdroj: http://goo.gl/UGnZX7
21
“Web fiktivní hudební skupiny” “Estetika grafické kompozice”
Martin Hübelbauer
2.2 Soulad (Harmonie) Soulad je kompoziční pravidlo, které poukazuje na prvky, které k sobě logicky vzájemně patří, lidský mozek jak bylo poukázáno v kapitole gestalt, má sklon seskupit podobné prvky v kompozici a najít mezi nimi vztahy a pravidla, pokud není nic k seskupení, kompozice může mít chaotický dojem, který se těžko vnímá a může být až nepříjemný. Souladu (harmonie) se dá dosáhnout několika způsoby, rozmístění, opakování a spojitost jsou prvky, které mají dopad na celkovou hodnotu souladu v kompozici.
Obr. 45 – Ukázka Harmonie a disharmonie (originál) 2.2.1 Soulad (Rozmístění linií) Jedním ze způsobů jak dosáhnout souladu, je umístit prvky velice blízko k sobě, tato metoda se používá například u textových polí, textová pole která spolu logicky souvisí, by měla být vždy blízko u sebe, informace navíc jsou často na okrajích stránky a obsahově vystrčeny, aby čtenáře nemátly, a ten si nejdříve přečetl informace, které přímo souvisí. Textová pole by měla dále být zarovnaná ke straně či do bloku, neuspořádaný text působí chaoticky a špatně se čte.
22
“Web fiktivní hudební skupiny” “Estetika grafické kompozice”
Martin Hübelbauer
2.2.2 Soulad (rozmístění tvarů) Rozmístění jednotlivých prvků kompozice je taky velice důležité, pokud budou objekty u okraje stránky (rámu obrazu) budou mít funkční vztahy mezi sebou, ale obraz samotný (jeho střed) bude působit neuzavřeně, prázdně a bez ohniska. (kapitola ohnisko)
Obr. 46 – Seskupené tvary a tvary vzdálené (originál) 2.2.3 Opakování linií Velice důležitým spojujícím pravidlem kompozice je opakování, jeho základem je duplikace prvku kompozice a jeho následné opakování, tyto dva prvky mezi sebou vytvoří soulad a působí spojeně. Na obr. 47 jde vidět tento efekt, jsou zde tři obdélníky a jeden kruh, který sám do této kompozice nezapadá, na pravé straně můžeme vidět efekt opakování, duplikace kruhu způsobí jejich pomyslné propojení. Velikost druhého kruhu navíc celou kompozici učinila zajímavější.
23
“Web fiktivní hudební skupiny” “Estetika grafické kompozice”
Martin Hübelbauer
Obr. 47 – Ukázka opakování linií (originál) 2.2.4 Opakování tvarů Existují dva rozdílné typy tvarů: přímé a křivočaré, většina kompozic využívá převážně tvary přímé, nebo tvary křivočaré, takové kompozice totiž evokují největší soulad. Opakování je kompoziční pravidlo, které dokáže při správném využití evokovat soulad i při použití jak tvarů přímých, tak tvarů křivočarých.
Obr. 48 – Soulad vytvořený kruhy (křivočarých), a obdélníky (přímých) tvarů (originál) 24
“Web fiktivní hudební skupiny” “Estetika grafické kompozice”
Martin Hübelbauer
2.3 Rytmus S opakováním úzce souvisí rytmus, rytmus totiž vytváří soulad pravidelným opakováním stejného či mírně odlišného prvku. Rozdílem mezi rytmem a opakováním je to, že rytmus přesně opakuje prvky tak, že je možné určit či předpokládat další segment, opakování na opačné straně nemusí mít pravidelnou sekvenci a tím pádem nemá rytmus. Příkladem rytmu jsou čtyři shodné obdélníky o šířce 200 pixelů, a opakující se ve vzdálenosti 100 pixelů, to je příklad rytmické sekvence. Opakování sice mohou být také čtyři shodné obdélníky, ale pokud jsou mezery mezi nimi náhodné jak v ose x, tak ose y, nejedná se o rytmus. 2.3.1 Druhy rytmů Existují dva další druhy rytmu, a to je rytmus střídavý a rytmus postupný, rytmus střídavý jsou dva protikladné prvky, které se střídavě opakují. Příkladem střídavého rytmu je obr. 49 (vlevo) postupný rytmus je posloupnost prvků, které se postupně mění, tato změna může být například změna velikostí segmentů rytmu (zvětšení či zmenšení) příklad takového rytmu je také na obr. 49 (vpravo) rytmus může mít parametry rytmu střídavého i postupného, tato kombinace je znázorněna na obr. 50.
Obr. 49 – Vizuální ukázky rytmů (originál)
25
“Web fiktivní hudební skupiny” “Estetika grafické kompozice”
Martin Hübelbauer
Obr. 50 – Kombinace obou rytmů (originál)
2.4 Ohnisko Ohnisko je kompoziční prvek, který má za úkol přitáhnout pozornost. Na ohnisko je kladen velký důraz, aby bylo jednoduše zpozorováno, z jeho pomocí se pozorovatel může hlouběji ponořit do kompozice a lépe jí porozumět. Existuje spousta možností jak vytvořit ohnisko, kontrast určitého prvku (ohniska) je jednoduchý a účinný způsob jak jedno vytvořit. Ohnisko však musí být se zbytkem kompozice svázané a souladné, pokud tomu tak není, bude ohnisko vypadat, že do kompozice nepatří a hrozí osamostatnění.
Obr. 51 – Vytvoření ohniska pomocí kontrastní barvy (originál)
26
“Web fiktivní hudební skupiny” “Estetika grafické kompozice”
Martin Hübelbauer
Mezi další možnosti jak vytvořit ohnisko patří tónová hodnota (kontrast bílé a černé). Dále pak ohnisko vytvořeno pomocí linií, jednoduchý příklad takového ohniska je optika ostřelovací pušky na obr. 52 nebo ohnisko vytvořeno rozdílným druhem tvaru (zakřivená) kulatá chodba v jinak hranatém labyrintu.
Obr. 52 – Ohnisko vytvořené pomocí směru linií (internet) Zdroj: http://goo.gl/y6b6HG 2.4.1 Sekundární ohniska Ohnisko nemusí být v grafickém řešení jen jedno, jejich počet není nijak omezen, ale pokud je ohnisek příliš, začnou se v kompozici ztrácet. Naopak využití sekundárního ohniska vhodně může přinést zajímavé výsledky, příklad sekundárního hlediska na obr. 53 kde je jasně patrná vizuální hierarchie. Hlavním ohniskem je nápis „Life-Keeper“ a sekundárním ohniskem je obličej zasazený ve přední části budovy.
Obr. 53 – Příklad vhodného využití sekundárního ohniska (podklad internet – 30) Zdroj: http://goo.gl/RQSquj 27
“Web fiktivní hudební skupiny” “Estetika grafické kompozice”
Martin Hübelbauer
3 Abstrakce Abstrakce je kompoziční prvek spolu s linií, tvarem, objemem, tónovou hodnotou, texturou, negativním prostorem a barvou, a však právě abstrakci a barvě se budu věnovat podrobněji, jelikož jsou to velice důležité prvky většiny kompozicí. Abstrakce je postup zjednodušení objektu (přirozeného tvaru) do jeho nejjednodušší formy. Abstrakce se často využívá spolu s deformací jak je vidět na obr. 31 & 32, nebo v kompozičním prvku stylizace což je ve své podstatě abstrakce která se však snaží zachovat prvky realismu obr. 33
3.1 Příklady abstrakce Ochranné známky, obchodní symboly jako jsou například loga, sdělují za použití nejmenšího možného počtu tvarů maximální množství informace.
Obr. 54 – Logo sdělující vizuální informaci za použití abstrakce (internet) Zdroj: http://goo.gl/vmVJ9D Další příklady využití abstrakce jsou loga on/off, dopravní značky, navigační symboly využívané online, favicony a nejmožnější ochranné známky a značky. Všechny tyto příklady abstraktního umění mají prezentovat informace co nejjednodušší formou, a přitom poskytnout co nejvyšší množství informace. Příkladem komerční abstrakce je logo vinárny na obr. 54
28
“Web fiktivní hudební skupiny” “Estetika grafické kompozice”
Martin Hübelbauer
3.2 Čtyři základní metody abstrakce Existují základní metody abstrakce, které sdělují informace jinými způsoby, první je abstrakce pomocí zjednodušení, další je abstrakce využívající opakování, třetí metodou je abstrakce linií a tvarů a poslední je abstrakce založená na změně objektů do tvaru písmen. Zjednodušení
–
nejčastěji
používanou
metodou
abstrakce,
je
abstrakce
zjednodušení. To znamená vynechání nepodstatných vizuálních informací a soustředěnost na sdělení podstatných vlastností a zdůraznění některých rysů.
Obr. 55, 56 – Silná míra abstrakce (zjednodušení). (internet) Zdroj: http://goo.gl/DTVFZP, http://goo.gl/QujgM8 Opakování – Další často používanou metodou abstrakce je opakování, to často souvisí s metodou první, jelikož jsou objekty zjednodušeny a pak se jednotlivé objekty nebo jejich části opakují. Na obr. 57 je příklad opakování znázorněn, jednoduchá abstraktní postava znázorňující člověka, pomocí opakování znázorňuje lidský mozek, ten nemá vlastní barvu či texturu, ale pozorovatel uvidí, že se jedná o mozek.
Obr. 57 – Ukázka loga, které vzniklo opakovanou abstrakcí (originál) 29
“Web fiktivní hudební skupiny” “Estetika grafické kompozice”
Martin Hübelbauer
Abstrakce linií a tvarů – Dvě předchozí metody abstrakce využívaly jako výchozí objekt abstrakce uzavřené kompoziční prvky s tvarem a výplní, to se u abstrakce linií a tvarů mění, ta totiž využívá jak tvary uzavřené, tak tvary které jsou jen naznačené pomocí linií. (kapitola linie) Tato kombinace umožňuje větší provázanost a využití pozitivních a negativních tvarů. (kapitola negativní prostor)
Obr. 58 – Abstrakce vycházející z linií a tvarů (originál, internet) Zdroj: http://goo.gl/ma74mQ Abstrakce vycházející z tvaru písmen – V moderních kompozicích často grafici využívají, kromě třech představených forem abstrakce metodu čtvrtou, a tou je abstrakce vycházející z písmen. Tato forma je zvláště populární, protože s písmem se lidé setkávají každý den, a je pro ně snadno srozumitelné. S něčím podobným ale přesto jiným se můžeme setkat ve středověkých knihách, kdy první písmeno bylo většinou upravené tak aby vypadalo jako obraz. Tato metoda (obrácené abstrakce) je však něco jiného nežli abstrakce vycházející z tvaru písmen. (internet - ?)
Obr. 59 – Abstraktní klíč (key) ve hlásce k (key). (originál) 30
“Web fiktivní hudební skupiny” “Estetika grafické kompozice”
Martin Hübelbauer
4 Teorie barev Barva je tím nejsložitějším kompozičním prvkem a proto stejně jako abstrakce zaujímá speciální místo, a vyžaduje podrobnější prezentaci nežli ostatní kompoziční prvky (internet – 8). Barva jako prostředek komunikace vyžaduje rozsáhlé znalosti zvyků, a kulturního kontextu příjemců. Barva a její využití jako kompozičního prvku by mělo také být co nejvíce objektivní, protože skoro každé grafické řešení může mít v závislosti na barvě desítky alternativních řešení, které osloví jinou demografickou skupinu.
4.1 Aditivní a subtraktivní barvy 4.1.1 RGB model Existují dva hlavní barevné systémy, prvním je aditivní způsob míchání barev, ten je definován tím, že barva vzniká smícháním světla vyzařovaného z nějakého zdroje, například: reflektor, televizní obrazovka či monitor. V principu aditivní systém sčítá jednotlivé složky světla a tím vznikají jednotlivé barvy. Primární barvy aditivního systému jsou červená, zelená a modrá. (RGB) Pokud budou všechny tři složky zastoupeny maximální intenzitou, vznikne barva bílá. Smícháním dvou z těchto barev, které jsou vzájemně doplňkové (komplementární) vznikne šedá.
Obr. 60 – Příklad aditivního míchání barev pomocí reflektorů (internet) Zdroj: http://goo.gl/xw1xv2
31
“Web fiktivní hudební skupiny” “Estetika grafické kompozice”
Martin Hübelbauer
4.1.2 CMYK model Druhým systémem míchání barev se subtraktivní systém u toho vzniká barva odrazem světla od povrchu objektu, nebo pohlcováním světla daným objektem. Předměty nemají vlastní barvu, pouze některé barvy odrážejí a jiné pohlcují. Tyto paprsky barvy je možné vidět při použití optického hranolu, pokud jím světlo prochází, rozloží se na jednotlivé barvy duhového spektra, příklad na Obr. 61.
Obr. 61 – Optický hranol (internet) Zdroj: http://goo.gl/TUE2uU 4.1.3 Míchání barev Příkladem subtraktivního míchání barev může být rajče, to pohlcuje veškeré barvy kromě červené barvy, kterou odráží do prostoru. Pokud by ale bylo takové rajče nezralé, odráželo by jen barvu zelenou. Bílá odráží celé barevné spektrum, a naopak černá všechny barvy pohlcuje. V umění jako jsou obrazy, se využívá subtraktivní míchání barev, primárními barvami tohoto systému jsou azurová, purpurová a žlutá. Na rozdíl od aditivního systému, pokud se všechny subtraktivní barvy smíchají ve stejném poměru, vznikne šedá, tmavá a kalná barva. Pokud se smíchají jen dvě komplementární barvy tohoto systému, vznikne tmavě šedá barva.
Obr. 62 – Rajče odrážející červené světlo (originál, internet) Zdroj: http://goo.gl/rxgRL0 32
“Web fiktivní hudební skupiny” “Estetika grafické kompozice”
Martin Hübelbauer
4.2 Barvený kruh Barevný kruh je prostředek, který slouží k uspořádání vztahů mezi jednotlivými barvami, obsahuje dvanáct barev dělených do tří kategorií. Primární barvy jsou: červená, žlutá a modrá, skládají se z nich všechny ostatní barvy. Sekundární barvy vznikají při smíchání dvou primárních barev. Smícháním modré a žluté vznikne zelená, červené a modré purpurová a žluté a červené oranžová. Terciální barvy vznikají při smíchání primární a sekundární barvy, které spolu sousedí. Těmito barvami jsou: žlutozelená, modrozelená, purpurově modrá, purpurově červená, červenooranžová a žluto-oranžová.
Obr. 63 – Dvanáct barev barevného kola, rozděleno na primární, sekundární a terciální barvy (internet) Zdroj: http://goo.gl/hIumJY
33
“Web fiktivní hudební skupiny” “Estetika grafické kompozice”
Martin Hübelbauer
5 Průmyslový design Průmyslový design je odvětví zaměřující se na konečné grafické řešení projektu. Správné řešení by mělo obsahovat příslušné kompoziční prvky, a tyto prvky by měli mít oporu ve správném použití kompozičních pravidel. Grafický design obecně, má mnoho místa pro alternativní řešení například: využití abstrakce, barevné schéma a využití (teplých, studených či kontrastních barev).
5.1 Grafické řešení – logo Správné logo může mít mnoho podob, existuje více pojmů, které můžou obecně definovat pojem logo. Logotyp – Je to originálně upravený název společnosti, neobsahuje obrázek (využívá jen abstrakci vycházející z tvaru písmen). Piktogram – Je to obrázkový symbol, ten je na webu buď samostatně, anebo doprovází text s názvem společnosti. Někdy známo pod názvy: symbol, ikona nebo emblém. Logo – Jedná se o grafické ztvárnění názvu firmy, společnosti či organizace, tento pojem a piktogram mohou být volně prohozeny. Český ekvivalent slova logo je grafická značka.
5.2 Kritéria hodnocení Existuje celá řada hodnocení funkčnosti loga, některé parametry jsou však důležitější nežli ostatní. Pokud má mít logo správný design, ale i funkci je potřeba se těchto kritérií držet. Identifikace – kritérium identifikace se obecně považuje za primární cíl při tvořbě jakéhokoliv loga. Je nesmírně důležité, aby bylo logo nezaměnitelné a hlavně aby ho potencionální zákazník zpozoroval mezi ostatními. Estetika – velmi diskutovaným kritériem je estetika loga, ta je totiž extrémně subjektivní. Většina logotypů či piktogramů je totiž většinou navrhována stylem líbí/nelíbí. Důležité ale je, aby kvalitu loga hodnotili odborníci nebo lidé s estetickým cítěním (vzděláním).
34
“Web fiktivní hudební skupiny” “Estetika grafické kompozice”
Martin Hübelbauer
Technologie – V době moderních technologii je toto kritérium často přehlíženo, a to z důvodu, že většina log se dají zkonstruovat za pomocí grafického software. Důležitost možnosti reprodukce loga pomocí jakékoliv technologie, by však stále měl být započítávaný faktor návrhu loga. Originalita – Toto kritérium souvisí s identifikací loga, ale v jiném smyslu, logo musí být originální a nezaměnitelné, jeho originalitu chrání zákon. Zákon o ochranných známkách praví (internet – 7) „Ochrannou známkou může být za podmínek stanovených tímto zákonem jakékoliv označení schopné grafického znázornění, zejména slova, včetně osobních jmen, barvy, kresby, písmena, číslice, tvar výrobku nebo jeho obal, pokud je toto označení způsobilé odlišit výrobky nebo služby jedné osoby od výrobků nebo služeb jiné osoby.” Čitelnost – Logo by mělo být zároveň oproštěno od přebytku textů, který by mohl způsobit jeho nečitelnost. Možnost lokalizace – Toto kritérium je velice důležité u nadnárodních společností, logo by mělo mít možnost býti přepsáno do jiného jazyka nebo jiných způsobů zápisu jazyka (alfabeta, azbuka). Kritérií správného loga jsou desítky, toto jsou jen příklady, které by mělo každé logo splňovat.
5.3 Porovnání loga komerčních společností Logo komerční společnosti Fio.cz je příkladem loga které využívá kompoziční prvky ke svému prospěchu. Logo obsahuje příklad oboustranného postupného rytmu. Ten směřuje zrak potencionálního zákazníka, na ohnisko které vytváří přímo na ploše s názvem společnosti. Barevné kombinace (modrá a bílá), vytváří dojem negativního prostoru (trojúhelník může být jak v popředí, tak v pozadí). Manipulace s fontem je také hodná poznámky. Horní část písmene F tvoří pomyslnou linii se stranou bílého trojúhelníku.
Obr. 64 – Logo Fio banky (internet) Zdroj: fio.cz 35
“Web fiktivní hudební skupiny” “Estetika grafické kompozice”
Martin Hübelbauer
Design tohoto loga je příkladem práce grafika, který zná jednotlivé kompoziční prvky a pravidla. A umí využívat jejich potenciál pro případné grafické řešení. Další jsou grafická řešení, která dostatečně nevyužila výhody znalostí kompozičních metod. První je logo společnosti Air bank, její logo je až příliš jednoduché. Má svůj význam a osobitost díky použití diagonálního limetkového pruhu. Limetková je barva společnosti která dominuje interiéru každé pobočky. Přesto je to logo až příliš jednoduché, a vůbec netěží z možností kompozičních metod.
Obr. 65 – Logo Air bank (internet) Zdroj: airbank.cz Poslední logo, které dokazuje nevyužití pravidel kompozice, je logo Equa bank. Toto logo aktivně netěží z pravidel kompozice a jeho jediná úprava je font a úprava (Písmena E). Nedostatečná estetika a identifikace Air a Equa bank zapříčiní splynutí se stovkami podobných log a nesnadné zapamatování, tím pádem klesne úroveň propagace společnosti a ztráta potencionálních zákazníků.
Obr. 66 – Logo Equa bank (internet) Zdroj: equabank.cz
36