Lumea software-ului de design grafic este uriașă și are multă concurență. Figma este un instrument de design care se îndreaptă spre primul loc pentru designerii UX/UI din întreaga lume. Dar ce știi despre acest instrument intuitiv?
Deși este simplu, există și o curbă de învățare dacă sunteți obișnuit cu alte instrumente de design. Să ne uităm la Figma și cum să o folosim. Bun venit la Figma 101.
Ce este Figma?
Dacă ați lucrat ca designer grafic sau web designer în ultimii ani, probabil că ați auzit de Figma. Poate chiar l-ai fi folosit.
Figma este un instrument de design și a devenit în mod constant favoritul designerilor digitali, explodând opțiuni precum Adobe XD, Adobe Photoshop și Sketch, pentru design web și multe altele. Cu toate acestea, din moment ce Adobe a achiziționat Figma în 2022, pot exista unele modificări care vor modifica clasamentul.
Sunt multe utilizări pentru Figma. Este folosit în principal pentru design digital și nu puteți proiecta în CMYK pentru imprimare. Unele dintre principalele utilizări ale Figma includ:
- Prototiparea
- Design UX/UI
- Design aplicație
- web design
- Design de prezentare
Puteți utilizați pluginuri pentru modele Figma pentru a vă arăta design-urile, convertiți pagini web reale în modele Figma folosind plugin-uri și chiar creați șabloane principale pentru modelele Figma pentru a vă economisi timp în tipurile de design repetitive.
Cât costă Figma?
Puteți crea un cont Figma gratuit pe Site Figma sau prin descărcarea Aplicația Figma. Un cont gratuit oferă funcționalitate pentru toate aspectele de design ale aplicației. Puteți proiecta cu Figma și FigJam—instrumentul de colaborare Figma.
Dacă utilizați Figma ca hobbyist sau ca liber profesionist, versiunea Free Forever este aproape perfectă. Încă aveți acces la toate pluginurile, puteți invita colaboratori nelimitați, puteți utiliza fișiere personale nelimitate și puteți utiliza Figma de pe toate platformele.
În timp ce versiunea gratuită a Figma oferă mai mult decât suficient pentru orice designer standard, un abonament Figma Professional vă permite invitați colegi de echipă, lucrați din bibliotecile echipei, aveți acces la fișiere Figma nelimitate și istoricul versiunilor și multe altele, pentru 12 USD pe lună pe editor. Dacă sunteți student sau educator, puteți obține gratuit Figma Professional.
Cum să utilizați Figma: elementele de bază
Indiferent dacă utilizați aplicația Figma sau versiunea de browser, puteți urmări cu ușurință.
Când deschideți Figma, vi se vor prezenta opțiuni pentru a începe un nou fișier Figma, un nou fișier FigJam sau pentru a importa un fișier realizat într-un alt program, cum ar fi Sketch sau Adobe XD. Dacă ați folosit Figma înainte, veți vedea și proiectele dvs. anterioare Figma pe care le puteți deschide și la care puteți lucra.
Navigarea în spațiul de lucru Figma
Deschiderea unui fișier nou pare inițial neinspirant. Spre deosebire de multe alte programe de design, nu începeți cu tabloul de desen sau pânza, ci cu o pagină de design complet goală. Dar cu o minte plină de inspirație, nu va rămâne mult timp un spațiu gol.
Meniul orizontal din stânga sus începe cu Meniu principal pictograma - sigla Figma. Selectarea Meniu principal, puteți naviga la celelalte fișiere, acțiuni rapide Figma, opțiuni tipice pentru fișiere și acces la pluginuri, widget-uri și biblioteci.
În continuare, veți găsi Mișcare instrument (V), cu Scară instrument (K) cuibărit sub el. Aceste instrumente sunt pentru mutarea elementelor sau pentru scalarea părților din designul dvs. în sus sau în jos. Și în dreapta acestor instrumente, veți vedea instrumentele Regiune, Cadru (F), Secțiune, și Felie, cuibăriți împreună.
În Figma, un cadru este ceea ce alte programe pot numi un artboard sau o pânză. Selectați Cadru pentru a-ți desena pânza personalizată. Când este selectat, meniul din dreapta va prezenta opțiuni de cadru prefabricate pentru dimensiunile obișnuite ale dispozitivelor: smartphone-uri, tablete, desktop-uri, ceasuri inteligente, prezentări și opțiuni pentru rețelele sociale. Puteți, de asemenea, să faceți clic și să trageți direct cadrul pentru a-l crea orice dimensiune personalizată.
Înapoi la meniul din stânga sus, în dreapta instrumentelor Regiune se află Formă unelte, Pix instrumente, iar Text instrument. Urmat, apoi, de Resurse—Componente, Pluginuri, și Widgeturi-si Mână instrument de deplasare în jurul fișierului dvs. Și, în cele din urmă, Comentarii instrument care este excelent pentru a face note și a colabora cu colegii de echipă.
Meniul Figma Design
Cu un cadru întocmit, selectarea titlului acestuia activează cadrul, gata de proiectare. Meniul din dreapta arată titlurile pentru Proiecta, Prototip, și Inspecta. După cum sugerează și numele, opțiunea Design este meniul pe care îl veți folosi pentru a proiecta elementele de pe cadru.
În timp ce meniul inițial Design este oarecum simplist, pe măsură ce adăugați mai multe elemente la design, opțiunile de meniu evoluează. La început, meniul rulează de sus în jos cu instrumente de aliniere, instrumente de dimensionare, Aspect automat, Grilă de aspect, Strat, Completati, Accident vascular cerebral, Efecte, și Export. Unele dintre acestea sunt minimizate în mod implicit, dar făcând clic pe + semn, puteți deschide orice meniu sau puteți apăsa – pentru a o minimiza.
După ce ați desenat cadrul principal pentru proiect, puteți utiliza instrumentele Forme sau instrumentele Pen pentru a desena forme sau adăugați substituenți de imagine și puteți adăuga text folosind instrumentul Text în moduri pe care probabil le-ați făcut în alte moduri software.
Odată ce aveți forme sau text pe cadru, utilizați diferitele opțiuni din meniul din dreapta pentru a edita și proiecta acele elemente. The Strat meniul oferă opacitate și moduri de amestecare; cu Completati puteți adăuga culoare sau inserați imagini cu unele funcții de editare, cum ar fi Expunere, Contrast, Temperatura, și altele.
Pe măsură ce construiți mai multe elemente în proiectul dvs., straturile se vor forma în partea stângă Straturi meniul de lângă Active fila. Puteți face dublu clic pe titlul unui strat pentru a găsi elementul și invers; puteți face dublu clic pe un element de design pentru a găsi stratul evidențiat. Făcând dublu clic pe titluri, vă permite să le redenumiți pentru o organizare optimă.
Meniul Figma Prototype
În dreapta lui Proiecta opțiunea de meniu este Prototip meniul. Odată ce ați finalizat aspectele vizuale ale designului dvs. și ați stabilit casetele de imagine și textul unde ar trebui să meargă, puteți utiliza instrumentele prototip pentru a adăuga animații și tranziții la desenele dvs.
The Prototip meniul vă permite să conectați cadre sau componente împreună ca tranziții. Puteți alege ce ordine și cum trece fiecare cadru la altul.
Acest lucru funcționează excelent dacă ești realizarea unei prezentări Figma care se anime de la un diapozitiv la altul, dar instrumentul vă permite, de asemenea, să vizualizați animații pentru butoane sau meniuri pentru aplicații și design web. Puteți adăuga mai multe tranziții pe pagină pentru toate lucrurile diferite, astfel încât să puteți vedea cum ar interacționa utilizatorii cu site-ul dvs. atunci când acesta este live.
În timp ce folosirea Figma pentru a proiecta un site web nu este același lucru cu crearea unui site web live, vă puteți preda Figma. proiectați pentru echipa dvs. de dezvoltatori, care vă poate recrea interacțiunile prototip ca desene de animație în viața reală pentru dvs site-ul web. Aceasta înseamnă că puteți trece de la o pagină la alta de la clicuri, timp sau alte interacțiuni.
Începeți cu Figma este ușor
Acum știți cum să navigați în aspectul Figma și cum funcționează instrumentele de bază de design și prototip. Deoarece Figma este atât de ușor accesibilă, este timpul să te ocupi de acest instrument de design și să vezi ce poți crea.
