Ako vytvoriť prechod vo Figme

Keď sa neviete rozhodnúť pre jednu farbu, vynikajúcou možnosťou sú prechody. Vo Figme môžete vytvoriť rôzne prechodové pozadia, umiestniť prechod na tvar a text, vytvoriť prechody ťahov a oveľa viac. Môžete dokonca vytvárať sieťové prechody pomocou efektu rozmazania alebo pomocou komunitného doplnku Figma pre prechody.

Keďže Figma má toľko rôznych spôsobov, ako vytvoriť gradient, noví používatelia môžu mať problém pochopiť ich všetky od začiatku. Samozrejme, experimentovanie je súčasťou procesu učenia, ale je oveľa jednoduchšie mať všetky pokyny na jednom mieste. A presne to poskytuje tento článok.

Ako vytvoriť rôzne štýly prechodov vo Figme

Figma ponúka rôzne štýly prechodov, ktoré môžete použiť na vyplnenie pozadia alebo objektov na plátne viacerými farbami.

• Lineárne:  Lineárne prechody majú dve farby, ktoré sa spájajú v jednej priamke.
• Radial:  Pri radiálnych prechodoch začína prvá farba z jedného bodu a prelína sa s druhou vo všetkých smeroch.
• Uhlový:  V uhlových prechodoch môžete určiť smer, ktorým sa prechod pohybuje, pridaním uhlov. Je to vynikajúca možnosť na vytváranie 3D obrázkov.
• Diamant:  Ako už názov napovedá, diamantové gradienty začínajú od jedného bodu a rozprestierajú sa v tvare diamantu.

Kroky na vytvorenie ktoréhokoľvek z týchto štýlov prechodu sú rovnaké. Jediný rozdiel je vo zvolenom štýle. Tu je návod, ako vytvoriť gradientný dizajn vo Figme:

1. Otvorte prázdny súbor Figma.
   
2. Klepnite na nástroj „Obdĺžnik“ na ľavom paneli nástrojov.
   
3. Pomocou nástroja nakreslite na plátno obdĺžnik, ktorý sa použije ako referencia prechodu.
   
4. Vyberte vytvorený obdĺžnik.
   
5. Kliknutím na aktuálnu farbu v časti „Vyplniť“ na pravom paneli otvoríte výber farby.
   
6. Stlačte rozbaľovaciu ponuku a zmeňte predvolený „Plný“ na ľubovoľný štýl prechodu. Zobrazia sa dve farebné zarážky alebo políčka.
   
7. Vyberte každú zarážku farieb a vyberte farbu, ktorú chcete pridať do prechodu.
   
8. Klepnutím na štyri bodky vedľa položky „Vyplniť“ uložíte prechod ako štýl.
   

Potom môžete upraviť hodnotu priehľadnosti, umiestniť farebné zarážky tam, kde chcete, aby jedna farba skončila a druhá začala, pridať ďalšiu zarážku farieb, posúvať ich na plátne alebo zmeniť uhol prechodu. Po dokončení úprav znova uložte prechod (krok 8).

Poznámka:  Ak chcete odstrániť zarážku farby, ktorú ste pridali, vyberte zarážku a stlačte na klávesnici „Odstrániť“ alebo „Backspace“.

Teraz môžete použiť štýl prechodu na ľubovoľný objekt.

Ako vytvoriť sieťový prechod vo Figme

Sieťované prechody sú obľúbené medzi veľkými spoločnosťami a značkami. Ak ste častým používateľom Instagramu, každý deň ho vidíte s logom aplikácie. Preto vedieť, ako ich vytvoriť, môže byť užitočné v situáciách, keď potrebujete do svojich projektov pridať nejaký záujem.

Ako už bolo spomenuté, prechody siete je možné vytvárať pomocou doplnku , ktorý poskytuje komunita Figma. Existuje však jednoduchší spôsob, ako pridať viacero farieb na ľubovoľné miesto na plátno bez potreby externých nástrojov.

Tu je postup, ako vytvoriť gradient siete vo Figme:

1. Zadajte nový súbor Figma.
   
2. Vytvorte rám.
   
3. Začiarknite políčko „Obsah klipu“ na pravom paneli, aby sa všetko, čo presahuje rámec rámca, orezalo.
   
4. Začnite pridávať rôzne tvary alebo si vytvorte vlastný objekt pomocou nástroja „Pero“ vo vnútri rámu.
   
5. Zmeňte „Výplň“ každého nového formulára tak, aby sa líšil od ostatných.
   
6. Vyberte všetky tvary.
   
7. V časti Efekty stlačte rozbaľovaciu ponuku a vyberte možnosť Rozostrenie vrstvy.
   
8. Otvorte nastavenia „Rozostrenie vrstvy“ a zvyšujte hodnotu, kým už medzi tvarmi neuvidíte jasné hranice.
   
9. Uložte štýl ako vyššie a použite ho na iné objekty.

Ďalším spôsobom, ako vytvoriť sieťový gradient, je použitie uhlového štýlu. Poskytuje trochu iný, ale rovnako zaujímavý fascinujúci výsledok ako prvý tutoriál.

Tu je to, čo musíte urobiť:

1. Otvorte prázdne plátno.
   
2. Použite požadovaný tvar a pridajte ho na plátno.
3. V časti „Výplň“ zmeňte „Plné“ na „Uhlové“.
   
4. Vyberte farby pre gradient.
   
5. Upravte uhol a ďalšie aspekty prechodu.
   
6. Pridajte ďalší tvar, najlepšie „Eclipse“, tj kruh.
   
7. Položte ho na druhý tvar na plátne.
   
8. Pridajte lineárny prechod a zmeňte farbu na takú, ktorá dobre zodpovedá zvyšku.
   
9. V časti „Efekty“ použite efekt „Rozmazanie vrstvy“ a rozmažte čiary nového tvaru, aby ste ho zmiešali s prvým.
   

Ako gradovať obrázok vo Figme

Okrem vytvorenia prechodu môžete prechodom prekryť aj existujúci obrázok a pridať tak nejaký rozmer. Dodáva mu efekt „vyblednutia“ alebo ilúziu neviditeľného zdroja svetla žiariaceho na obraz zvonku.

Tu je postup, ako pridať prechod do obrázka vo Figme:

1. Otvorte nový súbor vo Figme.
   
2. Presuňte obrázok, ku ktorému chcete pridať prechod, na plátno.
   
3. Navrch pridajte tvar, ktorý zodpovedá veľkosti obrázka.
   
4. V časti „Vyplniť“ vyberte štýl prechodu.
   
5. Vo výbere farieb vyberte farby prechodu.
   
6. Upravte nepriehľadnosť, uhol atď.
   

Môžete tiež použiť nástroj „Pero“ a nakresliť tvar v oblasti, kde chcete mať prechod.

Ako gradovať text vo Figme

Vytvorenie prechodu na texte vo Figme je veľmi podobné tomu, ako vytvoríte prechod pre akýkoľvek iný tvar. Tu sú kroky:

1. Otvorte nové plátno vo Figme.
   
2. Stlačte nástroj „Text“ na paneli nástrojov vľavo.
   
3. Kliknite kdekoľvek na plátno a začnite písať.
4. Vyberte text a prejdite na „Vyplniť“.
   
5. Vyberte štýl prechodu.
   
6. Stlačte každé pole farieb a nájdite farbu, ktorú chcete pridať do prechodu.
   

často kladené otázky

Koľko farieb môžem pridať do prechodu vo Figme?

Môžete pridať toľko farieb, koľko chcete, v štandardných štýloch a štýloch gradientov Figma. Ale snažte sa to nepreháňať. Keďže prechody majú viacero prechodových farieb, viac ako päť môže byť priveľa, dokonca aj pre sieťový prechod.

Môžem importovať gradient do Figmy?

Do Figmy môžete importovať ľubovoľný gradient. Môžete napríklad vložiť kód z CSS (Cascading Style Sheets) otvorením panela „Kód“ a vložením kódu. Prechody môžete importovať aj z aplikácie Adobe Illustrator.

Kde nájdem voľné prechody Figma?

Bezplatné a platené prechody Figma nájdete v  komunite Figma . Obsahuje množstvo nádherných a jedinečných dizajnov vytvorených používateľmi Figmy. Môžete filtrovať podľa doplnkov, súborov a miniaplikácií. Stačí zadať „gradient“ do vyhľadávacieho panela v hornej časti a nájsť ten, ktorý sa vám páči.

Získajte funky s farebnými prechodmi

Prechody sú vynikajúcim spôsobom, ako urobiť dizajn odlišným a personalizovaným. A Figma vám umožňuje urobiť hladký prechod medzi akýmikoľvek dvoma alebo viacerými farbami, ktoré si vyberiete. Nepreháňajte to však. Miešajte farby, ktoré sa k sebe hodia, a snažte sa zostať v rámci rovnakej farebnej palety.

Skúšali ste už urobiť gradient vo Figme? Povedzte nám v komentároch nižšie, aký štýl prechodu ste použili a na čo ste ho použili.