16. Jul 2020
DesignTOP Figma pluginy, ktoré zjednodušia život dizajnérom aj developerom
Prešiel už nejaký ten piatok odkedy náš tím používa Figmu. V čase, keď sme zvažovali zmenu sme sa stretávali najmä s častými výpadkami. Odvtedy si všímame, že Figma neustále napreduje. Je to skutočne skvelá náhrada za Sketch. Pluginy pre teba neustále aktualizujeme.
Pluginy, ktoré pomáhajú a zjednodušujú prácu nielen na dizajne ale aj vývoji mobilných a webových aplikácií sú už dlhší čas súčasťou Figmy
Pluginy nájdeš priamo vo Figme v sekcii Plugins a odtiaľ si ich nainštaluješ. Výhodou je, že ich nemusíš hľadať a sťahovať z externých stránok, ako to bolo napríklad v Sketchi, avšak vybrali sme pre teba aj jeden, ktorý je zatiaľ dostupný len ako development plugin.
V tomto článku sme pre teba vybrali 15 TOP Figma pluginov, ktoré používame aj my a stoja minimálne za vyskúšanie.
Motion
S Pluginom Motion môžeš tvoriť jednoduché animácie priamo vo Figme. Ak potrebuješ rozhýbať ikonu alebo ilustráciu vo svojom dizajne, Motion je vhodná odľahčená alternatíva k AE.
AEUX
Pre náročných animátorov odporúčame plugin AEUX, ktorý (takmer) bezpečne exportuje vrstvy z Figmy do Adobe AE. Následne zanimovať a vyexportovať ako Lottie animáciu pomocou Bodymovin pluginu v AE. Návod na inštaláciu nájdete v odkaze. V súčasnosti je totiž tento plugin dostupný len ako "Development plugin".
Easometric
Flat niekedy jednoducho nestačí. S pomocou Easometric pluginu môžeš otočiť svoj dizajn do izometrickej perspektívy jedným klikom. A skvelé je, že tento krok je ne-deštruktívny.
Better Font Picker
Presne ako názov naznačuje, vďaka tomuto pluginu vidíš ukážku fontu priamo pri výbere a bude z teba "better font picker".
Shadow Maker
Nikdy nebolo jednoduchšie vytvárať profesionálne vyzerajúce tiene. Jedným klikom dáš vďaka Shadow maker pluginu svojim dizajnom hĺbku ako profíci na Dribbble a Behance. Dávaj však pozor, aby ťa tvoji Front end developeri nepreklínali za 10-úrovňové tiene.
Mesh Gradient
"Make it pop" hovoria. "Nech je to sexi..." Mesh gradient ti pomôže vytvoriť Image vrstvu s parádnym farebným gradientom. Môžeš si vybrať z matíc 2x2, 3x3 alebo 4x4. Plugin ma tiež funkciu Randomize, ktorá vytvára zaujímavé abstraktné útvary.
Instance Finder
Asi poznáš ten pocit, keď chceš upraviť komponent ale nie ste si istý, kde všade sa nachádza. Instance Finder ti pomôže identifikovať všetky miesta v súbore kde si komponent použil a ak chceš, na klik ťa k nemu prenesie.
Style Organizer
Merge and link all color & text styles in the page. Čas sa kráti a ty potrebuješ upratať svoje dizajny? Nie je problém. Style organizer zoskenuje tvoju page-u a umožní ti merge-ovať všetky farby a texty do štýlov, ktoré si vytvoríš. Upozornenie: správne použitie pluginu je návykové a môže viesť k výraznej úspore času.
Unsplash Figma plugin
Pekné dizajny a pekné obrázky spolu kráčajú ruka v ruke. Určite si už aj ty do svojho dizajnu nejaký hľadal.
Nie vždy je to jednoduché a často ide o zdĺhavú záležitosť. Nájsť tematicky vhodný a zároveň vysokokvalitný obrázok si vyžaduje čas.
Unsplash plugin sa postará o to, aby si namiesto hľadania cez rôzne portály mal obrázky dostupné priamo. Umožňuje sťahovať free fotky priamo do Figmy a to z najväčšej free databázy Unsplash.
Autoflow plugin
Ako dizajnéri sa takmer vždy snažíme vytvoriť zoradený flow screenov, kde máme veľa frame-ov. Prípadne sa usilujeme vytvoriť stromovú štruktúru, takzvaný flow celého dizajnu.
A to je zdĺhavý proces.
Pomocou Autoflow si jednoducho vyznačíš dva framy, z ktorých chceš flow vytvoriť. Nakoniec potvrdíš jedným klikom a hotovo.
Brandfetch plugin
Už ťa nebaví zdĺhavé hľadanie korporátnych log na webstránkach? Brandfetch ti ušetrí kopec času.
Do pluginu zadáš URL adresu firmy, ktorej logo chceš použiť. Ten ti ho následne vygeneruje.
Figma Stark Plugin
Ak máš aj ty niekedy problém rozoznať správny pomer kontrastu farieb oceníš práve plugin Stark. Jednoducho označíš dve prekryté vrstvy a plugin podľa algoritmu vyhodnotí, či je kontrast farieb ideálny.
ImagePallette plugin
Sú rôzne teórie o farebných paletách a jedna z nich je, že najkrajšie farebné palety sú vytvorené z fotiek. Práve plugin ImagePallette ti pomôže vygenerovať farebnú paletu z fotky. Stačí iba označiť obrázok, spustiť plugin a paleta je na svete. :-)
Content Reel plugin
Super plugin z dielne Microsoftu. Často sa ti stáva, že potrebuješ vyplniť design reálnym contentom? Či už ide o meno, email, avatara alebo telefónne číslo - Content Reel plugin ti urýchli a zjednoduší prácu.
Jednoducho vygeneruje tento content za teba. Do budúcna plánujú pridať aj pridávanie rôznych ikoniek. Oplatí sa sledovať aktualizácie.
Android Resources Export plugin
Tento plugin slúži na rýchle exportovanie assetov pre platformu Android. Dizajnér, ktorý pracuje na mobilných aplikáciách a potrebuje často exportovať assety pre developerov tento plugin ocení.
Android resources export pripraví assety v priečinkoch drawable aj Nine-patch. Okrem exportu Nine-Patch môžeš exportovať aj adaptívne app ikony do Play Store.
Zaujíma ťa ako vyzerá náš UX dizajn proces krok za krokom? Pridaj sa k nám a presvedč sa sa na vlastné oči.
Ak sa chceš stať súčasťou Figma komunity na Slovensku pridaj sa do našej Friends of Figma Slovakia - Žilina user group.