kreiranje animacija upotrebom adobe flash-a creating ... - Infoteh

Flash omogućava izradu kompleksnih interaktivnihanimacija, te njihovo postavljanje na Internet stranice. Sapojavom novijih rješenja u Flashu, moguće je napravitiinteraktivne trodimenzionalne virtualne likove koji se svojimgovorom, pokretima i gestama obraćaju posjetiocimastranica, pozdravljaju ih, prezentuju im sadržaj te ih navodena pretraživanje. Takvi likovi daju stranicama posebnost, ainterakciji s korisnikom dodaju dozu prirodnosti i zabave.Zbog svoje rijetkosti imaju mogućnost privući pažnjuposjetioca (što je inače teško postići standardnim metodama,poput bannera ili tekstualnih oglasa), te ih na taj naći navestida posjete neku stranicu, informiraju se o proizvodu iliprovesti bilo koji drugi oblik marketinške aktivnosti. Takođe,takav lik moguće je koristiti i unutar prezentacija na raznimseminarima, konferencijama i sajmovima, što svakakodoprinosi opštem dojmu prezentacije i interesu zahtjevnepublike.Flash pruža sve što je potrebno korisniku za kreiranje idistribuciju bogatih web sadržaja i snažnih aplikacija. Flashje poznat kao program za kreiranje animacija već duževrijeme. Kada žele da postave interaktivnu animaciju na websajt, mnogi web dizajneri i projektanti koriste Flash. Najčešćese koristi za web animacije jer dopušta stvaranje visokokvalitetnih animacija s malim veličinama datoteka, koje suidealne za online sadržaj. Flash je vektorski baziran programdizajniran za stvaranje i prikaz malih datoteka na web-u, i topostiže ograničavanjem tipova slika i medija koji mogu bitiprikazani.Zadnjih godina Flash se koristi čak i za kreiranjeanimacija u komercijalne svrhe televizijiskih prikazivanja.Razlog zbog kojeg je flash toliko proširen je da je odličan alatza kreiranje i animaciju vektor grafike, takođe pruža svepotrebno za kreiranje i dostavu bogatog web sadržaja imoćnih aplikacija kao npr. online trgovine. Prilikom kreiranjapokretne grafike ili stvaranja aplikacija sa podatcima Flashnudi alate potrebne za dobivanje izvrsnih rezultata i dostavukorisniku najboljim načinom na brojne platforme i uređaje.Flash aplikacije se obogaćuju dodavanjem slika, zvukovai videa. Flash sadrži mnoge alate koji ga čine moćnim ijedostavnim za upotrebu i specijalne efekte koji se dodajuobjektima.Prilikom rada u Flash-u radi se u Flash dokumentu kojiprilikom spremanja dobija ekstenziju .fla. Kad je dokumentspreman za prikazivanje Flash sadržaja, eksportuje se, stvarase dokument sa ekstenzijom .swf. Flash eksportuje SWFdokument i stvara HTML dokument sa potrebnim tagovimaza prikazivanje SWF dokumenta.Moguće je korištenje komponenti kreiranih odMacromedie, kreiranje vlastitih komponenti ili učitavanjekomponenti kreiranih od drugih aplikacija. Četiri su tipamedija koje moguće učitati u Flash aplikacije prilikomizvođenja: SWF, MP3, JPEG i FLV datoteke.3. KADA KORISTITI FlashFlash omogucuje dizajnerima i projektantima da integrišuweb bazirani video, tekst, zvuk i grafiku u bogato iskustvokoje daje superiorne rezultate za integraciju web marketinga iprezentacije, web baziranog e-learning i web aplikacijiskihkorisničkih interfejsa. Instaliran na 98% pretraživača, Flash jejedan od najraširenijjih svjetskih platformi.Flash koristimo kada želimo:• brzo napraviti efektivne podacima upravljaneaplikacije u robusnom razvojnom okruženjuFlash-a• koristimo profesionalne video sposobnosti radidostave visoko kvalitetnog videa sajedinstvenom interaktivnosti i prilagođenimizgledu ciljanom za najširu publiku• razvijati aplikacije za mobilne telefone, PDA idruge uređaje bez učenja specijalizovanihveština za svaku platformu• prikazivati konstantno na 98% pretraživača4. Action ScriptActionScript je skriptni jezik za Flash koji omogućavadodavanje kompleksnih interakcija, kontrolu playback-a.Moguće je dodati ActionScript unutar Flash radnog okruženjakoristeći Actions panel ili kreiranjem vanjskih ActionScriptdokumenata koristeći vanjski editor. Nije potrebo potpunorazumijevanje svakog ActionScript elementa za početakprogramiranja. ActionScript nije težak za savladati. Dovoljnoje početi pomoću jednostavnijih elemenata i stvaratikompleksnije sadržaje u hodu.5. Macromedia Flash PlayerKao standardni bogati klijent za internet sadržaj iaplikacije, Flash Player osigurava da je sav Flash sadržajvidljiv i dostupan konstantno i kroz širok pojas platformi,pretraživača, i uređaja. Flash Player je i dalje distribuiran sasvakim većim partnerom, uključujući Microsoft, Apple,Netscape, AOL i Opera. Donosi bogati sadržaj i aplikacije zapreko 516 miliona ljudi u svijetu.Sve prisutan medija playback:• 98% trnutnih pretraživača• udružen sa vodećim pretraživačima ioperativnim sistemima (Microsoft Windows,Apple Mac OS X, Microsoft Internet Explorer,Netscape 7)• playback uređaja (set-tops, handhelds, PocketPS)Pozitivno korisničko iskustvo (UXP - Positive UserExpirience):6. Flash OKRUŽENJE• brzo učitavanje• player lake kategorije• konstantni playback uzduž platformi iuređajaWeb standardi:⎯ otvoreni formati datotekaFlash okruženje sastoji se scene (engl. Stage) na koju sestavlja medijiski sadržaj, glavnog skupa alata (engl. maintoolbar) s opcijama i komandama za kontrolisanjefunkcionalnosti aplikacija, panelima i Property inspektorom938

za organizovanje i mijenjanje komponenata medija, i skupaalata s alatima za kreiranje i mijenjanje sadržaja vektorskegrafike.računara, slojevi sami ne povećavaju veličinu .swfdokumenta. Slojeve je moguće skriti, zaključati i presložiti,moguće ih je organizovati i smjestiti u poseban dokumentslojeva. Poželjno je razdvajanje slojeva po tipu sadržaja npr.posebno zvuk, akcije, komentari okvira, radi lakšeg pristupa ieditovanja sadržaja.Glavni skup alata (engl. Main Toolbar) na vrhu okruženjasadrži opcije sa komandama za kontrolisanje Flashprograma. Opcije su: File, Edit, View, Insert, Modify, Text,Commands, Control, Window i Help.Slika 1. Izgled Flash okruženjaScena (eng. Stage) je područje kvadratnog oblika u kojese stavlja grafički sadržaj, uključujući vektorski crtež,tekstualne prozore, dugmad, importiranu bitmap grafiku ilivideo klipove itd. Takođe pretstavlja i mjesto u kojem jeFlash dokument prikazan tokom playback-a u Flashokruženju. Moguće je zumiranje na scenu tokom radakorisnika radi mijenjanja pogleda na sadržaj.Linija vrmena (engl. Timeline) organizuje i kontrolišesadržaj dokumenta kroz vrijeme u slojevima (engl. Layers) iokvirima (engl. Frames). Kao u filmovima, Flash dokumentidijele vremensku dužinu u okvire. Slojevi su kaomnogostruki filmski stripovi složeni jedan na drugome, svakisadržava različit sadržaj koji se pojavljuje na sceni. Glavnekonponente linije vremena su slojevi, okviri i glava, koja semiče zajedno s vremenom pokazujući na trenutni okvirprikazan na sceni. Status linije vremena prikazuje brojselektiranog okvira, izvođenja, i proteklo vrijeme dotrenutnog okvira.Ključni okvir (engl. Keyframe) je okvir u kome sedefinišu promjene u animaciji ili uključuju akcije okvira kojemijenjaju dokument. Flash ima mogućnost popunjavanjaokvira između ključnih okvira za generisanje glatkihanimacija. Kako ključni okviri omogućuju proizvodnjuanimacija bez crtanja svakog okvira, čine kreiranje animacijapuno jednostavnijim. Moguće je promijeniti dužinupopunjene animacije mijenjajući poziciju ključnog okvira poliniji vremena. Red po kojem su okviri i ključni okviri složeniu liniji vremena je red po kojem su i prikazane u Flashaplikaciji.Slojevi (engl. Layer) su kao prozirne folije složene jednana drugu, te pomažu pri organizaciji crteža u dokumentu.Moguće je crtati i mijenjati objekte na jednom sloju bezikakvog uticaja na ostale objekte na drugim slojevima. Akonema nikakvog sadržaja na sloju, vidi se kroz njega slojispod. Pri kreiranju novog Flash dokumenta postoji samojedan sloj, dodavanje novih korisnik radi po želji zbogorganizacije crteža, animacija i ostalih elemenata udokumentu. Broj slojeva ograničen je samo memorijomAlati u opciji toolbar omogućuju crtanje, slikanje,selektovanje, mijenjanje crteža, kao i pogleda na sadržajscene zumiranjem. Alati su podijeljeni u četiri dijela:⎯ Područje sa alatima za crtanje, slikanjei selektovanje⎯ Područje sa alatima za zumiranjeaplikacijiskog prostora⎯ Područje za boje sa alatima zamijenjanje stilova punjenja i crtanja⎯ Područje za opcije sa alatima zamijenjanje opcija selektovanog alataFlash sadrži lenijare i vodiče za crtanje i polaganjeobjekata precizno na željeno mjesto.Panel sa bibliotekom (eng.Library panel) je panel u kojise spremaju i organizuju simboli kreirani u Flash-u, takođe iimportovani dokumenti, uključujući bitmap grafiku,zvukovne dokumente i video klipove. Library panelomogućuje organizaciju sadržaja biblioteke u datoteke,pregled koliko se često koji objekat koristi u dokumentu, isortiranje objkta po tipu.Panel s akcijama (engl. Action panel) omogućavakreiranje i editovanje akcija za objekt ili okvir. Selektujućiokvir, dugme ili instancu filmskog klipa, panel s akcijamapostaje aktivan. Naslov panela s akcijama mijenja se zavisnood toga šta je trenutno selektovano u akcije dugmad (engl.Button Actions), akcije filmskog klipa (engl. Movie ClipActions), ili akcije okvira (engl. Frame Actions).Paneli u Flash-u pomažu pri pregledu, organizaciji imijenjanju elemenata u dokumentu. Opcije raspoložive upanelima kontrolišu karakteristike simbola, instanci, bojatipova, okvira i ostalih elemenata. Paneli se koriste i zaorganizaciju Flash izgleda, prikazujući potrebne panele zaodređeni zadatak sakrivajući ostale. Paneli omogućavaju radsa objektima, bojama, tekstom, instancma, okvirima, scenamai cijelim dokumentima.Flash posjeduje i mogućnosti bržeg pozivanja pomoćutastature (engl. Keyboard shortcuts) koja je već dizajnirana zaFlash aplikaciju, ali korisnik ju može promijeniti i prilagoditisvojim potrebama. Takeđe može izabrati kraće puteve koji sekoriste u nekim drugim alatima poput Fireworks-a, AdobeIllustrator-a i Adobe Photoshop-a i ugraditi ih u flash.7. RAD U Flash-u939

Implementacija praktičnog rada, gdje će biti prikazanialati i koraci koji su uključeni u izradu jednostavne animacijepomoću opcije tweening.Slika 4. Kreiranje prvog okviraSlika 2. Izgleg radnog okruženjaNakon što pokrenete Flash vidjet ćete praznu pozornicu isetove alata, kao na slici 2.Sa lijeve strane pozornice nalazi se meni sa alatima kojidaje brz pristup do primarnih funkcija. Iz menija sa alatimakliknite na alat Oval. Možete koristiti ovaj alat za crtanje bilokog kružnog oblika. Ispod se nalaze alati za bojenje, alat zaboju konture i alat za ispunu bojom. Za boju konture izaberitecrnu boju, a za ispunu tamno plavu, a zatim nacrtati mali krugu gornjem lijevom uglu na pozornici, kao na slici 4.Slika 3. Izgled prozora Document PropertiesPozornica je postavljena na zadanu veličinu. Klikom nadugme Properties otvorit će se novi prozor koji sadržipodešavnja dokumenta. Postaviti će te podešavnja kao naslici 3. Unijet će te veličinu pozornice 320 x 240 pixela, zaboju pozadine izabrati svijetlo plavu i broj frejmova usekundi 12, što je sasvim dovoljno za Flash animaciju zaweb, obezbjeđuje konzistentan tok kretanja, ali izbjegavapodizanje veličine datoteke dodavanjem dodatnih okvira.Slika 5. Konvertovanje objkta u simbolPrije nego što krenete dalje, morate napraviti nekepromjene na vašem krugu. Budući da Flash ne možegenerisati okvire između običnog oblika, pa morate objektepretvoriti u simbole. Kliknete desnim klikoma na krug i izpadajućeg menija izaberete opciju Convert to Symbol, pojavitće se prozor u kome ćete unijeti ime simbola i čekirati opcijuGraphic, kao na slici 5, i zatim kliknite na dugme OK, vidjetćete promjene na vašem objektu. Ovaj simbol će se sadapojaviti u biblioteci, koje možete pregledati pritiskom na F11tipku ili klikom na Window -> Library. Simboli ili predmetinavedeni u biblioteci se mogu ponovno koristiti u bilo kojemtrenutku,jednostavnim prevlačenjem na pozornicu.U sledećem koraku animirat će te jos jedan ključni okvir,nakon čega možete reći Flash-u da animira između njih. Napočetku ste postavili broj frejmova na 12 sličica u sekundi, toznači da će se u toku jedne sekunde izmjeniti 12 okvira. Da bivaš krug za jednu sekundu presao u drugi kraj pozornice,kliknite na vremenskoj liniji desnim tasterom na 12 okvir, ina padajućem meniju izaberite opciju Insert Keyframe, kaona slici 6. ova opcija automatski kopira sve iz prethodnogključnog okvira u novi ključni okvir, (uključujući i vaš krug).940

Slika 8. Popunjavanje okviraSlika 6. Kreiranje drugog ključnog okviraNakon što kliknete Insert Keyframe, možete vidjeti da jesada 12. okvir zasivljena i označena tačka, baš kao i prvi, arazmak između njih je također u sivoj boji, sa 11 okvira uznaku mali bijeli kvadrat.U sljedećem koraku ćete premjestiti krug u suprotni ugaopozornice. Izaberte alat Arrow, kliknite na krug i prevucite gau donji desni ugao pozornice, kao na slici 7.Sada ste uspješno završili svoju animaciju, da bi jepogledali samo pritisnite Enter taster, ili odaberite File ->Preview in Browser, trebali bi vidjeti svoj krug kako se krećeglatko od tačke A do tačke B, bez skokova između.8. ZAKLJUČAKFlash dizajnerima internet stranica pruža noveprezentacijske mogućnosti i dopunjava vizuelno cjelokupnidizajn, dodajući ''živost'' i ''ljudskost''. Kao takvi atraktivnisu širokom broju korisnika. Zbog najveće raširenosti Flashplatforme ona se nameće kao jedini pravi izbor za prikazinteraktivni likova na webu i razvoj web aplikacija kojekoriste interaktivni prikaz. Dodatno tu poziciju učvršćujejednostavnost izrade Flash aplikacija i velika zajednicarazvojnih korisnika.9. LITERATURA[1] Russell Chun “Macromedia Flash” Beograd, 2003[2] www.wikipedia.org[3] www.adobe.comSlika 7. Izgled okvira 12U sljedećem koraku će Flash generisati okvire između dvaključna okvira, i napraviti glatku animaciju koja prikazujeobjekat kako se kreće od jednog mjesta ka drugom.Kliknite mišom na prvi okvir na vremenskoj liniji iprevucite do dvanaestog okvira tako da ih odaberete, zatimdesnim tasterom miša na okvire i iz padajućeg menijaodaberite opciju Create Motion Tweening, kao na slici 8,pojavit će se strelica koja se proteže od prvog do zadnjegokvira na vremenskoj liniji.941