Tak bude vypadat naše aplikace ikony. Ale toho už bylo dost. Přímo začněme v programu Adobe Illustrator...
Krok 1: Vytvoření základu
Ve Illustratoru nejprve vytvořte nové Pracovní plochu pomocí Soubor>Nový. V následujícím okně vyberte formát 70x70mm. Potvrďte okno kliknutím na OK.
Vyberte Obdélníkové nástroje z Panelu nástrojů a poté klikněte na vaši Pracovní plochu. Zobrazí se dialogové okno, kde můžete zapsat velikost vašeho obdélníku. Zadejte zde velikost 35x35mm a potvrďte kliknutím na OK. Tímto jsme vytvořili základ pro ikonu aplikace.
Jelikož ikony aplikací od Applu nikdy nejsou čtvercové, musíme nyní zajistit, aby byly rohy zakulacené. Vyberte tedy obdélník a v horní nabídce přejděte na Effekt>Stilizovat filtry>Zakulacení rohů ...
V následujícím okně zadejte poloměr rohu 7mm. Potvrďte kliknutím na OK.
Po potvrzení tohoto efektu budou rohy zakulaceně zobrazeny, ale cesta stále probíhá čtvercově. Abyste to změnili, přejděte na Objekt>Zobrazit převod. Efekt byl nyní převeden v objektu (cesta nyní probíhá podél zakulacených rohů).
Pro následující krok budete potřebovat Paletu barev. Pokud ji ještě nemáte otevřenou, najdete ji pod Okno>Paleta barev.
Nyní klikněte na pole pro přechod v Paletě přechodů, aby byl váš zakulacený obdélník vyplněn standardní černobílým přechodem. (Pokud váš obdélník ještě má Obrys, je čas ho odstranit).
Při nastavení úhlu přechodu zadejte hodnotu 90°, aby byl přechod hezky zeshora dolů.
Jelikož naše ikona má mít modrý přechod, (můžete samozřejmě použít vlastní barvy) připravil jsem pro vás již dva RGB hodnoty.
• tmavě modrá - 28/57/145
• světle modrá - 84/244/255
Pro přiřazení těchto barevných hodnot k přechodu, stačí dvakrát kliknout na barevná pole v Paletě přechodů, čímž získáte možnost zadat RGB hodnoty.
(Pokud je u vás nastaven jiný režim barev, pak klikněte na malou šipku v pravém horním rohu v Paletě přechodů, abyste vybrali správný barevný režim).
Po provedení tohoto kroku by to u vás mělo vypadat přibližně takto. (Obrázek 11).
Pro zjemnění průchodu přejděte na Effekt>Stilizování filtry>Vnitřní lesk ... V režimu pro způsob výplně zvolte Kopírovat na sebe. Pro Průsvitnost zvolte hodnotu 75% a pro Rozmazání zvolte 8,8mm. Jelikož chceme tento efekt aplikovat pouze v okrajové oblasti, zvolte možnost Okraj. Potvrďte okno kliknutím na OK.
Dále přidejte Stín připojením Stínu prostřednictvím Effekt>Stilizování filtry>Stín ... Zvolte nastavení pro tento filtr přibližně podle Obrázku 13. Zde však můžete klidně trochu experimentovat.
V dalším kroku si zkopírujte obdélník pomocí Command+C a vložte ho na stejné místo pomocí Command+F. (Na PC provedete totéž s Ctrl+C a Ctrl+F).
Jelikož u kopie obdélníku již nepotřebujeme dříve použité efekty, musíte tyto odstranit. Jak možná víte, všechny efekty a filtry aplikované v Illustratoru jsou uvedeny v panelu Vzhled. Pokud tento panel není viditelný, otevřete ho znovu pomocí Okno> Vzhled.
Nyní odstraňte Stín. Můžete to udělat snadno tím, že přetažením Stínu v panelu Vzhled s podrženým levým tlačítkem myši přesunete do malého popelnice na spodním pravém okraji tohoto panelu.
Stín dovnitř nemusíte odstraňovat, pouze ho trochu upravíte. Nejprve ale změňte Barvu výplně vaší kopie obdélníku na bílou.
Klikněte poté v panelu Vzhled na Stín dovnitř, nastavte tam režim na Normální a u barvy vyberte hlubokou černou. Průhlednost nastavte na 100% a u Rozmazání můžete zvolit hodnotu 10mm (Obrázek 17).
Pro snížení kontrastu a získání hloubky našeho ikony aplikace snižte jednoduše Průhlednost na 50% a nastavte režim výplně na Měkké světlo. Všechny tyto úpravy proveďte v panelu Průhlednost. (I tento panel najdete opět pod Okno> Průhlednost).
Tím se zvýší kontrast a náš ikonka aplikace získá na hloubce.
Krok 2: Vytvoření paprskového kruhu
V tomto kroku se naučíte, jak vytvořit paprskový kruh pro ikonu aplikace. Nejprve si vypněte oba obdélníky vytvořené v kroku 1, abyste měli opět místo na pracovní ploše.
Vyberte nástroj Čára z Panelu nástrojů, nastavte Barvu obrysu na černou a Sílu obrysu na 0,5pt.
Nyní z okolí středu nakreslete čáru nahoru a držte přitom tlačítko myši stisknuté. Jakmile máte nakreslenou čáru (stále držte tlačítko myši), stiskněte Ctrl + klávesu s oběma těmito závorkami <>.
Nyní s drženým tlačítkem myši proveďte kruh. Tímto klíčovým stiskem se v závislosti na rychlosti pohybu kurzoru myši vytvoří různý počet čar.
Jakmile jste nakreslili kruh, mělo by to u vás vypadat přibližně tak jako na obrázku 19. (Zkuste to klidně několikrát, platí i zde "Cvičení činí mistra").
Označte všechny čáry a seskuptujte je pomocí Command+G (na PC: Ctrl+G). Zkopírujte celý obsah pomocí Command+C a Command+F (na PC: Ctrl+C a Ctrl+F), přepněte barvu obrysu u této kopie na bílou a lehce ji otočte vpravo nebo vlevo, aby byly části černých čar opět viditelné.
Celý jev by poté měl vypadat asi takto. (Obrázek 20):
Znovu označte všechny čáry a seskuptujte je znovu pomocí Command+G (na PC: Ctrl+G).
Nyní můžete znovu zobrazit obdélníky ze Schématu 1. Dbejte na to, aby střed vašeho paprskového kruhu byl zhruba uprostřed vašeho obdélníku.
Nyní si zkopírujete šedé zakulacené obdélníček, který jste v kroku 1 zkonturovali modrým průběhem. (Command+C nebo na PC - Strg+C).
Nyní klepněte na skupinu se zářivým paprskem a podívejte se do Průhlednost-Palety. Zde máte nyní možnost (podobně jako v Photoshopu) vytvořit masku. Dvakrát klikněte na oblast, která je vidět na obrázku 23. Tímto Dvojitým kliknutím se vytvoří takzvaná Průhlednost Masky.
Jakmile ji vytvoříte, také si všimnete, že se vaše Vrstvy-Paleta změnila, pokud jste uvnitř masky. S Command+F (na PC: Strg+F) nyní vložte předtím zkopírovaný obdélník do masky. Nyní musíte snížit Průhlednost z 50% na 10%.
Nyní opusťte masku, abyste se vrátili zpět do normálního zobrazení. Uděláte to tak, že jednou kliknete na bílé pole vedle symbolu masky. (Obrázek 25).
Krok 3: Vytvoření základu pro piktogram
Nyní jsme téměř hotovi s největší částí a jsme připraveni vložit piktogram nebo symbol do našeho aplikací ikony. Přesto musíme nejprve rychle vytvořit základnu nebo malou platformu, aby to všechno později vypadalo lépe.
Sežeňte si Nástroj elipsy a vykreslete s ním přibližně uprostřed elipsu. (Viz obrázek 26).
Tuto elipsu vyplňte tmavě modře. Pro to jsem použil následující barevné hodnoty. RGB - 0/0/255.
Snížte Průhlednost na přibližně 70% a poté přejděte na Effect> Rozmazat> Gaussovský rozostřovací filtr …
Pro rozostření jsem zvolil poloměr 28 pixelů. Tuto hodnotu samozřejmě můžete také libovolně změnit. Potvrďte tím celé s OK.
Krok 4: Vložení piktogramu
Po vytvoření základu je konečně tak daleko. Ve skutečnosti už zbývá pouze vložit piktogram do naší aplikace ikony. Jako malý bonus jsem vám do pracovních souborů přibalil několik různých piktogramů. Můžete však samozřejmě také použít vlastní.
Jděte do horního menu na Soubor> Umístit a zvolte tam piktogram podle vašeho výběru. V mém případě je to počítač ze souborů.
... hotovo! ... mohli byste si myslet ...
Ale ještě zbývá udělat jednu nebo dvě drobné věci. Inu, piktogram dostane ještě Stín. Přejděte na Effect> Filtry Stilizace> Stín. U hodnot pro tento Stín se řiďte obrázkem 32.
Krok 5: Přidání světelného záblesku
V posledním kroku přidáme ještě světelný záblesk, abychom to celé hezky zakončili. Sežeňte si Nástroj elipsy a vykreslete bílou elipsu jako na obrázku 33.
Nakonec stačí nastavit metodu výplně elipsy na Měkké světlo. Vaše aplikace ikony je hotova.
Závěrečné slova:
Doufám, že vám tutoriál udělal radost a nyní můžete vytvářet několik pěkných ikon aplikací. V přiložených souborech najdete také mou původní pracovní verzi, abyste se mohli podívat, pokud byste se v nějakém okamžiku nedostali dál.
Pokud máte k tomuto tématu ještě otázky, napište mi je prostě do komentářů. Budu se snažit na ně co nejdříve odpovědět.
S pozdravem
Váš Julian
