A grafikai tervezőszoftverek világa hatalmas, és nagy a verseny. A Figma egy olyan tervezőeszköz, amely az UX/UI-tervezők élére száguldozik szerte a világon. De mit tud erről az intuitív eszközről?
Bár egyszerű, van egy tanulási görbe is, ha más tervezési eszközökhöz szokott. Nézzük meg a Figmát és annak használatát. Üdvözöljük a Figma 101-ben.
Mi az a Figma?
Ha az elmúlt években grafikusként vagy webdesignerként dolgozott, valószínűleg hallott már a Figmáról. Talán még használtad is.
A Figma egy tervezőeszköz, és folyamatosan a digitális tervezők kedvencévé vált, és olyan lehetőségeket szárnyal, mint az Adobe XD, az Adobe Photoshop és a Sketch, webdesign és sok más terén. Mivel azonban Az Adobe 2022-ben vásárolta fel a Figmát, előfordulhat néhány változás, amely átrendezi a ranglistát.
Vannak A Figma számos felhasználási módja. Elsősorban digitális tervezéshez használják, és nem lehet nyomtatni CMYK-ban. A Figma néhány fő felhasználási területe:
- Prototípuskészítés
- UX/UI dizájn
- Alkalmazás tervezés
- Web design
- Bemutató tervezés
tudsz használja a Figma makett beépülő modulokat hogy segítsen bemutatni terveit, valós weboldalak konvertálása Figma mintákká bővítmények segítségével, sőt létrehozhat is mestersablonok a Figma tervekhez időt takaríthat meg az ismétlődő tervezési típusoknál.
Mennyibe kerül a Figma?
Ingyenesen létrehozhat Figma fiókot a Figma oldal vagy letölti a Figma alkalmazás. Az ingyenes fiók funkcionalitást biztosít az alkalmazás minden tervezési szempontjához. Tervezhetsz Figmával ill FigJam – a Figma együttműködési eszköze.
Ha a Figmát hobbiként vagy egyedüli szabadúszóként használja, a Free Forever verzió szinte tökéletes. Továbbra is hozzáférhet az összes beépülő modulhoz, korlátlan számú együttműködőt hívhat meg, korlátlan számú személyes fájlt használhat, és minden platformról használhatja a Figmát.
Míg a Figma ingyenes verziója többet kínál minden szabványos tervező számára, a Figma Professional előfizetéssel csapattársakat hívhat meg, csapatkönyvtárakból dolgozhat, korlátlan számú Figma-fájlokhoz és verzióelőzményekhez férhet hozzá, és még sok más, havi 12 dollárért szerkesztő. Ha Ön diák vagy oktató, ingyenesen beszerezheti a Figma Professionalt.
A Figma használata: Az alapok
Akár a Figma alkalmazást, akár a böngésző verzióját használja, könnyedén követheti a lépést.
Amikor megnyitja a Figmát, lehetőség nyílik egy új Figma-fájl, egy új FigJam-fájl indítására, vagy egy másik programban, például a Sketch-ben vagy az Adobe XD-ben készült fájl importálására. Ha korábban használta a Figmát, akkor a korábbi Figma-projektjeit is láthatja, amelyeket megnyithat és dolgozhat rajta.
Navigálás a Figma munkaterületen
Egy új fájl megnyitása kezdetben nem tűnik ösztönzőnek. Sok más tervezőprogrammal ellentétben nem a rajztáblával vagy a vászonnal kezd, hanem egy teljesen üres tervezőoldallal. De ha az elme tele van inspirációval, akkor nem marad sokáig üres hely.
A bal felső vízszintes menü a következővel kezdődik Főmenü ikon – a Figma logó. Kiválasztva a Főmenü, navigálhat a többi fájlhoz, a Figma gyorsműveleteihez, a tipikus fájlbeállításokhoz, valamint hozzáférhet a bővítményekhez, widgetekhez és könyvtárakhoz.
Ezután megtalálja a Mozog eszköz (V), a... val Skála eszköz (K) fészkelődött alatta. Ezek az eszközök az elemek mozgatására vagy a terv egyes részeinek felfelé vagy lefelé történő skálázására szolgálnak. Ezen eszközök jobb oldalán pedig a Régió eszközök láthatók, Keret (F), Szakasz, és Szelet, egymásba fészkelve.
A Figmában a keret az, amit más programok rajztáblának vagy vászonnak nevezhetnek. Válassza ki Keret egyedi méretű vászon megrajzolásához. Ha kiválasztja, a jobb oldali menü előre elkészített keretbeállításokat jelenít meg a gyakori eszközméretekhez: okostelefonok, táblagépek, asztali számítógépek, okosórák, prezentációk és közösségimédia-beállítások. Arra is kattinthat, és közvetlenül húzhatja a keretet, hogy tetszőleges méretű legyen.
Vissza a bal felső menübe, a Régió eszközök jobb oldalán találhatók a Alak szerszámok, Toll eszközök, és a Szöveg eszköz. Ezt követi a források –Alkatrészek, Beépülő modulok, és Widgetek-és a Kéz eszköz a fájl mozgatásához. És végül a Hozzászólások eszköz, amely nagyszerű a jegyzetek készítéséhez és a csapattársakkal való együttműködéshez.
A Figma Design menü
A felrajzolt kerettel a cím kiválasztása aktiválja a keretet, készen áll a tervezésre. A jobb oldali menüben a következő címek jelennek meg Tervezés, Prototípus, és Vizsgálja meg. Ahogy a neve is sugallja, a Tervezés opció az a menü, amelyet a keret elemeinek megtervezéséhez használ.
Míg a kezdeti Tervezés menü kissé leegyszerűsített, amint több elemet ad hozzá a tervhez, a menüopciók fejlődnek. Eleinte a menü fentről lefelé fut az igazítási eszközökkel, a méretezési eszközökkel, Automatikus elrendezés, Elrendezési rács, Réteg, Tölt, Stroke, Hatások, és Export. Ezek közül néhány alapértelmezés szerint minimálisra van csökkentve, de a gombra kattintva + jelet, bármelyik menüt megnyithatja vagy leütheti – minimalizálni.
Miután megrajzolta a fő keretet a projekthez, használhatja az Alakzat eszközöket vagy a Toll eszközöket alakzatok rajzolásához, ill adjon hozzá képhelyőrzőket, és a Szöveg eszközzel olyan módon adhat hozzá szöveget, ahogyan azt valószínűleg máskor tette szoftver.
Ha már alakzatok vagy szövegek vannak a kereten, használja a különböző jobb oldali menüopciókat az elemek szerkesztéséhez és megtervezéséhez. A Réteg a menü opacitási és keverési módokat kínál; val vel Tölt színt adhat hozzá, vagy képeket szúrhat be bizonyos szerkesztési funkciókkal, mint pl Kitettség, Kontraszt, Hőfok, és több.
Ahogy több elemet épít fel a projektben, a rétegek a bal oldalon alakulnak ki Rétegek melletti menü Eszközök lapon. Az elem megkereséséhez kattintson duplán egy réteg címére, és fordítva; kattintson duplán egy tervezési elemre a kiemelt réteg megkereséséhez. A címekre duplán kattintva átnevezheti őket az optimális szervezés érdekében.
A Figma prototípus menü
A jobb oldalon a Tervezés menüpont a Prototípus menü. Miután véglegesítette a tervezés vizuális aspektusait, és beállította a képdobozokat és a szöveget a megfelelő helyre, használhatja a prototípus-eszközöket animációk és átmenetek hozzáadásához a tervekhez.
A Prototípus menü lehetővé teszi a keretek vagy alkatrészek összekapcsolását átmenetként. Kiválaszthatja, hogy melyik sorrend és hogyan váltson át az egyes keretek a másikba.
Ez nagyszerűen működik, ha Ön Figma prezentáció készítése amely egyik diáról a másikra animál, de az eszköz szakszerűen lehetővé teszi a gombok vagy menük animációinak megjelenítését az alkalmazások és a webdizájn számára. Oldalanként több átmenetet is hozzáadhat minden különböző dologhoz, így láthatja, hogy a felhasználók hogyan lépnek kapcsolatba a webhelyével, amikor az éles.
Míg a Figma használata egy webhely megtervezésére nem egyenlő az élő webhely létrehozásával, átadhatja a Figmát tervezzen a fejlesztői csapatának, akik a prototípus interakcióit valós animációs tervekként újraalkothatják az Ön számára weboldal. Ez azt jelenti, hogy oldalról oldalra válthat a kattintásokról, az időről vagy más interakciókról.
A Figma használatának megkezdése egyszerű
Most már tudja, hogyan navigálhat a Figma elrendezésben, és hogyan működnek az alapvető tervezési és prototípus eszközök. Mivel a Figma olyan könnyen elérhető, itt az ideje, hogy büszkélkedj ezzel a tervezőeszközzel, és nézd meg, mit hozhatsz létre.
