iDNES.cz · Lidovky.cz · Esprit
Tri svojbytné značky. Jeden spoločný základ.
Spoločný systém pre tri odlišné značky.
Spravodajský portál, názorový denník a lifestylový magazín potrebujú iný výraz aj rytmus čítania. Pod povrchom však riešia podobné veci: titulky, články, navigáciu a rozhranie pre rôzne veľkosti displeja. Pri práci na iDNES.cz a Lidovky.cz som budoval spoločný základ, na ktorý neskôr nadviazal aj Esprit. Výzvou bolo rozšíriť systém a zachovať osobitosť každej značky.
Farba má v rozhraní svoju rolu
Komponent nepracuje jednoducho s „bielou“, ale s rolou „text na farebnom podklade“. Konkrétnu hodnotu určuje značka a svetlý či tmavý režim. Sémantická vrstva tak oddeľuje význam farby od jej hodnoty. Pri rozmeroch a typografii sa pravidlá zasa riadia značkou a veľkosťou obrazovky. Zmeny sa robia v nadväzujúcich premenných, namiesto ručného prefarbovania a prestavovania každej inštancie.
Esprit: priestor pre fotografiu, vlastné nastavenie
Pri Esprite sme najprv hľadali čisté svetlé prostredie, v ktorom vynikne fotografia. Návrh sa ďalej vyvíjal: finálne podklady pre vývoj už mali vlastnú zelenomodrú paletu, teplejšie neutrálne tóny a zaoblenia pre desktop aj dotykové rozhranie. Charakter magazínu vznikal úpravou spoločných pravidiel. Responzívny prototyp pomohol posúdiť šírku a proporcie ešte pred programovaním.
Systém musí doraziť až k vývoju
Súčasťou práce je aj preklad medzi Figmou a implementáciou. Pri obnove knižnice som dokumentoval zmeny a mapoval premenné na názvy používané vo vývoji. S tímom sme riešili farby, medzery aj zaoblenia a dohodli postupný prechod: nové návrhy môžu používať novú knižnicu, staršie dokumenty sa prepájajú vedome.
ČO PROJEKT PRINÁŠA
Spoločný dizajnový systém prepája iDNES.cz, Lidovky.cz a Esprit, pričom každý web má vlastný charakter. Popri rozhraniach vznikajú pravidlá, dokumentácia a overený export premenných do CSS. Ďalšie návrhy aj odovzdanie vývoju sa tak majú o čo oprieť: o knižnicu, ktorú možno priebežne rozvíjať.