Jak Nakreslit Tlačítka Pro Web

Obsah:

Jak Nakreslit Tlačítka Pro Web
Jak Nakreslit Tlačítka Pro Web

Video: Jak Nakreslit Tlačítka Pro Web

Video: Jak Nakreslit Tlačítka Pro Web
Video: Ako na web vo WEBNODE pridať Tlačítko na Začiatok? (🔝 scroll to top) 2024, Listopad
Anonim

Uživatelsky přívětivé rozhraní, dobře nakreslená grafika, správné uspořádání prvků na stránce - polovina úspěchu webu u návštěvníka. Kreslení tlačítek pro web je malou, ale důležitou součástí práce na online projektu.

Jak nakreslit tlačítka pro web
Jak nakreslit tlačítka pro web

Instrukce

Krok 1

Zkuste nakreslit kulaté tlačítko. Níže uvedená metoda je také univerzální pro vytváření log a avatarů. Nakreslit to není těžké, navzdory množství akcí, které musíte provést.

Krok 2

Otevřete Adobe Photoshop. Vytvořte nový dokument stisknutím kombinace „Ctrl + N“. Parametry obrazu 300 * 300, rozlišení 72 ppi. Výchozí režim pozadí a barev je bílý, respektive RGB.

Krok 3

Nejlepší je kreslit vektory, aby se při zmenšení tlačítka nezhoršila jeho kvalita. Vyberte nástroj Ovál, podržte klávesu Shift a nakreslete kruh ze středu.

Krok 4

Nyní použijte některé efekty na výsledný kruh. Přejděte do nabídky „Vrstvy“- „Styl vrstvy“- „Možnosti míchání“. Zde budete muset použít přechod.

Krok 5

Dále zde zaškrtněte políčko „Reliéf“, abyste tlačítku poskytli potřebné vyboulení, a nastavte následující parametry: styl - obrysový ražba, metoda - měkký řez, hloubka - 220%, velikost - 1 pixel, změkčení - 5 pixelů, úhel - 135® bez globálního osvětlení, výška - 32, režim zvýraznění - normální s 30% krytím, stínový režim - násobení s 25% krytím

Krok 6

Chcete-li dát ještě větší hlasitost, zde v parametrech míchání zaškrtněte políčko „Stín“a nastavte následující parametry: režim míchání - násobení, průhlednost - 40%, úhel - 125 ° s využitím globálního osvětlení, offset - 5 pixelů, velikost - 20 pixelů.

Krok 7

Výsledkem provedených akcí bude takový obrázek, jak je znázorněno na obrázku.

Krok 8

Nyní vytvořte novou vrstvu, znovu vyberte „Ovál“a nakreslete kruh s menším poloměrem než první tvar. Otevřete "Možnosti míchání", zaškrtněte políčko vedle "Vnitřní stín" a nastavte parametry: Režim míchání - měkké světlo, úhel - 125 °, offset - 0px, zmenšení - 45%, velikost - 21px.

Krok 9

Dále zde v možnostech prolnutí zaškrtněte „Překrytí přechodu“a vytvořte přechod s parametry jako na obrázku. Klikněte na OK

Krok 10

Dále nastavte styl míchání na radiální, měřítko na 124%

Krok 11

Nyní zaškrtněte políčko "Tah" a nastavte následující parametry: velikost - 5 pixelů, poloha - venku, režim míchání - normální, neprůhlednost - 100%, typ tahu - přechod.

Krok 12

V důsledku těchto akcí byste měli dostat něco, co vypadá spíše jako tlačítko. Možnosti míchání můžete znovu otevřít a experimentovat s nimi.

Krok 13

Nyní musíme přidat tlačítka zvýraznění, aby tlačítko získalo skleněnou texturu. Chcete-li to provést, znovu vytvořte novou vrstvu, vyberte nástroj Oválný výběr, vytvořte ovál nad tlačítkem a pomocí nástroje Vyplnit ji vyplňte bílou. Podržte Ctrl, klikněte na vrstvu s barevným kruhem, obraťte výběr („Výběr“- „Inverze“). Nyní stiskněte Odstranit. Ovál by měl být oříznut po obvodu kruhu.

Krok 14

Na panelu Vrstvy změňte možnost Normální na Měkké světlo, poté klikněte na ikonu vektorové masky a vyberte Nástroj výplně - přechod. Vyplňte zvýraznění zdola nahoru. Tlačítko je téměř připraveno.

Krok 15

K tlačítku můžete přidat nápis. Můžete na něj také použít efekty prolnutí, například vnitřní, vnější záře, přechod atd. Nebojte se experimentovat, čím více představivosti ve své práci použijete, tím rychleji zvládnete editor i webový design.

Doporučuje: