Kako početi s Figma dizajnom u 2026.: vodič za početnike koji odgovara trenutnoj Figmi

Praktičan vodič za 2026. za potpune početnike koji žele naučiti Figmu od nule. Objašnjava besplatni Starter plan, UI3 sučelje, pet ključnih vještina, najbolje besplatne resurse za učenje i dodatke koji olakšavaju stvarni dizajnerski rad.

01. svi 2026.· 14 min čitanja· Tehnologija

Razgovarajte s PAS7 Studio o svom dizajn projektu

Moderan Figma radni prostor u 2026. s UI3 sučeljem, dizajn okvirima i panelom komponenti

Podijeli

Najbrži put od nule do vašeg prvog stvarnog Figma dizajna

Ako prvo želite praktičnu verziju, ovako bih iskoristio prva dva sata.

• Otvorite besplatni Figma račun i krenite sa Starter planom. Dobivate tri Figma datoteke, tri FigJam ploče i neograničene osobne nacrte. To je dovoljno za mjesece vježbanja. [1][2]
• Prođite službeni Figmin tečaj za početnike iz 2025. Ima sedamnaest lekcija, traje oko pet sati i vodi vas kroz oblike, tekst, okvire, Auto Layout, komponente, prototipiranje i projekt portfolio web stranice. [3][4]
• Naučite pet ključnih vještina ovim redom: navigacija UI3 sučeljem, Auto Layout, komponente s varijantama, prototipiranje i predaja developerima. Sve ostalo može pričekati dok vam ove osnove ne postanu prirodne. [5][6][7]
• U početku instalirajte samo nekoliko dodataka koji stvarno pomažu: Stark za provjere pristupačnosti, Unsplash za besplatne stock fotografije i Content Reel za realističan placeholder sadržaj. [8][9][10]
• Izgradite jedan cjelovit projekt, čak i ako je mali: landing stranicu, ekran mobilne aplikacije ili jednostavan product flow. Jedan dovršen projekt nauči vas više nego deset nedovršenih tutorijala. [3][11]

Zašto je Figma pravo mjesto za početak učenja dizajna u 2026.

Tržište dizajn alata uvelike se konsolidiralo oko Figme. Za početnike je to važno jer želite ulagati vrijeme u alat koji timovi, tutorijali i oglasi za posao već koriste.

Praktičan razlog je jednostavan: Figma radi u pregledniku. Ne treba vam snažan laptop, ne morate instalirati desktop aplikaciju i datoteke se automatski sinkroniziraju. Ako promijenite računalo, otvorite karticu i nastavite raditi. To uklanja puno trenja iz procesa učenja.

Figma je postala pristupačnija i nakon promjena cijena i seatova iz 2025. Besplatni Starter plan uključuje tri Figma datoteke, tri FigJam ploče, neograničene osobne nacrte i neograničene gledatelje. To je dovoljno za učenje, vježbu i male osobne projekte prije nego što uopće trebate razmišljati o plaćenom planu. [2][18]

13M+ mjesečno

Figma ima više od 13 milijuna mjesečno aktivnih korisnika. To znači više tutorijala, više community predložaka, više odgovora na tipične probleme i više stvarnih timova koji koriste isti alat koji vi učite. [12][13]

~95% Fortune 500

Figmu koristi otprilike 95 posto Fortune 500 kompanija. Ako učite UI/UX zbog karijere, ovo je alat koji mnogi hiring timovi očekuju da razumijete. [14]

~41% udjela

Dostupne industrijske procjene Figmi daju oko 40,65 posto udjela na tržištu dizajn alata, što je stavlja ispred mnogih tradicionalnih konkurenata za interface dizajn. [12]

XD u maintenance modu

Adobe XD se više ne prodaje kao samostalna aplikacija i uglavnom se tretira kao proizvod u maintenance modu. Sketch je i dalje važan za neke timove, ali ostaje primarno vezan uz macOS. Za početnika, Figma je najsigurniji default. [15][16][17]

Brojevi koji su važni početniku pri odabiru dizajn alata: community, enterprise upotreba i ekosustav koji olakšava učenje. [12][13][14][15]

Napravite besplatni račun i upoznajte aktualno UI3 sučelje

Figma je u travnju 2025. zamijenila staro UI2 sučelje. Mnogi stariji tutorijali i dalje objašnjavaju dobre koncepte, ali njihovi screenshotovi ne odgovaraju onome što danas vidite. Zato krenite od trenutne UI3 strukture.

1. Napravite besplatni Figma račun

Idite na figma.com i registrirajte se e-mailom, Googleom ili GitHubom. Krenut ćete s besplatnim Starter planom. Kreditna kartica nije potrebna. Ako ste student, učenik, nastavnik ili predavač, provjerite i Figmin Education program za prošireni pristup. [1][2]

2. Otvorite novu dizajn datoteku i istražite canvas

Napravite novu dizajn datoteku i prvo se samo snađite u prostoru. Canvas je vaš glavni radni prostor. Nacrtajte frame, dodajte pravokutnik, napišite malo teksta i pomičite elemente. U UI3 alatna traka je na vrhu, panel slojeva lijevo, a panel svojstava desno. [5][19]

3. Razumijte frameove, slojeve i svojstva

Frameovi su spremnici za vaše dizajne. Slojevi pokazuju strukturu svega što se nalazi u datoteci. Panel svojstava kontrolira veličinu, poziciju, boju, efekte, layout i export. Prvih trideset minuta provedite klikajući kroz ta područja i stvarajući mentalnu mapu alata. Zvuči osnovno, ali kasnije će vam stalno trebati. [3][20]

4. Rano otvorite Dev Mode

Dev Mode pokazuje što developerima treba iz vašeg dizajna: mjere, CSS-slične vrijednosti, asseti i implementacijski detalji. Ne morate ga savladati prvi dan, ali rano otvaranje pomaže shvatiti da Figma datoteke nisu samo lijepe slike. One trebaju postati stvarna sučelja. [6][21]

5. Imenujte datoteku i pogledajte povijest verzija

Figma automatski sprema rad, ali datoteku svejedno treba jasno imenovati. Kliknite naziv datoteke na vrhu, preimenujte je i zatim pogledajte povijest verzija u izborniku datoteke. Na besplatnom planu je ograničena, ali dovoljna da shvatite kako oporavak funkcionira kada nešto pokvarite. [2]

UI3 sučelje od 2025.: alatna traka na vrhu, slojevi lijevo, canvas u sredini i svojstva desno. Dev Mode je dostupan putem preklopnika panela. [5][19]

Pet Figma vještina koje su početnicima najvažnije

Figma ima mnogo funkcija, ali ne morate ih sve odmah znati. Ovih pet vještina čini temelj stvarnog rada na dizajnu sučelja.

1. Auto Layout

Auto Layout je Figmin responzivni layout sustav. Ponaša se slično kao CSS flexbox unutar dizajn alata. Elemente stavite u frame, uključite Auto Layout i frame upravlja razmacima, poravnanjem, paddingom i promjenama veličine. Ako tekst gumba postane duži, gumb može narasti s njim. Ako dodate novu stavku u listu, lista se može predvidljivo proširiti. Svaki ozbiljan Figma design system oslanja se na Auto Layout, zato je to prva naprednija funkcija koju vrijedi stvarno savladati. [5][22]

2. Komponente i varijante

Komponente su ponovno upotrebljivi dizajn elementi. Ako gumb pretvorite u komponentu, možete ga koristiti na mnogo ekrana i ažurirati sve instance iz jednog izvora. Varijante drže različita stanja zajedno: primary, secondary, disabled, loading, hover, active i druga. Tako timovi izbjegavaju copy-paste kaos i održavaju konzistentnost velikih proizvoda. [23][24]

3. Varijable i design tokeni

Varijable spremaju ponovno upotrebljive vrijednosti poput boja, razmaka, veličina tipografije i border radiusa. Umjesto da isti hex kod unosite svaki put ručno, referencirate varijablu. Ako se brand boja promijeni, ažurirate je jednom i sve povezano se mijenja. Za početnike je najvažnija navika jednostavna: od prvog stvarnog projekta tretirajte boje i razmake kao sistemske vrijednosti. [25]

4. Prototipiranje

Prototipiranje pretvara statične ekrane u klikabilno iskustvo. Povezujete jedan frame s drugim, birate triggere poput klika ili hovera i dodajete prijelaze kao dissolve, slide ili smart animate. Ne trebaju vam kompleksne animacije za početak. Prvo izgradite jednostavan flow od dva ili tri ekrana. To je dovoljno da klijent, član tima ili stakeholder razumije kako bi se sučelje trebalo ponašati. [3][26]

5. Export i predaja developerima

Dizajni najčešće trebaju postati stvarna sučelja. Export postavke pomažu spremiti assete kao SVG, PNG, PDF ili druge korisne formate. Dev Mode developerima pomaže pregledati razmake, boje, CSS-slična svojstva i platform-specific detalje. Za početnika najveći napredak u handoffu nije jedna funkcija, nego higijena datoteke: jasni nazivi frameova, organizirani slojevi, ponovno upotrebljive komponente i konzistentni razmaci. [6][21][27]

Auto Layout pretvara ručno pozicioniranje u predvidljive, responzivne spremnike. To je prva Figma funkcija koju početnici trebaju temeljito naučiti. [5][22]

Komponente s varijantama održavaju dizajn konzistentnim. Promijenite glavnu komponentu i svaka se instanca može ažurirati iz istog izvora. [23][24]

Najbolji besplatni resursi za učenje koji i dalje vrijede u 2026.

Ne morate plaćati tečaj prije nego što razumijete osnove. Figmin vlastiti learning ekosustav dovoljan je za prvi mjesec, a community nakon toga daje mnogo besplatnog materijala.

Počnite sa službenim Figminim tečajem za početnike. Objavljen je u svibnju 2025., sadrži sedamnaest video lekcija i traje oko pet sati. Pokriva oblike, tekst, frameove, Auto Layout, komponente i prototipiranje kroz vođeni projekt portfolio web stranice. Uključuje i Figma datoteku za preuzimanje, tako da možete raditi izravno u alatu, a ne samo gledati. [3][4]

Figma Community tutorijale koristite za konkretne praznine. Community biblioteka ima tisuće besplatnih tutorijala, predložaka i vježbi. Nemojte je pregledavati nasumično satima. Pretražujte ono što vam sada treba: napredne Auto Layout obrasce, organizaciju design systema, mobile UI vježbe, primjere prototipiranja ili portfolio layoute. [11][28]

YouTube koristite pažljivo. Figmin vlastiti kanal koristan je jer prati aktualni smjer proizvoda. Neovisni kreatori također mogu biti odlični, posebno kada objašnjavaju dizajnerske odluke umjesto da samo kopiraju ekrane. Opasnost je paraliza od tutorijala. Pogledajte jedan tečaj, izgradite jedan projekt i tek tada tražite ciljanu pomoć kada zapnete. [29][30]

Za širi popis, Untitled UI vodič kroz besplatne Figma tečajeve dobra je referenca. Koristite ga nakon službenog početničkog tečaja, ne prije. Inače ćete više vremena potrošiti na uspoređivanje tečajeva nego na učenje dizajna. [30]

Realističan vremenski okvir od nule do prvog dovršenog Figma projekta. Službeni tečaj može pokriti prve tjedne; ostatak dolazi kroz izgradnju nečega stvarnog. [3][4][28]

Šest Figma dodataka koji početnicima stvarno pomažu od prvog dana

Figma ima tisuće dodataka, ali većina nije potrebna na početku. Ovih šest rješava stvarne početničke probleme bez odvlačenja pažnje od osnovnog alata.

Stark

Stark pomaže provjeriti probleme pristupačnosti unutar Figme, uključujući kontrast i druge usability probleme. Za početnike vrijednost nije samo u rezultatu plugina. On uči važnu dizajnersku naviku: dobro sučelje nije samo lijepo, nego mora biti čitljivo i upotrebljivo za što više ljudi. [8]

Unsplash

Unsplash plugin omogućuje pretraživanje i umetanje besplatnih stock fotografija bez napuštanja Figme. To štedi vrijeme i pomaže izbjeći početničku grešku korištenja nasumičnih slika s weba bez razumijevanja prava korištenja. [9]

Content Reel

Content Reel ispunjava dizajne realističnim placeholder sadržajem poput imena, datuma, profilnih podataka i tekstualnih isječaka. Mockupi zbog toga izgledaju bliže stvarnim proizvodima i ne djeluju kao ponavljajući Lorem Ipsum template. [10]

Iconify

Iconify daje pristup do više od 100.000 ikona iz mnogih popularnih setova. Umjesto ručnog traženja SVG datoteka, možete pretraživati, umetati i stilizirati ikone izravno u Figmi. Za početnike to uklanja mnogo trenja pri izradi čistih interface mockupa. [32]

Magician

Magician je AI-assisted plugin za generiranje dizajn ideja, ikona, teksta i vizualnih asseta iz promptova. Rezultati nisu uvijek spremni za produkciju, ali koristan je za brzo istraživanje kada zapnete ili trebate početnu točku. [33][34]

Autoflow

Autoflow pomaže crtati čiste strelice i konektore između frameova ili objekata. Koristan je kada želite objasniti user flow, mapirati prijelaze između ekrana ili pokazati kako se prototip kreće od jednog koraka do drugog. Početnicima olakšava komunikaciju flowova bez ručnog crtanja linija. [35]

Šest dodataka koji rješavaju stvarne početničke probleme. Instalirajte ih nakon prvog dana u Figmi, ne prije. Prvo bi vam samo sučelje trebalo postati poznato. [8][9][10][32][33][35]

Pogreške koje najviše usporavaju početnike

Ovo nisu rijetki slučajevi. Pojavljuju se u gotovo svakoj prvoj Figma datoteci početnika.

• Ne imenovati ništa — Figma će bez problema ostaviti datoteku punu slojeva poput Rectangle 47, Frame 128 i Group 23. To funkcionira pet minuta, a zatim postaje nemoguće za navigaciju. Imenujte važne frameove, komponente, sekcije i ponovno upotrebljive slojeve odmah pri stvaranju.
• Izbjegavati Auto Layout — Ručno pozicioniranje se u početku čini brže, ali puca čim se tekst promijeni, kartice promijene veličinu ili dizajn treba postati responzivan. Koristite Auto Layout rano, čak i ako vas prvih nekoliko sesija malo uspori.
• Gledati tutorijale bez građenja — Najčešća početnička zamka je skupljanje tutorijala umjesto dovršavanja projekta. Pogledajte jedan tečaj, zatim odmah izgradite nešto malo s vlastitim odlukama. Pravi napredak počinje kada prestanete samo kopirati i sami rješavate layout probleme.
• Ignorirati Dev Mode i handoff — Ako dizajn nikada ne pogledate iz developerske perspektive, lako nastanu datoteke koje izgledaju dobro, ali su teške za implementaciju. Otvorite Dev Mode rano. Promijenit će način na koji imenujete slojeve, organizirate komponente i razmišljate o razmacima.
• Instalirati previše dodataka prerano — Dodaci su korisni, ali i odvlače pažnju. Ako prvi dan instalirate trideset dodataka, više ćete istraživati alate nego učiti dizajn. Počnite s nekoliko praktičnih dodataka i dodajte nove samo kada osjetite stvaran workflow problem.
• Polirati prerano — Početnici često satima usavršavaju jedan ekran prije nego što flow ima smisla. Krenite grubo. Wireframeajte strukturu, testirajte layout, zatim polirajte vizualni stil. Tako profesionalni dizajn rad zaista ide brže.

ČPP

Trebam li plaćeni Figma plan za učenje dizajna?

Ne. Besplatni Starter plan dovoljan je za početak. Dobivate tri Figma datoteke, tri FigJam ploče i neograničene osobne nacrte. To je dovoljno za nekoliko vježbovnih projekata. Plaćeni plan postaje važan kada trebate više dijeljenih datoteka, napredniju suradnju, timske biblioteke ili dužu povijest verzija. Studenti i nastavnici trebali bi provjeriti i Figmine Education opcije.

Trebam li učiti Sketch ili Adobe XD umjesto Figme?

Za većinu početnika u 2026., Figma je najsigurniji izbor. Adobe XD se više ne prodaje kao samostalna aplikacija i uglavnom se tretira kao proizvod u maintenance modu. Sketch se još koristi u nekim timovima, ali ostaje primarno macOS alat. Figma radi u pregledniku, multiplatformska je, ima snažan community i češća je u modernim UI/UX oglasima za posao.

Koliko treba da potpuni početnik nauči Figmu?

Osnove možete razumjeti za jedan vikend ako pratite službeni početnički tečaj. Stvarna sigurnost obično dolazi nakon četiri do osam tjedana redovite prakse. Cilj nije zapamtiti svaku funkciju. Prvo se fokusirajte na UI3 navigaciju, Auto Layout, komponente, prototipiranje i export ili handoff. Te vještine pokrivaju većinu početničkog i junior-level dizajn rada.

Koja je razlika između Figme i FigJama?

Figma je alat za dizajn sučelja. Koristite je za detaljne ekrane, komponente, prototipe i predaju developerima. FigJam je kolaborativna bijela ploča. Koristite ga za brainstorming, radionice, grube flowove, sticky noteove i ranu ideaciju. Početnici najčešće kreću u Figmi i koriste FigJam kada trebaju mapirati ideje prije poliranih ekrana.

Mogu li dobiti dizajn posao samo s Figma vještinama?

Figma vještina pomaže, ali nije dovoljna sama po sebi. Hiring timovi traže i osjećaj za layout, tipografiju, boju, responzivni dizajn, svijest o pristupačnosti i sposobnost objašnjavanja dizajnerskih odluka. Figma je alat. Product i UI razmišljanje su stvarne vještine. Najbolji put je učiti Figmu dok gradite dva ili tri cjelovita portfolio projekta.

Izvori

Službena dokumentacija, product stranice, community resursi i neovisne industrijske reference provjereni 1. svibnja 2026.