Dobrý den! Chcete-li do Figmy přidat dovednosti manipulace s vrstvami, ukážu vám, jak můžete v závislosti na interních objektech rozzářit zářící tlačítko s maskou.
1. Objekty
Nejprve musíte vytvořit dva objekty
2. Maska
Maskujte objekty tlačítkem v horní části obrazovky Figma nebo ctrl + alt + M. Po vytvoření masky do ní přidejte další obdélník, aby maska nebyla průhledná
3. Rozostření
Elipsě dodáte efekt rozostření vrstvy. Přesuňte ji k okraji tak, aby polovina elipsy přesahovala masku.
4. Znovu maskovat
< p> Vyberte ve vrstvách objekt „Maska“. Dejte mu vržené stíny s dostatečnou intenzitou rozmazání (asi 50). Získáte efekt, že slabá záře elipsy je viditelná mimo masku
Nyní již znáte princip slábnoucí záře mimo masku. Skvělé, vytvořme nyní tlačítko s tímto efektem.
Oznámení na vc.ru Zakázat reklamy Osobní zkušenost Jak jsem investoval 24,5 milionu rublů do reklamy na moji značku sluchátek CaseGuru Ahoj všichni! Jsem tu znovu s vámi, obyvatelem Tyumenu Vadima Bokova – tvůrce značky příslušenství CaseGuru pro smartphony. V …
5. Tlačítko objekty
Vytvořte obdélník, dvě elipsy a text tlačítka. Hlavní místo je, že hranice elipsy leží v jedné části na povrchu obdélníku a v druhé části vyčnívají za jeho okraj.
6. Maska tlačítka
Teď, jak jsem ukázal výše, zabalíme objekty do masky
7. Dekorace
V takovém tlačítku musí mít obdélník, který vytvoříme pro pozadí, velikost masky, včetně zaoblení nebo jiných manipulací, aby se hrany obdélníku a masky shodovaly. (Pro správnou vnitřní záři kolem okraje masky)
Nastavte styl na obdélník:
– Vyplňte # $$$$$$ 1% (libovolná barva)
– Inner Shadow Blur 6 (uprostřed)
Také obarvujeme naše elipsy a dáváme jim efekt rozostření vrstev a dostaneme toto tlačítko
8. Přidání efektu k masce
Na samotnou vrstvu masky můžete přidat 1 nebo 2 vržené stíny, které se vám líbí, ale já použijte dvě vrstvy rozostření s hodnotou 8 a 3 (uprostřed) …
Výsledek: Máme světelné tlačítko, ve kterém jsou zvnějšku zvýrazněny vnitřní efekty, jako by vytvářely slábnoucí záři.
Děkujeme, že jste si přečetli do konce, nebo ještě lépe – pro zábavu, toto je vše na obr.!) Můžete si také přizpůsobit animace pohybu elips při vznášení, ale pokud chcete, v jiné sérii. 🙂