Jak vznikal nový webdesign Automotodromu – očima grafika

Design Michal Šoller

Není to tak dávno, kdy se z grafického oddělení ozývaly nářky kolegyň z marketingu, že ti kluci ušatí ničím nepřispívají na firemní blog. „My bychom rádi, ale času je málo a práce hodně,“ ohrazoval se jeden, který dokonale předstíral práci, jen aby nemusel zápasit s psaným slovem. Avšak nyní je načase přiznat barvu a ukázat světu, že grafická pakáž dokáže malovat i slovy. Obzvlášť když jeden projekt výrazně vyčnívá mezi ostatními.

Automotodrom Brno si nás vybral, abychom jim připravili novou podobu webových stránek. Nejednalo se jen o oprášení starého kabátu, ale o, řekněme, ušití kabátu kompletně nového. Jako první se do projektu zakousne analytický tým, který po sherlockovsku zjišťuje, co na současném webu funguje, a co naopak ne. Chystají vlastně ingredience pro šéfkuchaře UX. Ten s pomocí klienta hledá ty nejlepší přísady, aby návštěvníkům web opravdu zachutnal. Nechci vás nadále nudit procesem výroby webů, chci vás ale nudit vizuálním stránkou projektu. Jelikož do té vstupuji já, autor článku.

Když se ke stolu donesly zvěsti, že na příštích pár týdnů mé oko i stylus spočine na projektu brněnského okruhu, mé srdce zaplesalo radostí. Nechápejte mě špatně, opravdu si užívám kreslení projektů pro finančníky, programátory nebo zelené ufouny, ale projekt s vůní benzínu je pro motorového fandu ještě o něco lákavější. A tak na stůl dostávám do detailu vyladěný wireframe a grafický manuál. Ptáte se, co je wireframe? Wireframe je drátěný model webu, neboli budoucí web bez grafiky. Ptáte se, co je grafický manuál? Grafický manuál je soubor pravidel dané značky, který vytvořil autor (grafik) brandu tak, aby zůstala zachována jednotnost značky v okamžiku, kdy se jí zmocní jiný grafik. Grafici jsou totiž namyšlená pakáž a každý z nich si myslí, že jedině on dokáže dát značce tu pravou tvář. Bez manuálu, chcete-li bez hranic, by se každý nový návrh vzdaloval od toho původního. Ale nebyl by to opravdový grafik, kdyby se i přes všechny hranice nesnažil dat do návrhu něco ze sebe.

Automotodrom
Wireframe webu

Hodiny a dny letěly jak Rossi na své mašině a náhled úvodní stránky začal dostávat reálné obrysy. Je krásné, když jednou za čas nemusíte bojovat s obrázky z fotobank, ale máte k dispozici houf originálních fotek z různých závodů. Oči vám přeskakují ze silných strojů ke sličným dívkám i obřímu davu nadšených fanoušků. Byl jsem spokojen i se základní barevností, kterou se automotodrom prezentuje. Agresivní červená se k závodům hodí a doplňkovou černou a bílou se nikdy nic nezkazí. Jediný vážnější problém bylo písmo. Původní font splnil svůj účel, byl dostatečně charakteristický a lidé starající se o okruh i fanoušci jej bezpečně rozeznávali. Mně se však zdálo, že nastal správný čas, aby s novým webem přišlo i nové hlavní písmo, které bude modernější, více geometrické a agresivnější. Proto jsem si na své první schůzce s klientem dal za úkol nadnést, kromě prezentace grafiky úvodní stránky webu, i téma změny písma.

Automotodrom

Úvodní stránka byla hotová a mohlo se vyrazit na prezentaci za klientem. K mé radosti se schůzka uskutečnila u klienta na okruhu ve VIP salonku hned vedle cílové rovinky. Schůzka začala standardně nudným povídáním mezi klientem a projektovým manažerem, který celou show předělávky webu řídí. Já mezitím čekal na svou chvíli, kdy začnu s prezentací grafiky. Tyto chvíle jsou vždycky plné napětí, protože očekáváte, jak bude grafika přijata. Sice můžete klientům připomínat, ať se neřídí subjektivním pocitem líbí/nelíbí, že je naopak důležité, aby grafika splňovala cíle, ale realita bývá odlišná.

Než přišel můj čas, tak se za oknem začaly objevovat motorky se závodníky, kteří začali trénovat. Vidět je z takové blízkosti byl prostě zážitek. Nemusím vám asi vyprávět, že má pozornost ihned obrátila jiným směrem. Ani ostatní účastníci schůzky to neměli vůbec jednoduché, protože ty nadupané stroje dělaly takový rámus, že to na povídání moc nebylo. Grafiku se přesto povedlo odprezentovat a nakonec přišel čas na nadhození nápadu změny písma. Čekal jsem boj, ale opak byl pravdou, klient sám si s touto myšlenkou už nějaký čas pohrával a souhlasil, abychom nachystali případné varianty nového písma. Schůzka se vyvedla skvěle, a navíc jsme se podívali do míst, kam se jen tak někdo nedostane a jako třešničku na dortu nám byl trénink závodních motorek.

Výhled z VIP salonku
Výhled z VIP salonku

Když máte schválenou grafiku, je už snadné dodělat zbytek webu, zvlášť když máte skvěle nachystaný wireframe. Je potřeba si pohlídat jednotnost podstránek, responzivitu a nevymýšlet složitosti, které by vám pak kodéři i návštěvníci stránek omlátili o hlavu. Hlavní pozornost jsem obrátil na hledání vhodného písma, které mimo jiné musí splňovat ještě jeden cíl. Musí vypadat závodně. Měl jsem několik adeptů, které jsem dosazoval do různých situací, abych si ověřil, jak dobře budu fungovat. Když jsem svého největšího favorita dosazoval do náhledu webu, šel zrovna kolem kolega UXák, který na projektu pracoval a jeho první slova zněla: „Jůůů, závodnické písmo.“ To pro mě bylo znamení, že jsem písmo vybral správně. Než jsme návrhy s písmem mohli prezentovat, bylo zapotřebí ještě zjistit všechny podrobnosti ceny a licencí. Máte písma, které jsou zdarma nebo stojí pár doláčů, ale najdete i písma, která vás mohou vyjít na slušný peníz. Je dobré si zjistit podrobnosti, protože první otázka od klienta bude směřovat tímto směrem. No, nebudu vás déle napínat, vše bylo schváleno a automotodromu nastává nová doba s novým hlavním písmem.

Nové písmo pro Automotodrom
Nové písmo pro Automotodrom

Teď už se nezdržujte a prohlédněte si web v plné kráse. A hlavně běžte navštívit automotodrom a fandit našim klukům

Co si dále přečíst