Photoshop tutoriál: Tvorba ikonky zeměkoule - 2. díl - Grafika.cz - vše o počítačové grafice

1. února 2008, 00.00 | V druhé části článku o tvorbě ikonky zeměkoule se zaměříme na finální
úpravy, bez kterých se žádná profesionální ikonka nemůže obejít. Správný obrys,
stín, pozadí a nějaké ty detaily, pro realističtější vzhled.

Doufám, že jste od minule nezapomněli, že máme něco rozpracovaného. Otevřete dokument s vaší ikonkou a pokračujeme v práci. Vrstva s mapou je sice pěkná, ale neškodilo by ji trochu ztmavit. K tomu použijeme nástroj Ztmavení (Burn Tool), nastavený na Stíny (Shadows) a 45%.

Pár tahů v pravé části a ikonka je opět o něco pěknější.

Stále ji ale chybí nějaký konkrétní obrys. Protože jsme už vyčerpali možnosti efektů vrstvy, musíme si pomoci jinak. Třeba tak, že vrstvu zkopírujeme, odmažeme efekty vrstvy, nastavíme ji krytí výplně na 0% a posuneme nad všechny ostatní. Odteď se efekty této vrstvy projeví na všech vrstvách pod ní. Takže směle do obrysu.

Ten vykouzlí efekt Vržený stín (Drop Shadow). Vzdálenost (Distance) 1 px, Rozsah (Spread) 100% a Velikost (Size) 2 px způsobí, že stín bude nerozmazaný, o dva pixely větší než originál a o pixel posunutý. Úhel (Angle) 90° zajistí, aby byl posunutý správně - směrem dolů.

Pro ještě plastičtější vzhled přidáme další Vnitřní Stín (Inner Shadow). Efekt je nepatrný, jak si pomoci?

Opět vyzkoušíme jinou interakci. V tomto případě se skvěle hodí Lineárně ztmavit (Linear Burn).

A pro oddělení od pozadí přidáme Vnější Záři (Outer Glow), která nebude svítit, ale stínit. To zajistí barva #506380, interakce Normal. Velikost volte opravdu velkou, např. jako na ukázce 54 px. Tím bude efekt postupný a málo patrný. A to je z efektů vrstev vše. Potvrďte OK a pustíme se do stínů.

Resp. stínu. Ten se ale bude skládat z více vrstev. Začneme elipsou barvy #1E2D4B v nové vrstvě. Nedělejte ji zbytečně velkou.

Tu zkopírujte, originál skryjte a zkopírovanou vrstvu rozostříme efektem Gaussovské rozostření (Gaussian Blur). Poloměr např. 5 px.

Původní vrstvu zobrazte a tu nejprve rozostříme filtrem Rozmáznout (Motion Blur)...

...a poté opět filtrem Gaussovské rozostření (Gaussian Blur). Tentokrát je ale poloměr menší - 2,7 px.

Stín můžete buď nechat tak jak je - dál od ikonky...

...nebo jej posunout těsně pod ní. Přestože to na ukázkách není vidět, stín nahoře má nastavené poloviční krytí oproti stínu dole. Tj. čím dál je stín od objektu, tím musí být logicky průhlednější.

Ikonku vylepšíme pomocí jednopixelových elips, které budou náhodně umístěné. Vytvoříme první elipsu, které nastavíme krytí výplně na 0%.

A přidáme jednopixelový bílý obrys efektem Vytažení (Stroke).

Poté stáhneme krytí na 20%...

...a vrstvu několikrát zkopírujeme, přičemž ji vždy malinko transformujeme. Zvětšíme, zmenšíme, otočíme... je to jen na vás. Zde je jeden náhled bez podkladové vrstvy, aby byl výsledek lépe vidět.

Nezapomeňte všem těmto vrstvám nastavit podkladovou vrstvu jako masku (Ctrl + G). Aby nezasahovaly mimo ikonku.

Poslední část práce je vylepšení pozadí. Pomocí pixelového vzorku na něm zobrazíme původní mapu. Jak vytvořit podobný vzorek si můžete přečíst ve článku Photoshop tutoriál: Diagonální vzorky - základy

Přidáme novou vrstvu úprav Vzorek (Pattern).

Nastavíme vhodný vzorek.

Přidáme masku vrstvy, do které vložíme původní mapu.

A vrstvě přepneme interakci na Násobit (Multiply) a stáhneme Krytí (Opacity) na 10%.

A to je vše! Doufám, že se vám ikonka povedla minimálně stejně tak dobře, a přeji hodně štěstí do další práce.

Autor článku Václav Krejčí se zabývá grafikou a GUI designem, své zkušenosti nejnověji zúročil v knize "Adobe Photoshop: design grafiky GUI", věnované tvorbě grafických uživatelských rozhraní.