| |
Pastebėjau, kad reklaminių skydelių apsikeitimo programose dažnai dalyvauja neanimuoti reklaminiai skydeliai. Taip pat 468x60.lt sistemoje apstu tekstinių skydelių pavyzdžių (what's worse..). Kaip žinia, animuoti banner'iai yra žymiai dažniau pastebimi, nei stacionarūs. Taip pat ir mes visi norime, kad užsikrovęs skydelis mūsų svetainėje, iš reklaminių antraščių apsikeitimo programų, būtų išvaizdus ir negadintų svetainės dizaino, kaip benzino lašas meduje. Taigi, ponai ir ponios, pasimokysime šiandien susikuri rastrinį animuotą reklaminį skydelį (*.gif), kiekvieno iš Jūsų svetainei!
Pirmiausiai reikia susigalvoti idėją. Nuspręsti, kas bus rodoma banner'yje, kuo Jūs pritrauksite naujus lankytojus į savo svetainę. Tačiau ir nereikėtų jo perkrauti animacija bei siužetu, nes jo dydis išaugs, jis lėtai krausis svetainėje, arba tiesiog bus nepriimtas į apsikeitimo reklama programą. Daugiau apie reklaminių skydelių kūrimą galite pasiskaityti čia.
Yra sukurta daugybė programų, kurių pagalba galime susikurti animuotą banner'į. Šiandien mes pasimokysime, kaip reikia pagaminti reklaminį skydelį
Adobe® Photoshop® ir Adobe ImageReady programų pagalba.
|
|
|
| |
|
| |
Taigi pradedam.
1.
Įsijungiam
Fotošopą ir susikuriam naują failą: File/New
|
|
|
 |
| |
2. Iššoka lentelė, kurioje mums būtina nurodyti tikslius būsimo dokumento duomenis, t.y. grafinės bylos dydį (pikseliais). Šiuo atveju width=468, height=60. Taip pat rezoliuciją (72 pixels/inch [standartinė internete naudojamų rastrinių grafinių bylų rezol.]) Įsitikiname, kad spalvų gama RGB (Red Green Blue) ir spaudžiame OK.
|
|
|
 |
| |
3. 468x60 reklaminio skydelio pamatai jau sudėti. Susikurkime šiam skydeliui foną (background'ą). T.y. užpildome visą skydelio plotą spalva arba skirtingų spalvų tonais. Aš šiam pavyzdžiui panaudojau nuotraukas, ir sulipdžiau kažką tokio:
|
|
|
 |
| |
4. Kai fonas paruoštas, susikursime sluoksnį (layer), kurį animuosime. Šiuo atveju aš, kaip pavyzdį paėmiau tekstą.
|
|
|
 |
| |
5. Naudodami Type Tool (įrankių skyrelį Tools"), užrašome tekstą pvz.: SPAUSK ČIA!. Pastatome jį į mums priimtiną vietą, nustatome šrifto tipą, spalvą, dydį.
|
|
|
 |
| |
6. Jau puse darbo padaryta. Išsisaugome failiuką *.psd formatu.
Dabar pereisime prie šio mūsų banner'io animacijos. Tam naudosime Adobe ImageReady programinį paketą.
Dar būdami Fotošope spaudžiame File/Edit in ImageReady. Palaukiame kol AK užkraus programą ir atidarys mūsų banner'į.
|
|
|
 |
| |
7. Animation lange spaudžiame mygtuką Duplicates current frame ir susikuriame dar vieną tokį patį kadrą.
(Jei atsidarius Adobe ImageReady neatsidaro Animation lentelė, pagrindiniame meniu viršuje spauskite Window/Animation).
|
|
|
 |
| |
8. Kiekvieno kadro apačioje default'u nustatytas 0 sekundžių kadro rodymo trukmė. Nustatykime pirmą kadrą pvz. 1.0 sekundei, o antrą 0.3 sek.
|
|
|
 |
| |
9. Dabar pažymėję ant antro kadro, žvilgtelkime į sluoksnių (Layer) lentelę. Čia padarykime tekstinį sluoksnį SPAUSK ČIA! nematomą. Štai ir sukūrėme animaciją banner'iui. Peržiūrai spaudžiame Play mygtuką Animation skydelyje. Jei viskas tvarkoj, t.y. animacija mus tenkina, keliaujame toliau.
|
|
|
 |
| |
10. Kuriamo banner'io langelio viršuje yra keturios padalos: Original, Optimized, 2-Up, 4-Up. Pirmame mes matome, mūsų kuriamo skydelio *.psd formatu (+milijonas spalvų) grafinį vaizdą. Antrame (Optimized) matysime, jau optimizuojamo internetui failo *.gif (256 spalvos) vaizdo kokybę. Trečiame ir ketvirtame laukeliuose mes galim matyti ir vieno ir kito vaizdą viename lange, turime galimybę juos lyginti vieną su kitu.
|
|
|
 |
| |
11. Lange Optimize (pagr. meniu Windows/Optimize) nusistatome grafinės bylos parametrus, taip, kad vaizdo kokybė išliktų kaip įmanoma geresnė ir, kad failas užimtų kaip įmanoma mažiau vietos kietame diske.
Dydį kilobaitais galime stebėti mūsų kuriamo banner'io lango Optimized apačioje.
|
|
|
 |
| |
12. Kai failiuką suoptimizuojame, belieka jį tiktai išsaugoti.
Spaudžiame File/Save Optimized As..., įvedame failo pavadinimą, nurodome katalogą į kurį reikia išsaugoti šią grafinę bylą, išsaugojimo tipą pasirenkame Images Only (*.gif) ir spaudžiame Save.
|
|
|
 |
| |
Štai ir sukūrėme animuotą reklaminį skydelį.
Rezultatas:
|
|
|
 |
| |
| |
| |
Sėkmės darbuojantis! |
