
Co nabízíme
Pokud se chystáte ve vaší organizaci zahájit vývoj design systému, je ideální příležitost nastavit vše správně od začátku. Na základě našich zkušeností vám pomůžeme s definicí základních pravidel, návrhem design foundations, strukturováním a organizací souborů ve Figmě, architekturou komponent, implementací design tokenů a variables.
Zajistíme také nastavení automatizací, exportních procesů a workflow pro spolupráci s frontend vývojem a integraci se Storybookem. Cílem je vytvořit systém, který bude dlouhodobě udržitelný a snadno rozšiřitelný.
Nastavení klíčových procesů pro efektivní vývoj design systému
Máme bohaté zkušenosti jak s budováním design systémů od základů, tak s jejich dlouhodobou správou a optimalizací. Zaměřujeme se na udržení vysoké úrovně efektivity a konzistence mezi UX designem a frontend vývojem, včetně zajištění plynulé spolupráce a adopce design systému napříč týmy.
V existujících procesech identifikujeme příležitosti ke zlepšení a navrhujeme konkrétní kroky vedoucí k optimalizaci. Součástí naší práce je také návrh možností integrace AI a automatizace pro další zvýšení efektivity a škálovatelnosti systému.
Audit a optimalizace design systémů a navazujících procesů
Součástí naší spolupráce je předávání know-how, které jsme získali při návrhu a správě design systémů v různých organizacích. Naším cílem je posílit vaše interní kapacity tak, aby klíčoví členové týmu – správce design systému, UX/UI designér pracující ve Figmě i frontend vývojář – získali potřebné znalosti a dovednosti pro samostatné a efektivní fungování.
Školení přizpůsobujeme potřebám vašeho týmu s důrazem na praktické využití v reálných projektech.
Školení jednotlivců i týmů zodpovědných za správu design systému
FAQs
Jak probíhá zavedení design systému krok za krokem?
Design system začíná auditem stávajícího stavu a stanovením cílů. Následuje návrh design foundations, organizace Figmy, tokeny nebo variables, layouty, patterny a samotné komponenty. Ve spolupráci s vývojem zajišťujeme implementaci do kódu a do Storybooku. Nastavujeme procesy předávání stylů (tokenů, variables). Celý tým proškolíme tak, aby mohl systém samostatně využívat a rozvíjet
Jaká je návratnost investice do design systému?
Díky opakovanému používání komponent docházeí ke snížení času při navrhování ve Figmě a ke zkrácení vývojového cyklu o 30–40 %. Eliminuje se nekonzistentní UI a UX napříč produkty. Systém umožňuje efektivní rozšiřování o nové produkty, značky a podporu zobrazení a chování na více zařízeních. Počáteční investice se snižuje dobou používání DS. Jako příklad z praxe jde uvést vytváření stránky do existující aplikace pro obchodníky velké společnosti, která ve staré technologii zabrala vývoji a designu v souhrnu okolo 12 MD. V nové technologii s design systemem byl tento čas 7 MD.
Je možné design systém přizpůsobit více produktům nebo brandům (multibrand / multiplatform) ?
Ano, to je hlavním benefitem DS. Díky foundations - core systemu, navrhneme veškeré styly a semantiku tak, aby definovala celý vzhled pomocí tokenů a variables. Díky tomu jde využívat theming pro změnu celých brandů, které kompletně změní vzhled aplikace nebo webu. Komponenty lze dále rozdělit dle platformy a technických požadavků nebo zařízeních, pro které jsou určeny.
Jak zajistit konzistenci mezi návrhem ve Figmě a implementací ve frontendu?
To je jedna z klíčových činnosti, které potřebujeme nastavit. Zdrojem pravdy je finální knihovna komponent v projektu, ne Figma. Proto je našim cílem, aby probíhaly činnosti kontroly Figmy a implementace, synchronizace tokenů mezi Figmou a vývojem FE, adopce, dokumentace, verzování, testy a finální review na Storybooku. Vším jsme si prošli, tak víme na co si dát pozor.
Co když nemáme dedikovaného správce design systému – pomůžete nám ho vyškolit?
Naším cílem je abyste měli soběstačný DS až odejdeme.
Správce Design systemu ve Figmě a implementace na straně frontendu je nutností.
Minimální setup pro fungující design system doporučujeme tento:
Jak zajistíme, aby se DS skutečně používal a nedošlo k jeho úpadku?
Cesta nekončí vytvořením knihovny komponent, ale otevírá se tím další etapa, a to je adopce mezi všechny, kdo ho mají používat. Designeři, vývojáři i analytici.
Často se stane, že DS vznikne za iniciativy a zapálení několika jedinců v designu, ale tím, že není dostatečně komunikován a vyvíjen za spolupráce s vývojáři, tak ho čeká smutný osud v pomyslném šuplíku. Protože i když je po UX stránce skvělý, vývojáři ho nebudou chtít využívat, protože nesplňuje jejich očekávání pro snadnou práci. Usnadnění práce frontendového týmu je jedním z klíčových cílů design systému. Při jeho návrhu zohledňujeme jak potřeby UX s důrazem na uživatelskou přívětivost, tak i technické požadavky vývojářů při implementaci komponent.