Tips&Tricks #2 (Snow Design- Part 1)

4. prosince 2013 v 20:28 | © CREATIVELAND | chloè. |  Tips&Tricks
Keď už mám tie meniny, rozhodla som sa vytvoriť pre vás niečo špeciálne, kokrétne tutoriál na "sneženie na designe". Videla som že VEĽA ľudí to na svojich designoch chce, ale skoro nikto to nevie urobiť.

V tejto časti tutoriálu sa budem venovať vytvoreniu animácie sneženia, v ďalšej časti to bude "trochu" náročnejšie: budeme náš gifový sniežik rozrezávať tak, aby nám na designe fungovali všetky odkazy (horné menu...).

Podľa tohoto článku budete vedieť urobiť gif sneženie, alebo keď budete šikovný aj pršanie, v podstate na čomkoľvek, je jedno či je to design, signatura, wallpaper, alebo niečo podobné :) Tutoriál PART 1 (kde sa podrobne rozoberá vytvorenie animácie sneženia) nájdete v celom článku :)

Tento tutoriál nesmiete nijako kopírovať ani zverejňovať na vašom blogu! Slúži na to, aby ste sa z neho niečo naučili, nie na to, aby ste ho rozširovali po svojich blogoch a nebodaj vydávali za svoj!
----------------------------------------------------------------------------------------------------------------------------------------


GETTING STARTED
1. V prvom rade potrebujete design, fotku, signaturu, čokoľvek kde budete sneženie skúšať. Ja použijem design ktorý mám momentálne nastavený na blogu. Hotový design si otvorím vo formáte *png.

2. Ďalej budete potrebovať snehové vločky (download x download x download). Keď ste šikovný, určite si nejaké viete vyrobiť aj sami :) Ja ale na ukážku použiívam druhé vločky :)

3. Samozrejme potrebujete aj photoshop, a nejaké základné zručnosti vo photoshope. Táto časť tutoriálu nie je vôbec náročná, zvládne to aj začiatočník, ale nejaké základy sú určite potrebné.
----------------------------------------------------------------------------------------------------------------------------------------

BRUSHING SNOW
DESIGN MÁME OTVORENÝ V PNG FORMÁTE!!

(0. Nad vrstvu s designom si môžete vytvoriť novú vrstvu, vyplnenú čiernou farbou, aby ste mohli lepšie pozorovať ako sa sneh pohybuje)
1. Sneh nesmie presahovať šírku záhlavia! Je dobré urobiť si pomocné čiary (Pravítko), a všetko mimo šírky záhlavia budeme gumovať. Zasnežená ale musí byť celá výška designu!
--------------------------
2. Vytvoríte si novú vrstvu a na novú vstvu začnete pomocou brushov snežiť
--------------------------
3. Treba odstrániť všetok sneh za našimi pomocnými čiarami
--------------------------
4. Teraz si vytvoríme zo snehu pattern (pri tvorení patternu musia byť všetky vrstvy okrem snehu neviditeľné!)
--------------------------
5. Vytvoríme si novú vrstvu (vyplníme ju akoukoľvek farbou) na ktorú aplikujeme snehový pattern. Výplň vrstvy/Fill nastavíme na 0% (vrstvu si pomenujeme napr. pattern, ja mám jednoducho Layer1 :D)
--------------------------
6. Vrstvu SNEH teraz nepotrebujeme, preto ju zneviditeľníme. Naopak si dajte záležať aby bola čierna vrstva Pozadie viditeľná (omnoho lepšie bude vidno pohyb snehu)

(POZNÁMKA: Nezabudnite si súbor priebežne ukladať (CTRL+S) v PSD formáte.)
----------------------------------------------------------------------------------------------------------------------------------------

MAKE IT SNOW!
Postup je nasledovný: vytvorí sa niekoľko animačných Frames na ktorých sa bude sneh pomaličky posúvať smerom dole. Sneh posúvame pomocou patternu (vlastne posúvame pattern), na každom frame o kúsok viac a viac. Frames sa budú donekonečna opakovať, teda to bude vyzerať ako keby donekonečna snežilo, a stačí nám na to len minimálne množstvo framov (ja som to skúšala so štyrmi a vyzeralo to celkom normálne, ale čím viac frames, tým lepší efekt)

(0. Timeline/Časovú os zobrazíte Window > Timeline/Okno > Časová os)

1. Zduplikujeme si náš prvý frame.
--------------------------

2. Posunieme pattern smerom nadol, šírku sa snažíme zachovať
(jednoducho si otvoríme okno s nastaveniami patternu, myšou prejdeme na design, "chytíme" pattern a posunieme smerom nadol)

3. Toto môžete opakovať donekonečna, čím viac Frames, tým krajšie sneženie. Vždy ale musíte duplikovať posledný vytvorený frame!
--------------------------

4. Keď máte hotové sneženie, stačí upraviť čas framov (ako dlho sa bude prehrávať jednotlivý frame). Čas nastavte od 0,01-0,03 s, to si musíte vyskúšať a pozrieť čo sa vám páči najviac :)
----------------------------------------------------------------------------------------------------------------------------------------

FINAL STEPS
Nakoniec jednoducho zariadime aby sme sneženie nemali v celej výške designu, čo by sa nám nikdy nepodarilo nastaviť, ale len v záhlaví. Opäť je dobré vytvoriť si pomocnú čiaru aby sme vedeli pokiaľ maximálne sneh chceme

1. Preklikneme sa na úplne prvý frame- všetko čo pridáme/uberieme/upravíme na prvom frame sa zmení aj na všetkých ostatných (na to si treba dávať veľký pozor, zvykne sa tam potom dosť vecí dokašlať :D)
---------------------
2. Zduplikujeme si prvu vrstvu -design- a posunieme ju hore nad všetky ostatné vrstvy (ak ešte nemáte, tak vložíte vodiacu čiaru/pravítko).
3. Ugumujeme vrchnú časť designu- po našu vodiacu čiaru- tak, aby spod designu presvital sneh
4. Hotovo! Vaše sneženie je konečne hotové, stačí uložiť (File > Save for Web) a môžete zverejniť ^^
(Môj hotový výsledok si môžete prezrieť TU. Je to "trochu" odfláknuté, ale to preto že som si tento tutoriál zmyslela dnes o pol ôsmej večer :D nechcelo sa mi s tým dlho piplať, ale ubezpečujem vás že týmto postupom sa dajú urobiť OMNOHO lepšie diela ;))
----------------------------------------------------------------------------------------------------------------------------------------
EXTRA TIP!
Áno, posledný tip. Ak chcete mať sneženie 100% plynulé a o to krajšie, pozrite si to, vôbec to nie je náročné :) Len sa v tom dá možno trošku zamotať :D
Postup: Jednoducho všetky framy vyTweenujete. Znie to divne, viem, ale Tween vám v podstate urobí plynulý prechod medzi dvoma frames tak, že medzi dva frames vloží ďalší určený počet frames (v mojom prípade stačia dva, alebo aj jeden). Jediné na čo si musíte dávať pozor, nemôžete tweenovať VŠETKY frames! V podstate každý tretí, lebo medzi 1. a 2. vám vloží ďalšie dva frames, teda 2. sa zrazu stane 4. :)
----------------------------------------------------------------------------------------------------------------------------------------
Dúfam že vám návod aspoň trochu pomohol, a po prečítaní ste aspoň o štipku múdrejší čo sa týka sneženia ;) Pri akýchkoľvek otázkach sa obráťte na môj Ask, rada vám pomôžem pri tvorbe snehu :)
 


Komentáře

1 Ellie►kunis-mila.blog.cz Ellie►kunis-mila.blog.cz | Web | 4. prosince 2013 v 20:53 | Reagovat

Jéé další T&T by Chloé ♥ .. Strašně jsem se těšila na další a doufám, že tu nebude pár ,,inteligentních" jedinců, co budou zase říkat, že je to zbytečné.. Rozhodně jsem nečekala tenhle návod a strašně mě to překvapilo, ale tím lépe.. Rozhodně to hodně lidí využije, protože to na designu vypadá pěkně :) .. Skvělá práce Chloé ;)

2 Lily // M-H Lily // M-H | Web | 4. prosince 2013 v 21:02 | Reagovat

docela složité, ale někdy to zkusím :3

3 Ellie►kunis-mila.blog.cz Ellie►kunis-mila.blog.cz | Web | 4. prosince 2013 v 21:05 | Reagovat

[1]:  věděla jsem, že jsem něco zapoměla napsat :/ :D .. Všechno nejlepší k svátku :)

4 Claire Claire | Web | 4. prosince 2013 v 21:20 | Reagovat

Dokonalý tip :3 inak všetko najlepšie k meninám :* veľa zdravíčka,pohody a šťastia ;)

5 terush terush | Web | 4. prosince 2013 v 21:41 | Reagovat

Myslím, že jsi to skvěle vysvětlila. :) Já jsem dřív ten sníh používala ale jen na designy u kterého nebylo horní menu, protože to pak je mnohem jednodušší.:) Letos jsem si chtěla sice udělat animaci sněhu, ale nakonec jsem zjistila, že se mi to tam nehodí. :D Každopádně dobrý návod.

6 ultimate-adelaidekane ultimate-adelaidekane | Web | 4. prosince 2013 v 22:12 | Reagovat

dosť si pomohla super návod! :)

7 FoXx FoXx | Web | 7. prosince 2013 v 14:32 | Reagovat

moc pěkný návod :) určitě hodně lidem pomůže, já si ještě pamatuju, jak si každý ty animace sněhu před lety vždycky stahoval a pak po blogu běhala vždycky jedna odněkoud z deviantartu :D :D

Nový komentář

Přihlásit se
  Ještě nemáte vlastní web? Můžete si jej zdarma založit na Blog.cz.
 

Aktuální články

Reklama