Ovaj članak će vam pokazati kako koristiti jednostavnim koracima početi upoznavati Adobe Flash CS5. Tema lekcije je jednostavna animacija, kreirat ćemo je bez upuštanja u složenost sučelja i programa.

Kreiranje novog flash dokumenta

Otvorite program i kreirajte novi dokument"ActionScript 3.0".

Nacrtajmo objekt za naknadnu animaciju

Sada nacrtajmo krug. Odaberite ovalni alat na desnom panelu i držite lijevo dugme miša i dugmeta "shift" na tastaturi, nacrtajte krug na bijeloj pozadini.

Koristeći alat za odabir, odaberite novokreirani objekt tako što ćete kliknuti na njega mišem ili ga prevući u kvadratni odabir.

Pretvaranje objekta u simbol za jednostavnu animaciju

Za dalji rad, potrebno je da objekt pretvorite u simbol. Pošto je krug već odabran, pritisnite desnu tipku miša i uđite kontekstni meni odaberite "Pretvori u simbol".

Sa liste "Vrsta" odaberite "Grafički"

Sada bi se oko našeg objekta trebao pojaviti plavi kvadrat.

Napravite klasičnu animaciju (Classic Tween)

Da biste kreirali animaciju, morate odrediti "ključni okvir".

Na donjem panelu se nalazi skala animacije, odaberite dvadeset peti kadar i pritisnite desnu tipku miša, u kontekstnom izborniku koji se pojavi odaberite "Insert Keyframe".

Odaberite krug i, držeći lijevu tipku miša, pomaknite ga udesno.

Odaberite prvi kadar na skali animacije i u glavnom meniju na vrhu, u stavci "Insert", odaberite "Classic Tween".

Pogledajte kreiranu animaciju

Sada možemo gledati animaciju. U glavnom meniju, u stavci "Kontrola", izaberite "Play".

Dodajmo krugu efekat "nestajanja". Da biste to učinili, ponovo odaberite objekt i u desnom panelu u meniju "efekat boje" odaberite "alfa", postavite vrijednost na "0".

Da vidimo šta se desilo. Idite na stavku "Kontrola" odaberite "Reproduciraj".

Da li ste se ikada zapitali šta se krije iza prelepe animacije banera na internetu? Ili za novonastale crtane filmove kreirane s kompjuterska tehnologija? Najčešće se baziraju na "mesu", tačnije, tako se sa engleskog prevodi naziv Flash tehnologije. Danas ćemo pričati o flash animaciji za stranicu:

Flash tehnologija

Multimedijalni okvir je razvio Macromedia. Ali nakon njenog preuzimanja (spajanja), sva prava na tehnologiju su preneta na novog vlasnika - Adobe Systems.

Opseg savremene primene Adobe Flash-a:

• Kreiranje web aplikacija je prilično nov smjer. To podrazumijeva potpunu ili djelomičnu upotrebu Flash-a za kreiranje web stranica. Uz djelomičnu primjenu, ova tehnologija stvara pojedinačni elementi dizajn: razni interaktivni meniji, animirana dugmad, itd.

U poređenju sa konvencionalnim resursima, html baziran flash stranice imaju neke funkcije koje ograničavaju njihovu upotrebu. To uključuje visoke troškove razvoja, zahtjevne serverske resurse, dugo vrijeme učitavanja uz sporu internetsku vezu i neke druge aspekte:

• Implementacija multimedijalnih mogućnosti - za slušanje zvuka i reprodukciju videa na stranicama često se koriste media playeri bazirani na Flash-u. Njihov razvoj uključuje upotrebu jednog od skriptnih jezika (češće JavaScript):

• U internet oglašavanju - najčešće se koristi tehnologija za kreiranje animiranih banera. Oni ne podrazumijevaju samo reprodukciju multimedijalnog oglašavanja, već i neku vrstu interakcije s korisnikom na bazi igre.

Osnove i alati za razvoj Flasha

Za kreiranje flash animacije najčešće se koriste tradicionalni Adobe alati:

• Adobe Flash Professional - program za kreiranje interaktivne animacije (animator);
• Adobe Flash Builder - okruženje za kreiranje interfejsa za web aplikacije;
• Adobe Flash Player je plejer integrisan u pretraživač za igranje Flasha.

Pored toga, niz aplikacije trećih strana. Najpopularniji od njih su Gnash, QuickTime i neki drugi:

Ova tehnologija vam omogućava da prikažete bilo koju vrstu grafike ( raster, vektor, 3D). I također podržava prijenos audio i video podataka. Posebno za mobilnih uređaja razvijena je lagana težina flash verzija Lite.

Glavni standard za flash datoteke je ekstenzija SWF. Akronim je skraćenica od Small Web Format. Video snimljen u Flash-u ima ekstenzije fajla FLV, F4V.

Razvoj interaktivne animacije u Flashu se zasniva na Vektorska grafika. Zahvaljujući tome, bilo je moguće implementirati podršku za multimedijalnu platformu i nezavisnost kvaliteta animacije od rezolucije ekrana.

Veličina datoteke Flash aplikacije je ista za sve korisnike, bez obzira na to specifikacije rezolucija ekrana).

Interaktivna animacija u Flash-u je bazirana na morfiranju (vektorski tip), koji se polako stapa između ključnih kadrova. Za reprodukciju podataka koristi se flash player, čiji je rad u mnogo čemu sličan radu virtuelna mašina JavaScript. Softverska komponenta tehnologije implementirana je korištenjem ActionScript jezika.

Nedostaci tehnologije uključuju sljedeće točke:

• teško opterećenje CPU klijent mašina. Ovo je zbog niske efikasnosti flash virtuelne mašine, koja je ugrađena sa plejerom u pretraživač korisnika;
• Velika vjerovatnoća greške – Reprodukcija Flash animacije može biti vrlo sklona greškama. Štaviše, kvarovi u Flash reprodukciji negativno utiču na rad cele klijentske aplikacije (pretraživača). To je zbog nedovoljne kontrole tolerancije na greške programskog koda prilikom kreiranja flash aplikacija;
• Nije moguće indeksirati - Sav tekstualni sadržaj prikazan u Flash sadržaju nije indeksiran. Ovo ograničenje je posebno problematično za one resurse koji su bazirani na ovoj tehnologiji.

Pregled softvera za kreiranje Flash-a treće strane

Sothink SWF Quicker je uzet kao prototip aplikacije na kojoj ćemo demonstrirati osnove kreiranja Flash-a. Prema mišljenju mnogih stručnjaka, program je najrazumljiviji i najlakši za učenje.

Osim kreiranja i uređivanja, flash editor "zna kako" raditi sa svim drugim vrstama web animacija (GIF, HTML i drugi standardi):

Nakon instalacije prelazimo na korisničko sučelje programa. Nažalost, nakon lutanja kroz sve kutke i rupe preklopnika jezika interfejsa, nismo ga pronašli.

Da bismo razumjeli kako napraviti flash animaciju u ovoj aplikaciji, koristit ćemo ugrađene šablone. Dijaloški okvir New From Template pojavljuje se odmah nakon pokretanja programa. Osim toga, može se pozvati preko stavke glavnog menija "Datoteka". Među predloženim opcijama odabrali smo izradu banera:

U sljedećem prozoru čarobnjaka potrebno je sa padajuće liste odabrati predložak prema kojem će se kreirati animacija. Ispod je mali okvir u kojem se reproducira odabrani šablon:

U sljedećim koracima potrebno je podesiti veličinu banera i unijeti 5 fraza teksta koje će se reproducirati u animaciji. Osim toga, morate navesti adresu resursa na koji će korisnik biti odveden klikom na baner:

Nakon kompajliranja projekta i zatvaranja prozora čarobnjaka, možete pogledati rezultirajući video u ugrađenom playeru. Da biste to učinili, kliknite na zelenu strelicu na vrhu:

Nakon što zatvorite plejer, pogledajmo bliže interfejs aplikacije. Imajte na umu da se sastoji od dva glavna prozora: gornji je za uređivanje vremenskog intervala videa, a donji je običan grafički uređivač. Svaki od elemenata nalazi se na posebnom sloju koji je dostupan za uređivanje pomoću standardni alati nalazi se na bočnoj traci.

Flash animacije vidimo stalno, na internetu i na TV-u. Stvaranje jednostavne flash animacije koristeći Flash tehnologiju je prilično jednostavan zadatak, pošto Flash nudi mnogo korisni alati koji olakšavaju čitav proces. Ako želite da napravite flash animaciju ili crtani film, možete ga skicirati za samo nekoliko sati.

Koraci

Dio 1

Frame-by-frame flash animacija

Osnove animacije okvir po kadar. Ova metoda se smatra glavnom metodom za stvaranje "tradicionalne" animacije, u kojoj svaki sljedeći okvir uključuje jednu, ali malo izmijenjenu sliku. Prilikom reprodukcije svih kadrova slika "oživljava". Ovu istu metodu koriste crtani animatori slobodnom rukom i oduzima više vremena od bratimljenja (pogledajte sljedeći odjeljak).

• Podrazumevano, Flash renderuje pri 24 sličica u sekundi (FPS). To znači da će se u jednoj sekundi prikazati 24 okvira, ali ne moraju svi biti različiti. Ovu postavku možete promijeniti (ako želite) na 12fps, ali pri 24fps animacija će se reproducirati "glatko".

1. Instalirajte Flash Pro. Postoji mnogo programa za kreiranje flash animacije, ali najmoćniji je Adobe Flash Professional CC. Možete instalirati besplatno probna verzija ovaj program ili koristite drugi proizvod (ako ne želite da se registrujete za Adobe Creative Cloud). Ostatak ovog članka opisuje kako raditi sa Flash Professional-om.

   Budući da animacija okvir po kadar zahtijeva nekoliko slika (koje se malo razlikuju jedna od druge), ove slike morate kreirati ručno. Da biste to učinili, koristite Adobe Flash Professional ili nacrtajte slike u bilo kojem grafičkom uređivaču.

   • Ako želite da se vaše slike lako mijenjaju bez gubitka kvalitete, kreirajte slike u vektorskoj umjesto rasterske grafike. Vektorske slikeće se ponovo nacrtati kada im se promijeni veličina (tj. izbjeći ćete pikselizaciju ili anti-aliasing). Bitmape su tradicionalne slike, kao što su fotografije, slikane slike itd. Ako pokušate da uvećate takve slike, dobićete veoma izobličenu sliku.

2. Kreirajte prvi okvir. Kada prvi put pokrenete Adobe Flash Professional, vidjet ćete prazno platno (sloj) i praznu vremensku liniju. Kako se okviri dodaju, vremenska linija će se automatski popunjavati. Možete raditi sa slojevima baš kao u Photoshopu.

   • Prije dodavanja slike, kreirajte osnovnu pozadinu za svoju animaciju. Preimenujte "Layer 1" u "Background" i zatim ga isjecite. Napravite drugi sloj i nazovite ga kako god želite. Ovo će biti sloj na kojem ćete kreirati animaciju.
   • Dodajte crtež na platno prvog kadra. Možete uvesti crtež sa svog računara ili možete koristiti alate za crtanje da kreirate crtež direktno u programu.
   • Prvi okvir je "ključni" okvir. Ključni okvir je okvir koji uključuje sliku i čini osnovu ("kičmu") animacije. Svaki put kada promijenite sliku, kreirat ćete novi ključni kadar.
   • Ključni kadrovi na vremenskoj liniji su označeni crnom tačkom.
   • Ne treba vam ključni kadar u svakom sljedećem kadru. Napravite ključni kadar svakih četiri ili pet kadrova kako biste napravili dobru animaciju.

3. Pretvorite sliku u simbol. U tom slučaju, moći ćete nekoliko puta dodati sliku u okvir. Ovo je posebno korisno ako trebate brzo dodati nekoliko slika iste vrste u jedan okvir (na primjer, riba u akvariju).

   • Odaberite crtež. Desnom tipkom miša kliknite na crtež i odaberite Pretvori u simbol. Slika će biti dodata u biblioteku, što će olakšati njeno korištenje u budućnosti.
   • Izbrišite crtež. Ne brinite - možete ga dodati u okvir jednostavnim prevlačenjem i ispuštanjem iz biblioteke. Na ovaj način možete dodati istu sliku u okvir nekoliko puta.

4. Dodajte prazne okvire. Kada je vaš prvi ključni kadar dovršen, umetnite prazne okvire, a zatim počnite kreirati svoj drugi ključni kadar. Pritisnite F5 (četiri ili pet puta) da dodate prazne okvire nakon prvog ključnog kadra.

   Kreirajte drugi ključni kadar (nakon što ste dodali neke prazne okvire). Postoje dva razne načine da biste to učinili: možete kopirati postojeći ključni kadar i napraviti male promjene u njemu, ili možete kreirati prazan ključni kadar i dodati mu novu sliku. Ako koristite crtež kreiran u drugom programu, koristite drugi metod. Ako ubacujete sliku kreiranu pomoću Adobe Flash Professional alata za crtanje, koristite prvi metod.

   • Da biste kreirali ključni kadar koristeći sadržaj prethodnog ključnog kadra, pritisnite F6. Da kreirate prazan ključni kadar, kliknite desnim tasterom miša na poslednji okvir na vremenskoj liniji i izaberite Umetni prazan ključni kadar.
   • Nakon što kreirate drugi ključni kadar, potrebno je promijeniti njegovu sliku kako bi animacija oživjela. Ako ste koristili Adobe Flash Professional alate za crtanje, odaberite alat Transform da biste odabrali element na crtežu (kao što je ruka lika) i izmijenili ga.
   • Ako umetnete novu sliku u svaki ključni kadar, uvjerite se da je na pravom mjestu (prema logičnom nizu okvira).

5. Ponovite postupak. Nakon kreiranja dva ključna kadra, ponovite postupak - dodajte nekoliko praznih kadrova između svakog ključnog kadra i uvjerite se da se animacija reproducira "glatko".

   • Napravite male promjene. Što su manje (manje) promjene, to je animacija glatkija. Na primjer, ako želite da lik podigne ruku, drugi ključni kadar ne bi trebao uključivati ​​crtež koji prikazuje lik s već podignutom rukom. Umjesto toga, koristite nekoliko ključnih kadrova za prijelaz sa spuštene ruke na podignutu ruku. U ovom slučaju, animacija će biti glatkija.

6. Pretvorite crtež. Nakon što kreirate ključne kadrove i putanju, možete transformirati sliku tako da se glatko mijenja dok se krećete duž putanje blizanca. Možete promijeniti oblik, boju, nagib, veličinu i bilo koji drugi aspekt slike.

   • Odaberite okvir u koji će se crtež transformirati.
   • Otvorite panel svojstava crteža. Da biste to učinili, pritisnite F3.
   • Promijenite vrijednosti parametara u prozoru svojstava crteža. Na primjer, možete promijeniti nijansu ili boju, dodati filtere, promijeniti veličinu.
   • Također možete koristiti alat Free Transform da promijenite crtež kako god želite.

7. Dodajte završne detalje. Provjerite kreiranu animaciju pritiskom na Ctrl + Enter. Uvjerite se da se crtež (lik) ispravno mijenja i da se animacija reproducira pravilnom brzinom. Ako se animacija reproducira prebrzo, smanjite FPS vrijednost ili povećajte trajanje tween-a.

   • Podrazumevani broj FPS-a je 24, pa pokušajte ovo smanjiti na 12. Promijenite vrijednost FPS-a na panelu sa svojstvima. Međutim, pri FPS = 12, animacija se možda neće igrati dovoljno glatko.
   • Da biste promijenili trajanje tween-a, odaberite sloj koji sadrži tween i koristite klizač da promijenite trajanje tween-a. Ako želite udvostručiti dužinu tween-a, pomaknite klizač na 48 kadrova. Ne zaboravite zalijepiti pozadinu na prazne okvire kako pozadina ne bi nestala usred animacije. Da biste to učinili, odaberite pozadinski sloj, kliknite na posljednji okvir animacije (na vremenskoj liniji), a zatim pritisnite F5.

dio 3

Dodavanje zvučnih efekata i muzike

1. Snimite ili preuzmite zvučni efekti i muziku. Možete dodati zvučne efekte svojoj animaciji kako biste je učinili efektnijom. Muzika će učiniti animaciju uzbudljivijom i može pretvoriti dobru animaciju u odličnu. Flash podržava različite formate audio datoteka, uključujući AAC, MP3, WAV i AU. Odaberite format koji garantuje visok kvalitet zvuka uz najmanju veličinu datoteke.

   • MP3 format garantuje visok kvalitet zvuka uz minimalnu veličinu datoteke. WAV fajlovi su veliki.

2. Uvezite audio datoteke u biblioteku da biste mogli brzo dodati zvukove i muziku animacijama. Kliknite "Datoteka" - "Uvezi" - "Uvezi u biblioteku". Pronađite audio datoteku na svom računaru. Uvjerite se da audio datoteka ima ime koje se lako pamti kako biste ga mogli brzo pronaći.

   Kreirajte novi sloj za svaki audio fajl. Ovo nije neophodno i možete dodati audio u postojeće slojeve, ali lijepljenje audio datoteke na poseban sloj će vam dati veću kontrolu audio zapis animacije.

   Kreirajte ključni kadar iz kojeg će se početi reproducirati zvuk. Na sloju zvuka odaberite okvir animacije iz kojeg će se zvuk početi reproducirati. Pritisnite F7 da umetnete prazan ključni kadar. Na primjer, ako želite da umetnete audio datoteku koja se reproducira kroz animaciju, odaberite prvi kadar na sloju audio datoteke. Ako dodajete glas lika, odaberite okvir u kojem lik počinje da govori.

Na ovom web stranica Vašoj pažnji je predstavljen program za kreiranje i uređivanje flash animacije. Uz njihovu pomoć možete svoje ideje pretvoriti u animirane video zapise za svoju web stranicu.

Flash editor je program za kreiranje flash animacija i uređivanje gotovih flash video zapisa.

FLA format je originalni dokument vašeg klipa. Nakon što ga otvorite, ulazite u program Macromedia Flash i možete dalje uređivati ​​snimak.

SWF format- ovo je izvršna Flash datoteka, kada "kliknete" mišem na nju, imate priliku da pogledate klip pomoću programa Macromedia Flash Player.

Animacija sa Adobe Flash Professional

Adobe Flash Professional CS3- prednosti i funkcionalnost ovog programa mogu se opisivati ​​jako dugo. Ovaj program je neprikosnoveni lider u okruženju flash tehnologije. Adobe Flash Professional koriste i profesionalni programeri web stranica i flash dizajneri.

Uz pomoć ovog programa, čak i najbolesnija fantazija se može realizovati u blic. Općenito, ako odlučite kreirati profesionalne animirane flash datoteke, onda je Adobe Flash Professional upravo program bez kojeg ne možete.

Jačina zavisi od verzije od 500 Mb.

Na ovog trenutka Adobe Flash Professional CS5 nova verzija softver za animaciju i multimediju.

OS: Windows XP/Vista/7

Snimak ekrana programa:

preuzmite Adobe Flash Professional CS3

Možda za web majstora početnika, kreiranje flash animacije koristeći Adobe softver Flash Professional će izgledati pomalo komplikovano i nedostižno.

U tom slučaju nemojte očajavati i napustite ono što ste započeli. Isprobajte svoje flash ideje sa Swishmaxom.

Swishmax - flash editor

SwishMAX je alternativni program s prijateljskim i jednostavnim sučeljem za kreiranje flash animacije, koji je manje funkcionalan od prethodnog, ali u isto vrijeme vam omogućava da dobijete kvalitetan rezultat. Glavna prednost donjeg flash editora je njegova jednostavnost korištenja. Čak i korisnik početnik, koji ima pri ruci video lekcije, moći će s njim kreirati profesionalne flash video zapise za kratko vrijeme.

Volumen: 9,27 MB.

Jezik interfejsa je ruski.

Operativni sistem: Windows 98/Me/NT/2000/XP

Snimak ekrana programa:

preuzmi swishmax

Aligator Flash Designer

Sljedeći flash program je još jednostavniji, kako u pogledu funkcionalnosti, tako iu pogledu sadržaja interfejsa. Mogućnosti ovog flash uređivača omogućavaju vam da lako kreirate flash banner za stranicu za nekoliko minuta.

Postoji preko 130 efekata: fade, zoom, rotate. Animirani crteži, oblici ili tekst, pa čak i zvuk se neprimjetno dodaju vašoj Flash animaciji.

Ovdje također možete odrediti OnClick ili OnOver.

Volumen: 5,3 MB.

Jezik interfejsa je ruski.

OS: Windows XP/Vista/7

Snimak ekrana programa:

preuzmite Alligator_Flash_Designer_7.0

Još jedan program koji nije uređivač flash animacije, ali su njegove mogućnosti neophodne za web dizajnera početnika.

Flash Decompiler Trillix

Flash Decompiler Trillix - glavna svrha ovog programa je izvoz SWF datoteka nazad u FLA format jednim klikom miša. Dohvaća sve Flash objekte iz SWF fajl i sprema ih u FLA datoteku, koja se kasnije može uređivati ​​u Flashu.

Prednost Flash Decompiler-a je uređivanje zvukova, slika, boja, gradijenata, linija, dinamičkog teksta i linkova bez pretvaranja u FLA.

Volumen: 7,27 MB.

Jezik interfejsa je ruski.

OS: Windows XP/Vista/7

Snimak ekrana programa:

Preuzmite Flash Decompiler Trillix

13. oktobar 2014