Dizajnový systém (design system)

Definícia

Dizajnový systém (design system) je sada pravidiel a opakovane použiteľných prvkov, z ktorých sa skladá celý produkt: farby, písmo, tlačidlá, rozostupy, karty, formuláre. Vďaka nemu vyzerá a správa sa web alebo aplikácia všade rovnako a nové obrazovky vznikajú rýchlejšie.

Čo to znamená pre vašu firmu

Malá firma s jednoduchým webom ho zvyčajne nepotrebuje: stačí jednostranový manuál značky (logo, farby, písmo, tón). Dizajnový systém sa oplatí, keď produkt rastie: aplikácia, e-shop alebo web s desiatkami stránok, kde pracuje viac ľudí alebo dodávateľov a prvky sa opakujú. Ušetrí opravy typu „toto tlačidlo je inde iné“. Prvý krok: zapíšte si farby, písma a vzhľad hlavného tlačidla.

Príklad z praxe

Z našej praxe: aplikácia Renna má dizajnový systém. Písmo je DM Sans, akcent limetkový, karty zaoblené (polomer 24 px), tlačidlá v tvare pilulky, farby sú cez CSS tokeny (pomenované hodnoty) namiesto pevných a funguje tmavý aj svetlý režim. Nová obrazovka sa skladá z hotových dielov a vyzerá ako zvyšok.

Prečo je to dôležité

Bez pravidiel sa vzhľad časom rozchádza: každá nová stránka má trochu iné tlačidlo a rozostupy. Dizajnový systém to drží pokope, urýchľuje prácu a uľahčuje vstup novým ľuďom aj dodávateľom.

Súvisiace pojmy

Manuál značky (brand manuál)UI dizajn (používateľské rozhranie)Vizuálna identita Figma Tmavý režim (dark mode)

Čítajte ďalej

Häufige Fragen

Potrebuje malá firma dizajnový systém?

Väčšinou nie. Pre web s piatimi až desiatimi stránkami stačí manuál značky na jednu stranu: logo, farby, písmo, tón. Dizajnový systém dáva zmysel pri aplikácii, e-shope s množstvom stránok alebo keď prvky robí viac ľudí.

Aký je rozdiel oproti manuálu značky?

Manuál značky hovorí, ako má vyzerať značka: logo, farby, písmo. Dizajnový systém ide ďalej a opisuje aj hotové súčasti rozhrania: tlačidlá, formuláre, karty, ich stavy a rozostupy.

Dá sa začať v malom?

Áno. Zapíšte farby, písma, veľkosti a vzhľad hlavného tlačidla, ďalšie prvky pridávajte, keď sa začnú opakovať. Stačí dokument, tabuľka alebo nástroj ako Figma.

Chcete to mať vyriešené?

Napíšte nám pár viet o firme a o tom, čo potrebujete. Ozveme sa do pár hodín v pracovný deň a ponuku pošleme do 48 hodín. Prvých 20 minút konzultácie je zadarmo.

Schreiben Sie uns Späť na slovník