Curs Figma

Lecția 1 • Fișiere, pagini și organizarea proiectelor

Învață cum să creezi, denumești și organizezi fișiere și pagini. O structură adecvată previne confuzia în proiecte cu mai multe pagini sau în echipă.

Lecția 2 • Scurtături esențiale de tastatură

Acoperă cele mai utile comenzi rapide pentru selecție, zoom și schimbarea uneltelor. Obiceiurile de viteză formate devreme se cumulează pe tot parcursul cursului.

Lecția 3 • Aspectul interfeței și navigarea

Prezintă fiecare panou, bară de instrumente și meniu din editor. Cursanții dobândesc conștientizare spațială a spațiului de lucru pentru a lucra fără ezitare.

Lecția 1 • Lucrul cu forme primitive

Acoperă dreptunghiuri, elipse, poligoane și stele cu controale precise de dimensiune. Aceste forme sunt blocurile de construcție atomice ale oricărui design.

Lecția 2 • Operații booleene și editarea căilor

Învață Unirea, Scăderea, Intersecția și Excluderea pentru a combina forme în forme complexe. Logica booleană extinde semnificativ viteza de creare a pictogramelor și formelor.

Lecția 3 • Instrumente de aliniere și distribuire

Acoperă comenzile de aliniere, distribuire și ordonare pentru aranjarea spațială precisă. Spațierea consecventă este fundamentală pentru layouturi de calitate profesională.

Lecția 4 • Desenare vectorială cu instrumentul Peniță

Introduce puncte de ancorare, mânere Bézier și editarea căilor. Pictogramele și ilustrațiile personalizate necesită aceste fundamente vectoriale.

Lecția 1 • Crearea și aplicarea stilurilor locale

Învață cum să salvezi culorile, stilurile de text, efectele și grilele ca stiluri locale reutilizabile. Stilurile impun consecvența și accelerează iterația de design.

Lecția 2 • Tipuri de umplere și selectorul de culoare

Acoperă umplerile solide, gradientele liniare și radiale, umplerile cu imagini și comenzile selectorului de culoare. Acuratețea culorii este esențială pentru munca de design conformă cu brandul.

Lecția 3 • Proprietăți de contur și efect

Învață grosimea conturului, poziția, modelele de linii punctate și efectele de strat precum umbra de picătură și estomparea. Efectele adaugă profunzime și rafinament componentelor UI.

Lecția 4 • Opacitate, moduri de amestec și mascare

Introduce opacitatea stratului, opțiunile de mod de amestec și tehnicile de creare a măștilor. Aceste comenzi permit compoziții vizuale avansate în orice design.

Lecția 1 • Constrângeri și cadre responsive

Acoperă setările de constrângere pentru straturile non-Auto Layout și redimensionarea responsivă a cadrelor. Constrângerile asigură că elementele rămân ancorate corect pe diferite dimensiuni de ecran.

Lecția 2 • Fundamentele Auto Layout

Introduce modurile Auto Layout orizontal, vertical și de împachetare cu comenzi de padding și spațiere. Auto Layout înlocuiește repoziționarea manuală atunci când conținutul se modifică.

Lecția 3 • Structuri Auto Layout încastrate

Învață cum să înnestezi cadre Auto Layout unul în interiorul altuia pentru a construi modele UI complexe. Înnestarea este modul în care sunt construite componentele din lumea reală, precum cardurile și barele de navigare.

Lecția 4 • Grile și ghidaje de layout

Introduce ghidaje de layout pentru coloane, rânduri și grile pentru proiectarea structurată a ecranelor. Grilele aliniază designurile la punctele de întrerupere reale de dezvoltare și sistemele de spațiere.

Lecția 1 • Crearea și utilizarea componentelor

Acoperă cum să convertești cadrele în componente principale și să plasezi instanțe. Componentele sunt unitatea de bază a sistemelor de design scalabile și ușor de întreținut.

Lecția 2 • Organizarea unei biblioteci de componente

Învață ierarhiile de denumire, gruparea cu slash-uri și publicarea unei biblioteci partajate. O bibliotecă bine organizată este coloana vertebrală a consecvenței designului la nivelul echipei.

Lecția 3 • Suprascrieri și proprietăți ale instanțelor

Învață suprascrierile de text, umplere, vizibilitate și schimbare pe instanțe fără a rupe legătura cu componenta principală. Suprascrierile permit reutilizarea flexibilă pe diferite ecrane.

Lecția 4 • Variante de componente

Introduce funcția Variante pentru a grupa stările conexe ale componentelor într-un singur set. Variantele eficientizează gestionarea stărilor pentru butoane, câmpuri de intrare și carduri.

Lecția 1 • Conexiuni și fluxuri de prototip

Acoperă crearea conexiunilor între cadre, stabilirea punctelor de plecare și definirea fluxurilor. Fluxurile permit stakeholderilor să experimenteze un design ca o secvență navigabilă.

Lecția 2 • Animație inteligentă și micro-interacțiuni

Introduce Animația inteligentă pentru a interpola straturile care se potrivesc între cadre. Micro-interacțiunile ridică fidelitatea prototipului și demonstrează intenția de design de mișcare.

Lecția 3 • Declanșatoare și acțiuni

Învață declanșatoarele de clic, hover, glisare, apăsare de tastă și intrare a mouse-ului cu acțiuni corespunzătoare. Perechile declanșator-acțiune definesc modul în care interacțiunile se simt și se comportă.

Lecția 4 • Tranziții și animații

Acoperă tranzițiile instantanee, de dizolvare, de intrare/ieșire, de împingere și de glisare cu curbe de atenuare. Tranzițiile comunică relațiile spațiale dintre ecrane.

Lecția 1 • Funcții de colaborare în timp real

Acoperă cursorii multiplayer, modul de observare și modul de urmărire pentru co-design live. Funcțiile în timp real reduc schimburile asincrone în echipele distribuite.

Lecția 2 • Predarea pentru dezvoltatori cu Dev Mode

Introduce Modul Dev pentru inspectarea spațierii, culorilor, tipografiei și activelor exportate. Modul Dev reduce decalajul dintre intenția de design și implementare.

Lecția 3 • Exportarea activelor și specificațiilor

Învață setările de export pentru PNG, SVG, PDF și WebP la mai multe rezoluții. Configurarea corectă a exportului asigură că activele se redau corect în producție.

Lecția 4 • Permisiuni de partajare și control al accesului

Acoperă nivelurile de permisiuni de vizualizare, editare și comentare pentru fișiere și proiecte. Permisiunile corecte protejează activele de design, permițând în același timp accesul stakeholderilor.

Lecția 1 • Versionare și QA de design

Acoperă salvarea versiunilor denumite, fluxurile de lucru de ramificare și fuzionare și listele de verificare pentru QA de design. Procesele de versionare și QA protejează integritatea designului pe parcursul lansărilor iterative.

Lecția 2 • Strategii multi-brand și de teme

Învață utilizarea modurilor de variabile pentru a comuta instantaneu între teme light/dark și de brand. Tematica la nivel de variabilă elimină seturile duplicate de componente.

Lecția 3 • Pluginuri, widgeturi și automatizare

Introduce ecosistemul de pluginuri Figma, elementele de bază ale creării de widgeturi și cazuri de utilizare a automatizării. Pluginurile extind capacitățile native ale Figma și elimină sarcinile manuale repetitive.

Lecția 4 • Arhitectură avansată de componente

Acoperă componentele bazate pe sloturi, componentele de bază și modelele de compoziție a componentelor. Arhitectura avansată reduce numărul de componente, crescând în același timp flexibilitatea designului.

Lecția 5 • Tokeni de design și variabile

Acoperă variabilele Figma pentru tokeni de culoare, număr, șir de caractere și boolean cu moduri. Variabilele permit designul multi-temă și multi-brand dintr-o singură sursă de adevăr.