Cum se creează un cadru nou în Adobe Flash. Cum se creează o animație flash. Înțelegerea Action Script
Descărcați flash de pe site Poate sa căi diferite. Dar unele dintre ele sunt destul de greoaie, unele necesită utilizarea de pluginuri, programe și site-uri web. Între timp, există o metodă foarte elegantă și simplă, a cărei implementare nu necesită mult timp.
Mai întâi, să definim de ce avem nevoie de o culoare și ce este aceasta. Flash este o prezentare multimedia realizată folosind programul Adobe Flash sau . Aceste fișiere se numesc filme flash, deși pot fi mult mai mult decât un film.
Pot fi mini-programe întregi: bannere care reacționează la mișcarea mouse-ului vizitatorului, jocuri mici, așa-numitele jocuri flash, teste cu rezultate și așa mai departe.
Sau pot fi doar clipuri video sau audio.
Extensia standard pentru fișierele flash este SWF. Și când întâlnim astfel de videoclipuri pe site-uri web, nu le putem descărca la fel de ușor ca imaginile, cu butonul drept al mouse-ului. Va trebui să muncești puțin mai mult.
Descărcați flash de pe site
Accesați pagina site-ului web care conține fișierul flash de care aveți nevoie. După care:
Deschide codul paginii
Faceți clic dreapta pe pagină și selectați Vizualizați codul paginii . Încă două opțiuni pentru a deschide codul paginii: faceți clic Ctrl+U, sau scrieți înainte de adresa paginii Vizualizare sursă:
Căutați adresa video SWF în cod
Pentru a face acest lucru, activați căutarea folosind taste rapide Ctrl+Fși introduceți în câmpul de căutare .swf. Apoi apăsați introduce .
Găsiți adresa în sine, care va arăta astfel:
http://site.ru/papki/rolik.swf
sau cam asa:
/papki/rolik.swf
Dacă aveți a doua opțiune, atunci adresa este relativă, nu absolută. Trebuie plasat în stânga adresei pagina principala site-ul.
Verificarea adresei
Lipiți adresa videoclipului flash în bara de adrese a oricărui browser într-o filă nouă. Ar trebui să apară un videoclip.
Faceți din adresa un link
Dacă apare videoclipul, copiați adresa într-un bloc de note și faceți-l un link, adică adăugați codul corespunzător.
Ca rezultat, inscripția din blocnotes va arăta astfel:
Descărcați videoclipul flash pe computer
Deschideți fișierul salvat în browser. Va exista un link în interiorul ei. Faceți clic dreapta pe el, selectați Salvare link ca... sau Salvare prin link... și salvați videoclipul flash pe computer.
Pentru a viziona, fie deschideți-l într-un browser, fie folosiți un player flash, de exemplu Macromedia Flash Player .
Alte optiuni
Deși opțiunea descrisă mai sus mi se pare cea mai interesantă, voi oferi totuși și alte modalități de a salva flash-ul pe computer.
- Utilizarea site-ului http://save2go.ru. Introduceți adresa paginii pe care se află filmul dvs. flash și faceți clic Salvați de pe site . Un link către videoclip va apărea mai jos. Faceți clic dreapta și selectați Salvați linkul ca... sau Salvați prin link... .
- Folosind un plugin de browser, de ex. Asistent de descarcare Pentru Firefox .
- Folosind programe de descărcare, de exemplu, Descărcați Master. Mai întâi trebuie să găsiți adresa videoclipului flash, apoi să o introduceți în programul de descărcare.
Puteți obține informații mai detaliate în secțiunile „Toate cursurile” și „Utilități”, care pot fi accesate prin meniul de sus al site-ului. În aceste secțiuni, articolele sunt grupate pe subiecte în blocuri care conțin cele mai detaliate (pe cât posibil) informații despre diverse subiecte.
De asemenea, puteți să vă abonați la blog și să aflați despre toate articolele noi.
Nu ia mult timp. Doar faceți clic pe linkul de mai jos:
Te-ai întrebat vreodată ce se ascunde în spatele frumoasei animații de bannere de pe Internet? Sau desenele animate noi create cu ajutorul tehnologiei informatice? Cel mai adesea se bazează pe „carne”, sau mai precis, așa este tradus numele tehnologiei Flash din engleză. Astăzi vom vorbi despre animația flash pentru site:
Tehnologia flash
Cadrul multimedia a fost dezvoltat de Macromedia. Dar după absorbția sa (fuziunea), toate drepturile asupra tehnologiei au fost transferate noului proprietar - Adobe Systems.
Zona de aplicare modernă a Adobe Flash:
- Crearea de aplicații web este o direcție destul de nouă. Implică utilizarea completă sau parțială a Flash pentru a crea site-uri web. Când este aplicată parțial, această tehnologie creează elemente de design individuale: diverse meniuri interactive, butoane animate etc.
În comparație cu resursele convenționale bazate pe HTML, site-urile Flash au câteva caracteristici care limitează utilizarea acestora. Acestea includ costul ridicat de dezvoltare, cerințele pentru resursele serverului, timpi lungi de încărcare cu o conexiune lentă la Internet și alte câteva aspecte:
- Implementarea capabilităților multimedia - pentru a asculta audio și a reda video pe site-uri web, sunt adesea folosite playere media create pe baza Flash. Dezvoltarea lor include utilizarea unuia dintre limbajele de scripting (de obicei JavaScript):
- În publicitatea online, tehnologia este folosită cel mai adesea pentru a crea bannere animate. Ele implică nu numai redarea de publicitate multimedia, ci și un fel de interacțiune cu utilizatorul pe bază de joc.
Noțiuni de bază și instrumente de dezvoltare Flash
Pentru a crea animație flash, instrumentele tradiționale de la Adobe sunt cele mai des folosite:
- Adobe Flash Professional – un program pentru crearea de animație interactivă (animator);
- Adobe Flash Builder – un mediu pentru crearea de interfețe de aplicații web;
- Adobe Flash Player este un player integrat în browser pentru redarea Flash.
În plus, o serie de dispozitive pot reda conținut multimedia de acest tip. aplicații terță parte. Cele mai populare sunt Gnash, QuickTime și altele:
Această tehnologie vă permite să afișați orice tip de grafică ( raster, vector, 3D). De asemenea, acceptă transmiterea în flux a datelor audio și video. In special pentru dispozitive mobile un ușor Versiune flash Lite.
Principalul standard pentru fișierele Flash este extensia SWF. Abrevierea înseamnă Small Web Format. Videoclipul înregistrat în Flash are extensiile de fișiere FLV, F4V.
Dezvoltarea animației interactive în Flash se bazează pe Grafică vectorială. Datorită acestui fapt, a fost posibilă implementarea suportului pentru o platformă multimedia și independența calității animației față de rezoluția ecranului.
Dimensiunea fișierului aplicației flash este aceeași pentru toți utilizatorii, indiferent de caracteristici tehnice rezolutia ecranului).
Animația interactivă în Flash se bazează pe morphing (tip vectorial), în care există un flux lent între cadrele cheie. Pentru a reda datele, se folosește un player flash, a cărui funcționare este în multe privințe similară cu cea a mașină virtuală JavaScript. Componenta software a tehnologiei este implementată folosind limbajul ActionScript.
Dezavantajele tehnologiei includ următoarele puncte:
- Sarcină grea pornită CPU mașină client. Acest lucru se datorează eficienței scăzute a mașinii virtuale Flash, care este încorporată în browserul utilizatorului împreună cu playerul;
- Probabilitate mare de erori - redarea animației Flash poate apărea cu o probabilitate mare de erori. Mai mult, eșecurile în redarea Flash afectează negativ funcționarea întregii aplicații client (browser). Acest lucru se datorează controlului insuficient asupra toleranței la erori a codului programului la crearea aplicațiilor Flash;
- Eșec la indexare - Tot conținutul text afișat în conținutul Flash nu este indexat. Această limitare este deosebit de problematică pentru acele resurse care sunt create pe baza acestei tehnologii.
Revizuirea software-ului de creare Flash de la terți
Ca o aplicație prototip pe care vom demonstra elementele de bază Creare flash, El a fost luat Sothink SWF Mai repede. Potrivit multor profesioniști, programul este cel mai ușor de înțeles și cel mai ușor de învățat.
Pe lângă crearea și editarea, editorul flash „poate” funcționa cu toate celelalte tipuri de animație web (GIF, HTML și alte standarde):
După instalare, accesați interfața prietenoasă a programului. Din păcate, după ce am rătăcit prin toate colțurile, nu am găsit un comutator de limbă a interfeței.
Pentru a înțelege cum să faci animație flash în această aplicație, vom folosi șabloanele încorporate. Caseta de dialog „Nou din șablon” apare imediat după pornirea programului. În plus, poate fi apelat prin elementul din meniul principal „Fișier”. Printre opțiunile oferite, am ales să creăm un banner:
În următoarea fereastră a expertului, din lista derulantă trebuie să selectați un șablon în funcție de care va fi creată animația. Mai jos este un mic cadru în care este redat șablonul selectat:
În următorii pași, trebuie să setați dimensiunile bannerului și să introduceți 5 fraze de text care vor fi redate în animație. În plus, trebuie să specificați adresa resursei către care va fi condus utilizatorul făcând clic pe banner:
După compilarea proiectului și închiderea ferestrei expertului, puteți vizualiza videoclipul rezultat în playerul încorporat. Pentru a face acest lucru, faceți clic pe săgeata verde din partea de sus:
După închiderea playerului, să aruncăm o privire mai atentă asupra interfeței aplicației. Vă rugăm să rețineți că acesta constă din două ferestre principale: cea de sus este pentru editarea perioadei de timp a videoclipului, iar cea de jos este o fereastră obișnuită. editor grafic. Fiecare dintre elemente este situat pe un strat separat, care poate fi modificat folosind instrumente standard situate pe bara laterală.
Până acum, ne-am uitat la filmele Flash care se joacă fără intervenția spectatorului de la început până la sfârșit. Cu toate acestea, Flash vă permite și să creați aplicații interactive, în care utilizatorul poate controla afișarea conținutului. În această lecție, vom începe să explorăm elementele limbajului de scripting Action Script și vom vedea cum poate fi folosit pentru a crea aplicații interactive. De exemplu, să creăm un album foto cu elemente de interfață interactivă. Dar înainte de a începe să descriem Action Script, ar trebui să vorbim despre încă un tip de simbol pe care l-am ignorat până acum - simbolurile butoanelor. Pentru a construi o interfață interactivă, acestea sunt pur și simplu necesare.
Crearea de butoane
Butonul este un film interactiv cu patru cadre. Când atribuim un tip de buton unui simbol, Flash creează o cronologie cu patru cadre pentru noul simbol:
Up-state este un cadru corespunzător situației în care butonul nu este apăsat și indicatorul mouse-ului nu este situat deasupra butonului;
Cadru suprastat care ilustrează aspectul butonului când cursorul mouse-ului este poziționat peste buton, dar butonul nu este apăsat;
Starea în jos acest cadru arată aspectul butonului atunci când este apăsat;
Starea de lovire definește zona în care butonul răspunde la un clic de mouse; această zonă nu este vizibilă în clip.
Pentru a crea un buton, rulați comanda Insert => New Symbol (puteți tasta comanda rapidă de la tastatură Control+F8). În caseta de dialog Creare simbol nou care apare, introduceți un nume pentru simbolul butonului (de exemplu, but1) și selectați tipul de simbol Buton.
Flash va trece la modul de editare a caracterelor, oferind cadre Sus, Peste, Jos și Hit. Primul cadru, Sus, devine un cadru cheie gol. Să desenăm o vedere neapăsată a butonului în acest cadru (Fig. 1).
Orez. 1. Buton pentru cadru sus
Să selectăm al doilea cadru, marcat ca Peste și corespunzător stării în care cursorul se află deasupra butonului. Să introducem un cadru cheie în acest cadru (folosind comanda Insert => Keyframe), în urma căruia va apărea un cadru cheie care repetă complet conținutul Up-frame-ului. Să schimbăm culoarea butonului, așa cum se arată în Fig. 2.
Fig 2. Butonul peste cadru
În mod similar, adăugați următorul cadru (cadru în jos) și desenați starea apăsată a butonului (Fig. 3).
Orez. 3. Buton pentru cadru în jos
Nu vom desena nimic în cadrul Hit deocamdată, dar vom reveni la acest cadru puțin mai târziu.
Să mergem la scena principală, să apelăm biblioteca folosind comanda Window => Library și să creăm o instanță a simbolului butonului trăgându-l pe scenă (Fig. 4.)
Orez. 4. Creați o instanță de buton trăgând-o din bibliotecă
Drept urmare, obținem următorul film. După cum se poate observa din acest film, apăsarea unui buton are loc nu numai când facem clic cu mouse-ul pe zona centrală (de lucru) a butonului, ci și când facem clic pe cadrul din jurul acestuia. Acest lucru se datorează faptului că, dacă cadrul Hit nu este desenat, atunci zona de lucru a butonului va corespunde cadrului Sus.
Pentru ca butonul să fie apăsat doar în zona de lucru, este necesar să definiți această zonă în cadrul Hit, adică să desenați butonul fără cadru (vezi Fig. 5)
Orez. 5. Butoane Hit-frame
După ce adăugăm Hit-frame-ul necesar, vom obține următorul film, în care atunci când faceți clic pe cadru, butonul nu este apăsat.
Pentru a face un buton interactiv, trebuie să asociați faptul de a apăsa butonul cu executarea anumitor comenzi, adică să descrieți un anumit scenariu. Pentru a crea scripturi în Flash, există un limbaj special numit Action Script. În această lecție vom atinge doar o mică parte din capacitățile acestui limbaj, iar în viitor vom reveni la structura și sintaxa Action Script pe măsură ce exemplele de creare a filmelor interactive în Flash devin mai complexe.
Înțelegerea Action Script
Action Script este un limbaj de scripting - un set de instrucțiuni care controlează elementele unui film Flash. Scripturile de acțiune pot fi încorporate într-un film sau stocate extern fisier text cu extensia AS.
Când încorporați un scenariu într-un film, acesta poate fi încorporat în diferite părți ale filmului. Mai precis, Scripturile de acțiune pot conține cadre cheie, instanțe de buton și instanțe de clip video. În consecință, scripturile se numesc Acțiuni cadru, Acțiuni butoane și Acțiuni MovieClip.
Scripturile de acțiune rulează atunci când apar anumite evenimente inițiate de utilizator sau de sistem. Mecanismul care indică Program flash, care instrucțiune ar trebui să fie executată atunci când are loc un anumit eveniment se numește handler de evenimente.
Action Script are propria sa sintaxă, la fel ca JavaScript. Flash MX 2004 acceptă Action Script of all Versiuni anterioare Flash.
Unul dintre conceptele principale ale Action Script este Acțiuni - comenzi care emit instrucțiuni în timpul execuției unui fișier SWF. De exemplu, gotoAndStop() trimite capul de redare la un anumit cadru sau cue. De la cuvântul Actions provine numele limbajului - Action Script (literalmente - action script). Ne vom familiariza cu majoritatea conceptelor acestui limbaj la exemple concrete.
Album foto interactiv
Să demonstrăm utilizarea butoanelor pentru a gestiona un album foto - creați un set de fotografii și adăugați două butoane care vor derula fotografiile înainte și înapoi.
Să plasăm prima fotografie pe cronologia principală și să adăugăm un buton din setul standard. Pentru a accesa folderul dorit, trebuie să rulați Comanda Windows=> Panouri de control Biblioteci comune => Butoane (Fig. 6).
Orez. 6. Adăugați un buton de la bibliotecă standard
Ca rezultat al executării acestei comenzi, va apărea un panou care conține un set mare de butoane predesenate tipuri variate. Să selectăm, de exemplu, Butoanele tastelor (butoane similare tastelor de la tastatură), să deschidem folderul corespunzător, să selectăm butonul din stânga tastei (Fig. 7) și să creăm o instanță a acestui buton (trăgându-l pe scenă).
Orez. 7. Elemente ale dosarului Key Buttons
Rețineți că atunci când plasați un al doilea buton (tasta-dreapta) pe scenă și îl mutați pentru a se alinia cu primul buton, programul oferă un indiciu (o linie punctată) care vă permite să poziționați cu precizie butonul (Figura 8).
Orez. 8. Alinierea automată a butoanelor la același nivel
Pentru a adăuga un script, trebuie să apelați editorul Action Script folosind comanda Window => Development Panels => Actions sau apăsând tasta F9. Dacă intenționați să scrieți scripturi frecvent, aceasta este o comandă de la tastatură care merită reținută. Ca rezultat, va apărea editorul Action Script (Fig. 9).
Orez. 9. Panourile Editor de scripturi de acțiune
Dacă experimentați prin evidențierea diverse elemente pe scenă, în timp ce monitorizați simultan mesajele din panourile editorului Action Script, veți descoperi că programul sugerează pe ce element puteți „agăța” codul. Dacă selectați un cadru pe scenă, în colțul din stânga sus al panoului editorului apare inscripția Actions - Frame; dacă faceți clic pe buton, apare inscripția Actions - Button, adică programul solicită ca codul introdus va se referă la scriptul butonului. Și dacă selectați o fotografie, va apărea un mesaj în câmpul destinat introducerii unui script: Selecția curentă nu poate avea acțiuni aplicate acesteia (nu poate fi aplicat un script acestui obiect selectat).
Vom atribui un script unui buton. ÎN ultimele versiuni ActionScript are capacitatea de a scrie cod centralizat, adică cod care se află într-un singur loc, iar această capacitate vă permite să înțelegeți mai bine programele mari. Cu toate acestea, în exemple simple (care este ceea ce ne uităm), alocarea unui script unui buton este perfect acceptabilă.
Deci, pentru un buton săgeată la stânga, trebuie să formalizăm următorul scenariu: „Dacă butonul este eliberat pe un anumit cadru, atunci din acest cadru trebuie să mergeți la cadrul anterior”. În conformitate cu sintaxa limbajului Action Script (Fig. 10), va arăta astfel:
Prima linie conține handlerul de evenimente butonul on(), care are formatul:
Acum să adăugăm mai multe cadre cheie, astfel încât butoanele create în primul cadru să fie copiate în ele și să plasăm fotografiile necesare în cadrele nou create.
Dacă rulăm filmul creat pentru execuție, cadrele vor fi redate continuu unul după altul și, prin urmare, în primul rând, trebuie să dăm comanda „Stop” pe primul cadru. Pentru a face acest lucru, adăugați comanda corespunzătoare la primul cadru (Fig. 11).
Orez. 11. Script atribuit primului cadru
Vă rugăm să rețineți: comanda nu mai este atribuită butonului, ci cadrului. Faptul că unui cadru i se atribuie un script este notat pe linia principală de editare - o literă mică „a” apare deasupra punctului aldin în desemnarea cadrului.
Drept urmare, am primit următorul film.
Dacă avem doar câteva cadre în albumul foto, atunci două butoane - „Înainte” și „Înapoi” - sunt destul de suficiente, dar dacă setul de fotografii este mare, atunci este indicat să avem și butoane care leagă la început și sfârșitul filmului. În exemplul următor, vom adăuga butoanele corespunzătoare: „La primul cadru” și „La ultimul cadru”. Puteți selecta butoanele unui mnemonic adecvat din biblioteca standard de butoane din folderul Circle Buttons (Fig. 12).
Folosind exemplul propus, ne vom familiariza cu o altă comandă, gotoAndStop(), care vă permite să mergeți la cadrul dorit și apoi să vă opriți.
Orez. 12. Butoane din folderul Circle Buttons
Vom pune un cod pe butonul pentru a merge la primul cadru (al treilea din stânga în Fig. 13), așa cum se arată în Fig. 13.
Orez. 13. Script pentru butonul „În primul cadru”.
În cazul unui album foto cu cinci cadre, adăugați scriptul de tranziție „La ultimul cadru” la ultimul buton:
Scriere automată de scenarii
Până acum, am tastat toate comenzile manual, dar panourile editorului ActionScript oferă o serie de servicii pentru scrierea automată a scripturilor. Să luăm în considerare aceste posibilități.
Orez. 14. Instrumente automate de scripting
Panoul de editor Action Script vă permite să selectați, trageți, rearanjați și ștergeți comenzi.
Să arătăm cum puteți scrie același script pentru butonul „Înainte” într-un mod automat. Selectând folderul Movie Clip Control (fereastra din stânga sus din Fig. 14), puteți accesa gestionarea evenimentului și apoi trebuie să faceți dublu clic pe elementul corespunzător sau să trageți expresia în câmpul de scriere a scriptului în Drag și Modul drop.
Orez. 15. Sugestie pentru completarea unei expresii
Ca urmare, pe câmpul de lucru vor apărea expresia necesară și un indiciu ca acesta (Fig. 15): selectați comanda dorită din meniu și expresia se completează automat. După cum se poate vedea din meniu, puteți selecta nu numai condiția asociată butoanelor de pe ecran, ci puteți selecta și din meniul Fig. Tasta cu 15 puncte Apăsați „
Orez. 16. Apeluri cu butonul de la tastatură
Să folosim comanda keyPress
Orez. 17. Comanda nextFrame poate fi găsită în folderul Timeline Control
Pentru un buton care duce filmul la începutul albumului foto, puteți selecta apăsând tasta Acasă din meniu ca eveniment, apoi (Fig. 18) trageți comanda gotoAndStop pe câmp, în urma căruia o altă un indiciu va apărea pe sintaxa posibilă a acestei comenzi.
Săgețile din sfatul instrumentului vă permit să vizualizați diferite opțiuni de sintaxă. Programul oferă două opțiuni (Fig. 18 și 19), adică oferă setarea unei scene și a unui cadru sau doar a unui cadru. În cazul nostru, este suficient să specificați doar Cadrul. Dacă numele scenei este omis, implicit este săriți la cadrul scenei curente.
Orez. 18. Sugestie despre sintaxa posibilă a comenzii
Orez. 19. Săgeata triunghiulară vă permite să vizualizați opțiunile de sintaxă
După ce atribuim toate butoanele corespunzătoare butoanele de la tastatură, vom obține următorul film, în care răsfoirea fotografiilor va avea loc de la tastatură, iar apăsarea mouse-ului pe butoanele de pe ecran nu va provoca nicio consecință.
Este posibil să oferim un scenariu în care evenimente diferite să ducă la aceleași acțiuni? Se pare că puteți - pentru a face acest lucru, trebuie să enumerați o listă de nume de evenimente în handler-ul de evenimente. Dacă puneți o virgulă în lista de evenimente după primul eveniment, programul în sine vă va oferi un meniu (Fig. 20).
Orez. 20. Când introduceți o virgulă în lista de evenimente, apare automat un meniu de comenzi suplimentare
Să adăugăm la primul eveniment (apăsând un buton de la tastatură) un al doilea eveniment (eliberând butonul de pe ecran):
pornit(apăsați tasta" |
Să repetăm procedura pentru butoanele rămase și ca urmare vom obține un album foto în care fotografiile vor fi derulate atât cu mouse-ul, cât și cu tastatura (fișierul FLA original poate fi obținut din link).
În exemplul luat în considerare, am folosit tranziția după numărul de cadre, dar această metodă nu este întotdeauna convenabilă: dacă numerotarea cadrelor se modifică în timpul procesului de editare a filmului, logica se poate defecta. Este mai convenabil să utilizați tranziția după marcajul cadru. Să ne uităm la un exemplu care necesită nu numai răsfoirea albumului, ci și mutarea la diferite secțiuni, adică o navigare mai complexă.
Lăsați albumul să fie format din desene, grafica pe computer si fotografii.
Să etichetăm primul cadru din secțiunea „desene” Imagini; în mod similar, vom atribui etichetele „grafică” și „fotografie” primelor cadre ale altor secțiuni.
Să creăm un strat pentru plasarea etichetelor și să-l numim Etichete. Pentru a eticheta un cadru, în panoul Proprietăți trebuie să selectați tipul de etichetă Nume și să scrieți numele acestuia. În cazul nostru, Imagini (Fig. 21). În mod similar, vom plasa markere în cadrele 5 și 10 (Fig. 22).
Orez. 21. Exemplu de atribuire a unei etichete unui cadru
Acum să adăugăm un nou strat și să-l numim Acțiuni. În primul cadru cheie al stratului Actions, apelați panoul Actions Frame (prin apăsarea butonului F9) și introduceți comanda stop () (vezi Fig. 22)
Orez. 22. Scenariul primului film
Să adăugăm un alt strat numit Subiecte (subiecte), în care vom da titluri cadrelor corespunzătoare: „Desene” (Fig. 23), „Grafic” și „Fotografii”.
Orez. 23. Titlu pentru cadrele secțiunii „Desene”.
Acum să adăugăm în lateral butoane de meniu cu nume similare, pe care le vom plasa pe un nou strat numit Meniu.
Să tipărim primul element din meniul „Imagini” din marginea din stânga și să îl transformăm într-un simbol de buton. Folosind instrumentul Săgeată, selectați blocul de text „Imagini” și executați comanda Modify => Convert to Symbol (această comandă poate fi executată și folosind tasta F8), în panoul Convert to Symbol, setați tipul de simbol Buton și definiți-i denumește ca imagineButton (Fig. 24).
Orez. 24. Atribuiți numele pictureButton butonului de acces la secțiunea de imagini
Să creăm patru cadre pentru butonul „Desene”: primul va reprezenta pur și simplu textul original (Fig. 25), al doilea va reprezenta același text doar în albastru, vom sări peste al treilea cadru (în acest caz, cadrul în jos). va fi la fel cu cadrul Over), iar în cadrul Hit vom desena o zonă dreptunghiulară care va defini zona în care este apăsat butonul (Fig. 26).
Orez. 25. Cadrul superior al butonului de imagine
Orez. 26. Hit-frame al butonului pictureButton
Acum trebuie să atașăm scriptul la butonul nou creat. Pentru a face acest lucru, selectați butonul din Scena 1 și, apăsând F9, apelați panoul Acțiuni, apoi introduceți codul prezentat în Fig. 27.
Orez. 27. Script pentru trecerea la un cadru cu o etichetă
Întâlnim constant animații flash – pe internet și în emisiunile de televiziune. Crearea unei animații Flash simple folosind tehnologia Flash este o sarcină destul de ușoară, deoarece Flash oferă multe instrumente utile, care simplifică întregul proces. Dacă doriți să creați o animație flash sau un desen animat, o puteți schița în doar câteva ore.
Pași
Partea 1
Animație flash cadru cu cadru- În mod implicit, Flash se redă la 24 de cadre pe secundă (FPS). Aceasta înseamnă că 24 de cadre vor fi afișate într-o secundă, dar nu toate trebuie să fie diferite. Puteți modifica această setare (dacă doriți) la 12 cadre pe secundă, dar la 24 de cadre pe secundă animația se va reda mai ușor.
-
Instalați Flash Professional. Există multe programe pentru crearea animației Flash, dar cel mai puternic este Adobe Flash Professional CC. Puteți instala gratuit versiune de încercare acest program sau folosiți alt produs (dacă nu doriți să vă înregistrați pentru Adobe Creative Cloud). Restul acestui articol descrie cum să utilizați Flash Professional.
Deoarece animația cadru cu cadru necesită mai multe imagini (care sunt ușor diferite unele de altele), trebuie să creați aceste imagini manual. Pentru a face acest lucru, utilizați Adobe Flash Professional sau desenați imagini în orice editor grafic.
- Dacă doriți ca imaginile dvs. să fie redimensionate cu ușurință, fără a pierde calitatea, creați-vă imaginile în grafică vectorială, mai degrabă decât în grafică raster. Imaginile vectoriale se vor redesena pe măsură ce sunt redimensionate (însemnând că veți evita pixelarea sau anti-aliasing). Imaginile raster sunt imagini tradiționale, cum ar fi fotografii, imagini desenate și așa mai departe. Dacă încercați să măriți astfel de imagini, veți ajunge la o imagine foarte distorsionată.
-
Creați primul cadru. Prima dată când lansați Adobe Flash Professional, veți vedea o pânză goală (strat) și o cronologie goală. Pe măsură ce se adaugă cadre, cronologia se va completa automat. Puteți lucra cu straturi la fel ca în Photoshop.
- Înainte de a adăuga o imagine, creați un fundal de bază pentru animație. Redenumiți „Layer 1” în „Background” și apoi fixați-l. Creați un al doilea strat și denumiți-l după cum doriți. Acesta va fi stratul pe care veți crea animația.
- Adăugați un desen la prima pânză cadru. Puteți importa desenul de pe computer sau puteți utiliza instrumentele de desen pentru a crea desenul direct în program.
- Primul cadru este cadrul „cheie”. Un cadru cheie este un cadru care conține o imagine și formează coloana vertebrală a unei animații. Veți crea un nou cadru cheie de fiecare dată când modificați imaginea.
- Cadrele cheie din cronologia sunt indicate printr-un punct negru.
- Nu aveți nevoie de un cadru cheie pentru fiecare cadru ulterior. Creați un cadru cheie la fiecare patru până la cinci cadre pentru a face o animație bună.
-
Convertiți imaginea într-un simbol.În acest caz, puteți adăuga imaginea în cadru de mai multe ori. Acest lucru este util mai ales dacă trebuie să adăugați rapid mai multe imagini similare într-un singur cadru (de exemplu, pești într-un acvariu).
- Selectați desenul. Faceți clic dreapta pe imagine și selectați „Convertire în simbol”. Imaginea va fi adăugată în bibliotecă, făcând-o mai ușor de utilizat în viitor.
- Ștergeți desenul. Nu vă faceți griji - îl puteți adăuga la cadru pur și simplu trăgându-l din bibliotecă. În acest fel, puteți adăuga același desen într-un cadru de mai multe ori.
-
Adăugați cadre goale. Odată ce primul cadru cheie este gata, inserați cadre goale și apoi începeți să creați al doilea cadru cheie. Apăsați F5 (de patru sau cinci ori) pentru a adăuga cadre goale după primul cadru cheie.
Creați un al doilea cadru cheie (după ce ați adăugat câteva cadre goale). Sunt două căi diferite pentru a face acest lucru: puteți copia un cadru cheie existent și îi puteți face mici modificări sau puteți crea un cadru cheie gol și adăugați o nouă imagine. Dacă utilizați un desen creat într-un alt program, utilizați a doua metodă. Dacă inserați o imagine creată folosind instrumentele de desen Adobe Flash Professional, utilizați prima metodă.
- Pentru a crea un cadru cheie folosind conținutul cadrului cheie anterior, apăsați F6. Pentru a crea un cadru cheie gol, faceți clic dreapta pe ultimul cadru din cronologia și selectați Inserați cadru cheie necompletat.
- Odată ce ați creat al doilea cadru cheie, trebuie să faceți modificări imaginii acestuia pentru ca animația să prindă viață. Dacă ați folosit instrumentele de desen Adobe Flash Professional, selectați instrumentul Transformare pentru a selecta un element din desen (cum ar fi mâna unui personaj) și schimbați-l.
- Dacă inserați o nouă imagine la fiecare cadru cheie, asigurați-vă că este în locul potrivit (în funcție de secvența logică a cadrelor).
-
Repetați procesul. După ce ați creat două cadre cheie, repetați procesul - adăugați câteva cadre goale între fiecare cadru cheie și asigurați-vă că animația este redată fără probleme.
- Faceți mici modificări. Cu cât modificările sunt mai mici (mai subtile), cu atât animația va fi mai fină. De exemplu, dacă doriți ca un personaj să ridice mâna, al doilea cadru cheie nu ar trebui să includă un desen al personajului cu mâna deja ridicată. În schimb, utilizați mai multe cadre cheie pentru a trece de la o mână coborâtă la o mână ridicată. În acest caz, animația va fi mai fluidă.
-
Transformați desenul. Dacă ați creat cadre cheie și o cale, puteți transforma imaginea astfel încât să se schimbe fără probleme pe măsură ce vă deplasați de-a lungul căii interpolare. Puteți modifica forma, culoarea, înclinarea, dimensiunea și orice alt aspect al imaginii.
- Selectați un cadru în care desenul va fi transformat.
- Deschideți panoul de proprietăți a desenului. Pentru a face acest lucru, apăsați F3.
- Modificați setările din fereastra de proprietăți a desenului. De exemplu, puteți schimba nuanța sau culoarea, adăugați filtre, modificați dimensiunea.
- De asemenea, puteți utiliza instrumentul Transformare gratuită pentru a schimba desenul după cum doriți.
-
Adăugați finisajul. Testați animația creată apăsând Ctrl + Enter. Asigurați-vă că desenul (personajul) se modifică corect și că animația este redată la viteza corectă. Dacă animația este redată prea repede, reduceți valoarea FPS sau măriți durata interpolarii.
- FPS implicit este 24, așa că încercați să reduceți această valoare la 12. Schimbați valoarea FPS în panoul de proprietăți. Cu toate acestea, la FPS = 12, este posibil ca animația să nu fie redată suficient de lin.
- Pentru a modifica durata unei interpolari, selectați stratul care conține interpolarea și utilizați glisorul pentru a modifica durata interolarii. Dacă doriți să dublați durata gemenului, mutați glisorul la 48 de cadre. Nu uitați să introduceți fundalul în cadrele goale, astfel încât fundalul să nu dispară în mijlocul animației. Pentru a face acest lucru, selectați stratul de fundal, faceți clic pe ultimul cadru al animației (pe cronologia), apoi apăsați F5.
Elementele de bază ale animației stop-motion. Această metodă este considerată metoda principală de creare a animației „tradiționale”, în care fiecare cadru ulterior include aceeași imagine, dar ușor modificată. Când toate cadrele sunt redate, imaginea „prinde viață”. Aceasta este aceeași metodă folosită de animatorii de desene animate desenate manual și necesită mai mult timp decât înfrățirea (vezi secțiunea următoare).
Partea 3
Adăugarea de efecte sonore și muzică-
Înregistrați sau descărcați efecte sonore și muzică. Puteți adăuga efecte sonore la animația dvs. pentru a o face mai de impact. Muzica face animația mai interesantă și poate transforma o animație bună într-una grozavă. Flash acceptă o varietate de formate de fișiere audio, inclusiv AAC, MP3, WAV și AU. Alege un format care garantează calitate superioară sunet cu o dimensiune minimă a fișierului.
- Formatul MP3 garantează o calitate ridicată a sunetului cu o dimensiune minimă a fișierului. Fișierele WAV au dimensiuni mari.
-
Importați fișiere audio în bibliotecă pentru a adăuga rapid sunete și muzică animațiilor dvs. Faceți clic pe „Fișier” - „Importați” - „Importați în bibliotecă”. Găsiți fișierul audio pe computer. Asigurați-vă că fișierul audio are un nume ușor de reținut, astfel încât să îl puteți găsi rapid.
Creați un nou strat pentru fiecare fișier audio. Acest lucru nu este necesar și puteți adăuga sunet la straturile existente, dar lipirea fișierului audio pe un strat separat vă va oferi mai mult control asupra pistei audio a animației.
Creați un cadru cheie care va începe redarea audio. Pe stratul de sunet, selectați cadrul de animație din care va începe să fie redat sunetul. Apăsați F7 pentru a insera un cadru cheie gol. De exemplu, dacă doriți să inserați un fișier audio care va fi redat pe tot parcursul animației, selectați primul cadru din stratul fișierului audio. Dacă adăugați vocea unui personaj, alegeți o fotografie în care personajul începe să vorbească.
