V svetu oblikovanja je Figma postala ključnega pomena za ustvarjanje vrhunskih uporabniških izkušenj in izjemnih dizajnov. Njena uporabnost, moč skupnega dela na projektih in intuitiven vmesnik so jo postavili v ospredje, vendar pa je prava moč Figme še bolj izstopajoča zaradi bogate zbirke vtičnikov.
V tem blogu vam bom predstavila šest najljubših, po izboru Madwise oblikovalcev. Ti vtičniki delovne procese ne le olajšajo, ampak omogočajo tudi ustvarjanje boljših, bolj učinkovitih dizajnov.
Above the fold
“Above the fold” je območje spletne strani, ki se pojavi na našem zaslonu takoj, ko pridemo na stran in preden se pomaknemo nižje. Pravilno oblikovanje tega območja je zelo pomembno. Vpliva namreč lahko na to ali bo uporabnik nadaljeval z raziskovanjem strani ali jo bo zapustil.
“Above the fold” sekcija je pomembna tako z vidika uporabniške izkušnje, kot tudi iz vidika SEO. Najpomembnejši elementi, ki bi jih moral uporabnik videti ob prvem vstopu na stran so:
- breadcrumbs,
- H1 naslov,
- povzetek/opis,
- gumb CTA.
Na tem mestu nastopi vloga Figminega vtičnika Above the fold, ki nam označi to območje. Tako lahko preverimo, če smo v tem območju vključili vse ključne elemente strani.
Študija pravi, da imamo le 0,05 sekunde, da prepričamo uporabnika, da ostane na strani, zato poskrbite, da se le ta karseda hitro naloži in je videti brezhibno.
Iconify
Ko želimo grafično popestriti spletno stran ali digitalno kreativo, se ponavadi poslužujemo raznih ikon in piktogramov. Vtičnik Iconify nam pri tem občutno pohitri proces, saj lahko kar znotraj Figme poiščemo primerno ikono in jo vstavimo v naš dizajn.
Ikone so v formatu svg, kar pomeni, da jih lahko dodatno urejamo. Vektorski zapis namreč omogoča, da prilagodimo obliko in barvo, poleg tega pa zagotavlja najboljšo kvaliteto pri izvozu.
Tinify
Size matters! 🙂 Velikost datotek, ki jih vsakodnevno prenašamo in nalagamo na splet, je pomembna. Z velikimi datotekami namreč po nepotrebnem “smetimo” splet. Več o tem, zakaj je kompresija nujna, si lahko preberete v tem blogu.
Za kompresijo grafik lahko uporabimo spletno orodje tinypng, lahko pa preskočimo nekaj korakov in direktno iz Figme izvozimo zmanjšane datoteke. Pri tem nam pomaga vtičik Tinify, ki omogoča izvoz v formatih: png, jpeg ali webp.
Html.to.design
Ste bili že kdaj postavljeni pred izziv, da popravite le eno sekcijo na spletni strani? Ali pa je vaš naročnik želel, da ohranite njihov dizajn, spremenite pa vsebino? V takšnih situacijah vam bo ta vtičnik prišel še kako prav.
V Figmi odprite vtičnik Html.to.design, vnesite URL želene spletne strani (stran mora biti javno dostopna), izberite nastavitve (desktop ali mobile velikost) ter kliknite “import”. V nekaj trenutkih bo celotna stran pripravljena za urejanje.
Ta vtičnik je tudi odlično izhodišče za učenje UX in UI, saj lahko uvozite vašo najljubšo spletno stran in raziščete njeno zgradbo, kakšne so uporabljene velikosti, razmiki med elementi in tako dalje.
Poleg navedenega vtičnika lahko poskusite tudi vtičnika Web to Figma ali Builder.io. Oba imata podobne funkcionalnosti.
Nisa text
Spoznajte super orodje za urejanje tekstov, pri katerem najpogosteje uporabljam funkciji “split” ali “join”. Pri vtičniku Html.to.design nam tekste v odstavku uvozi tako, da je vsaka vrstica svoj element. Če označimo vse vrstice in uporabimo funkcijo “join”, jih ta združi v en element. Če želimo tekst razdrobiti, uporabimo funkcijo “split”.
Vtičnik Nisa text ima sicer še veliko drugih funkcij, kjer so nekatere izmed njih plačljive.
Beautiful shadows
Vtičnik Beautiful shadows nam pomaga ustvariti realistične sence, ki bodo nadgradile naš dizajn. Deluje tako, da ustvari več nivojev senc v Figmi, ki jih lahko potem še dodatno urejamo ali odstranjujemo.
Dobro si je zapomniti, da ta način ni primeren za ustvarjanje senc pri oblikovanju spletnih elementov, saj jih na spletu ne moremo poustvariti na enak način kot v Figmi. Vtičnik nam torej pomaga predvsem pri oblikovanju grafik, ki jih bomo izvozili kot sliko.
Ne glede na to, ali gre za avtomatizacijo ponavljajočih se nalog, optimizacijo delovnega toka ali razširitev zmogljivosti Figme, ti vtičniki postavljajo temelje za izjemno oblikovanje.
V nenehno rastoči knjižnici Figme se vsak dan pojavljajo novi pripomočki, zato je ključnega pomena, da sledimo najnovejšim posodobitvam. Če želite ostati v koraku z vsem, kar se dogaja v svetu Figme, vam priporočam, da se naročite na newsletter Figmalion ter spremljate Instagram profil Figme.
Za vse vtičnike, pripravljene predloge, inspiracijo in še mnoge druge uporabne vire pobrskajte tudi na Figma Community strani.
