Figma – aplikace, software nebo nástroj, chceš-li, který si získává stále víc příznivců nejen mezi produktovými designéry. O Figmě jsme už psali, ale dneska ti ji představí někdo, kdo s ní spojil svůj profesní život v dobrém i ve zlém. Ptali jsme se Petra Nováka, který je Design System & UI Manager ve společnosti Emplifi.
Pojď číst a přesvědč se, že i když je cesta k designu někdy pěkně klikatá, má cenu vytrvat a posouvat se dál. Na design – a nejen na něj – máš Figmu, s ostatním ti pomůže Skvot (ale jen s velkým S). A sympaťák Petr. Už jsme zmínili, že je to náš lektor? Společně jsme připravili podrobný kurz Figma od A do Z. Tam poznáš Figmu skrz naskrz během 11 lekcí se zkušeným lektorem s bohatou praxí.
Ahoj, Petře, představ nám svoji pozici – co znamená Design System a UI Manager?
Starám se o tým čtyř designérů a snažím se, aby je práce bavila, byli motivovaní a užívali si svoje projekty a měli dost prostoru k učení, zlepšování svých skills a celkově k růstu.
Moje druhá úloha je vedení a rozvoj design systému, vizuálního stylu, UI komponent a dalších designových aspektů. S tím souvisí i zavádění systémového přístupu k vytváření a integraci konzistentních komponent a patternů napříč naším produktem.
S týmem navrhujeme, udržujeme a zlepšujeme UI a celý design systém a fungujeme i jako DesignOPS.
Kudy vedla tvoje cesta k designu? Chtěl ses mu věnovat už od dětství?
Rád bych řekl, že jsem od malička zkoumal jak co funguje a jak jsou věci navržené a zkoušel je zlepšit, ale asi jako spousta dětí jsem prostě nevěděl, čím chci být. K designu, respektive nejprve ke grafice, jsem se dostal vlastně tak trochu náhodou. Na základce mě hodně bavilo programování a kódování webů, a tak jsem si vybral školu a obor, který mě měl v tomhle směru posunout.
Na střední jsem studoval informační technologie a chemii. Oboje mě bavilo a u obojího jsem viděl budoucnost. Díky škole jsem si vyzkoušel technické kreslení, 3D i grafiku. Zjistil jsem, že mě grafika baví víc než chemie a že se tomu chci věnovat. Hodně mě také zajímalo navrhování webů.
Po škole jsem pracoval chvilku jako barman. Díky tomu jsem potkal svého budoucího šéfa, který mi tenkrát dal šanci ve své agentuře, i když jsem neměl žádné zkušenosti. Ze začátku jsem pomáhal se sazbou jednoho týdeníku, časem, jak jsem se zlepšoval, jsem navrhoval reklamní bannery, plakáty, billboardy a celkově více vizuální a zajímavější věci.
Celou dobu jsem ale věděl, že chci dělat weby. K nim jsem se postupně propracoval a díky nim jsem se začal zajímat o design digitálních produktů… a to bylo cca 10 let zpět.
Zaměřuješ se na kompletní životní cyklus design systému. Co to v praxi obnáší?
Ve Figmě připravíme novou komponentu nebo update pro stávající, v rámci design i dev týmu probereme varianty a zda výsledek splňuje očekávání a vše otestujeme, připravíme specifikaci pro devs, dokumentaci a naplánujeme vývoj.
Když je komponenta hotová, projde ještě jednou kontrolou od designu a pokud je vše, jak má být, začne ji náš dev tým implementovat do produktu. Následně sbíráme data a ladíme a tím se vracíme na začátek…
Jak ve své práci využíváš Figmu?
Tím, jak je Figma všestranná, ji vlastně používám úplně na všechno od designování UI a přípravu komponent pro design systém přes tvorbu prezentací až po print. Nejvíc ji samozřejmě používám na UI, přípravu specifikací pro devs a prototypování. Hodně si taky hraju s různými funkcemi a zkouším, jak se dá co navrhnout, naprototypovat a ohnout.
Velká výzva pro nás byla třeba tvorba komponent pro flexní vizualizace (mrkni se) nebo selectu, kdy původní komponenta měla přes 2 000 variant (po zavedení properties jsem to zredukoval na 6).
Proč zrovna Figma? Jaké programy jí konkurují a v čem je Figma lepší?
Největší přednost Figmy je, že je vše online. Nepotřebuješ instalovat žádnou appku ani řešit, jestli máte Mac nebo Windows, rozjedeš ji kdekoli a skoro na čemkoli. Stačí mít jen přístup na internet a slušný browser… Tohle byl i hlavní důvod, proč jsme na Figmu přešli jako tým a proč u ní stále zůstáváme.
Další úžasný benefit je, že Figma zastoupí několik toolů. Na jednom místě si uděláš mindmapy, flows, prototyp, design i handover pro developery.
Největší konkurent Figmy byl svého času Sketch, který jsme používali několik let a byl super, ale zaspal a Figma ho svojí všestranností převálcovala. Adobe XD byl také zajímavý tool, ale jeho vývoj byl prostě moc pomalý.
Jaké jsou nejčastější výzvy, se kterými se setkáváš při používání Figmy?
Hodně řešíme aktualizace komponent a celých knihoven a jak je dobře aplikovat do stávajících designů, abychom nerozbili prototyp nebo neresetovali komponenty do původního stavu, což se při větších změnách stává bohužel často. Další zajímavá výzva je pak file management. Figma stále neumí složky a lepší strukturování projektů, což je při spoustě projektů trochu trouble.
Používáš ve Figmě knihovny komponent? Vnímáš to jako užitečnou funkci?
Používám je neustále. Komponenty jsou úžasná věc a pokud jim člověk věnuje nějaký čas, naučí se je používat a vytvářet z nich i komplexnější templaty, ušetří mu to tunu času a pomůže se zaměřit na řešení problému...
To platí násobně více o sdílených design libraries. Díky nim jsme schopni navrhnout v podstatě celou novou appku tak, aby vypadala a fungovala stejně jako zbytek produktu, a to v rámci třeba několika hodin nebo dní, pokud to je komplexní prototyp.
Co používáš ve Figmě při sdílení návrhů s členy týmu nebo zákazníky?
S týmem sdílím skoro vždy prototyp nebo přímo file. Všichni máme právo zasahovat skoro do všeho a je super, když vám kolega nahodí další variantu, která řeší problém jinou cestou. Hodně používám pluginy na hlasování a poznámky a je tu samozřejmě možnost designovat live ve více lidech.
Vývojářům připravujeme vlastní stránky, kde mají připravený design včetně detailních specifikací. Figma vydala i nový developer mode, který vypadá hodně zajímavě a mohl by ušetřit dost práce. S klienty pak sdílíme převážně vyladěné prototypy.
Máš nějaké oblíbené zdroje nebo komunity, kde hledáš inspiraci a nové tipy týkající se práce ve Figmě?
Dobrý zdroj informací a inspirace je určitě medium.com pro komplexnější rady a návody a Twitter, kde se dá přijít ke spoustě zajímavým tipům a hackům. Na Mediu se snažím také trochu publikovat, i když poslední dobou nebyl moc čas napsat něco nového.
Na tutorialy je super YouTube, kam i samotná Figma dává spoustu zajímavých videí.
Používáš Figmu i na něco jiného než na práci?
Používám ji vždycky, když potřebuji něco navrhnout. Když jsme zařizovali byt, základní rozmístění nábytku jsem dělal právě ve Figmě. Vestavné skříně jsem navrhoval také v ní, včetně nákresů pro truhláře. Pro syna jsem dělal prototyp, ve kterém se učil poznávat barvy.
Znamená to, že sedíš převážně u počítače? Jak se odreagováváš – máš vůbec volný čas?
Snažím se držet správný balanc mezi prací a osobním životem, takže volna, kdy se můžu věnovat rodině a relaxování, mám celkem dost… Největší relax je pro mě asi sport, dlouho jsem hrál americký fotbal a teď se věnuji kalistenice. Hodně času věnuji také rodině. Se ženou milujeme cestování a naši vášeň se snažíme předat našemu synovi.
Ale je pravda, že u počítače a asi obecně před obrazovkou trávím hodně času, protože se rád bavím hraním her nebo sledováním filmů nebo seriálů.
A poslední otázka – jak se těšíš a připravuješ na kurz? Máš už nějaké zkušenosti s lektorováním?
Pár menších workshopů jsem už dělal, ale vždy to bylo jen v rámci týmu. Tohle je pro mě tedy úplně nová zkušenost a moc se na to těším. Jsem povahou introvert a tišší člověk a dělat takovýhle kurz je pro mě velká výzva — to mě na tom vlastně baví nejvíc.