Modalități de a crea mișcare în Flash. Mișcarea pe o traiectorie dată
Cum este un desen animat când nu există acțiune? Ce se va întâmpla cu un desen animat care nu spune o poveste? Probabil ați văzut cum artiștii din studio desenează schițe dintr-un model live. Astfel de cursuri sunt foarte utile pentru înțelegerea anatomiei și a modului în care mușchii se comportă în mișcare. Cu toate acestea, specificul transmiterii unei astfel de mișcări nu oferă o claritate deplină! Se limitează la redare viata reala, nu mai mult. Mișcarea și activitatea sunt descrise complet diferit în animație. Prin urmare, cunoștințele despre cum să desenați corect corpul nu sunt suficiente. Este deosebit de important să stăpânești tehnicile care vor „reînvia” forma. Exact despre asta vom vorbi în acest curs!
Ce este important de știut
Când un artist lucrează la un personaj care se află într-o anumită situație, este important ca el/ea să creeze mai întâi acțiune. Orice scenă în care vă plasați personajul ar trebui să ajute spectatorul să vadă intenția care îl motivează să acționeze. Vedeți motivele, sentimentele, abilitățile (sau lipsa acestora) și personalitatea în ansamblu. Acest obiectiv trebuie atins chiar și în absența completă a dialogului. Aici desenele au un avantaj: ne putem juca cu limbajul corpului și umflam emoțiile la limită. Nu va trebui să plătiți bani pentru actori, studio sau alte cheltuieli. Suficientă hârtie și creion. Nu există limită pentru imaginație!
Pentru a obține aceste rezultate în animație, trebuie să urmăriți două lucruri:
- Simplitate;
- Ritm.
Treptat vom înțelege ce rol joacă fiecare dintre ei în compoziția unei scene pictate.
1. Curba de mișcare
O „curbă de mișcare” este calea imaginară pe care se mișcă corpul personajului tău. Se caracterizează prin simplitate și intensitate. Această tehnică genială vă va ajuta să vă atingeți obiectivul dorit atunci când vă planificați desenele. Cu el vei putea crea un efect dramatic. Țineți cont de acest lucru data viitoare când schițați personajele în acțiune. 
Curba de mișcare ar trebui să fie netedă și să aibă direcție, astfel încât să ne fie evident ce intenționează să facă fiecare personaj.
Observați cât de ciudat arată designul bazat pe curbe complexe de mișcare.
Un exemplu de curbă de mișcare utilizată incorect este cazul în care linia nu se potrivește în context așa cum se dorește.
În desene animate vedem exemplu perfect simplitate și ritm. Curba de mișcare îi oferă artistului capacitatea de a spori efectul scenelor sale. Luați în considerare curba chiar înainte de a începe să desenați proporțiile personajelor. Vă asigur că desenul final cu mișcare vă va mulțumi mai mult.
Pentru a înțelege exact ce tehnici și metode vor ajuta să insufleți viață personajelor de desene animate, trebuie să ne familiarizăm cu principiile teoretice pe care se bazează aceste tehnici.
2. 12 Principii de bază ale animației
În 1981, doi dintre cei mai mari animatori ai Disney (Frank Thomas și Ollie Johnson) au scris cartea Iluzia vieții. Ei au prezentat publicului „12 concepte de bază ale animației” pe care studioul le folosește încă din anii 1930, în încercarea de a crea cea mai realistă animație posibilă. Deși aceste concepte au fost dezvoltate pentru a fi utilizate în animația tradițională, ele rămân aceleași astăzi - chiar și în proiecte digitale.
Conceptele de bază sunt următoarele:
- Squash și întinde
- Pregătire sau anticipare (anticiparea)
- Înscenare
- Acțiune directă și poză în poză
- Inerție și acțiune de suprapunere
- Încet înăuntru și încetinește
- Arc
- Acțiune secundară
- Sincronizare
- Exagerare
- Desen final (Desen solid)
- Atracție (apel)
Nu este scopul meu să vă copleșesc cu o gamă completă de tehnici de animație, așa că să ne concentrăm pe cele mai importante și să încercăm să înțelegem cum pot însufleți un design „plictisitor”.
Compresiune și întindere
Aceasta este tehnica principală, dacă nu cea mai importantă, pe care trebuie să o folosim în crearea dinamicii mișcării personajelor. Întregul concept se rezumă la strângerea și întinderea proporțiilor unui personaj sau obiect în funcție de mișcare. Această tehnică ne permite să adăugăm greutate și fluiditate mișcării. Vedeți cum se aplică unui obiect:
Observați fizica unei mingi care sări: pe măsură ce accelerează în jos, forma ei se întinde. Când mingea lovește pământul, este întinsă orizontal (ceea ce accentuează forța de atracție gravitațională).
Exemplul de mai sus ilustrează perfect această tehnică. Este puțin probabil ca în viața reală să vezi o minge așa deformată atunci când sare, dar în animație funcționează grozav!
Un exemplu despre cum se aplică această tehnică expresiilor faciale: Observați că forma vârfului craniului nu se schimbă și doar maxilarul inferior se extinde în jos.
Aceeași tehnică se aplică la acțiune. Puteți vedea imediat că personajul poartă o sarcină grea. Observați că întreaga jumătate inferioară a corpului este comprimată, în timp ce jumătatea superioară este întinsă.
Uimitor, nu? Această tehnică ne duce la următorul subiect:
Exagerare
Nu sunt multe de spus aici, deoarece principiul este evident în sine. Gesturile exagerate și pozițiile corpului creează un efect dramatic - aceasta este o regulă obligatorie de animație. Imaginați-vă ce se întâmplă când suntem surprinși sau speriați - corpul nostru reacționează spontan de surprindere. Același lucru ar trebui să se întâmple și cu un desen de desene animate, dar cu un rezultat mult mai pronunțat!
Observați cum ochii personajului ies din orbite și corpul lui pare să fie înghețat. Aceasta este o reprezentare exagerată a unei reacții naturale care poate fi observată în viață.
Conform regulilor studioului Disney, această tehnică trebuie să reflecte în mod credibil viața, dar într-o formă mai extremă. Exagerarea presupune modificări ale caracteristicilor fizice ale unui personaj sau ale unui element al scenei în care se regăsesc. Totuși, rețineți că este important să înțelegeți clar ce fel de mișcare ilustrați folosind această tehnică, pentru a nu induce în eroare privitorul.
Exagerare: Acordați atenție traiectoriilor personajului. Ele ajută la evidențierea punctului de aplicare a forței cu care încearcă să ridice sarcina. Acest lucru va convinge cu siguranță spectatorul că mingea este extrem de grea!
Pregătire sau anticipare
Pregătirea sau anticiparea este o tehnică folosită pentru a pregăti privitorul pentru o acțiune care urmează să aibă loc. Este folosit pentru a pregăti mișcarea sau apariția unui obiect, personaj etc., așa-numitul set preliminar de energie, care precedă adesea punctul culminant.
Un exemplu clasic de pregătire: personajul este pe cale să fugă și să părăsească scena!
Teoretic, pregătirea este creată dintr-o mișcare instantanee, căreia i se opune simultan o mișcare în sens invers. În animație, aceasta implică, în cea mai mare parte, pregătirea pentru acțiunea propriu-zisă și revenirea pentru a finaliza ciclul.
Observați cum adăugăm acțiune în animația de mai sus: există o scurtă anticipare a mișcării la început, care servește apoi drept impuls pentru mișcare. Apoi observăm cum corpul revine din mișcare la o stare de repaus.
Configurarea este o tehnică folosită în animație pentru a face spectatorul să se aștepte la efectul pe care îl va produce o scenă - indiferent dacă este statică sau animată. Ca exercițiu, încercați să găsiți alte exemple în care se folosește această tehnică.
Direcționare și accent
În animație numim „direcționare” efectul care precede "accent". Ambele sunt necesare pentru a scoate în evidență expresia surprizei. Acestea sunt efectuate conform următorului algoritm:
- Personajul vede ceva uimitor;
- Apare anticiparea (capul scade rapid);
- Are loc momentul „accentului”, capul se ridică.
- Personajul revine la starea inițială.
Să vedem cum funcționează acest algoritm.
Pasul 1
Începem prin a desena un personaj cu o expresie veselă sau naturală:
Pasul 2
Personajul vede ceva uimitor și, anticipând momentul, lasă capul în jos și închide ochii. Această mișcare crește impresia că vede ceva incredibil!
Pasul 3
Pasul 4
Personajul se calmeaza si revine la starea initiala.
În timpul acestui proces, animatorii folosesc o tehnică numită sincronizare scenă în care se adaugă faze intermediare pentru a crea o tranziție lină între cadre.
Aici vedem utilizarea unei tehnici de „strângere și întindere” care adaugă mobilitate și impuls mișcării. În viața reală, singura parte în mișcare a craniului nostru este maxilarul inferior, care se deschide și se închide. Dar în animație, totul se poate întinde - chiar și capul!
Vom reveni la „timing” puțin mai târziu.
Intrare lentă și ieșire lentă
Este destul de firesc ca atunci când ne pregătim să facem o mișcare bruscă sau să realizăm orice acțiune care necesită efort, corpul nostru are nevoie de o anumită perioadă de timp pentru a concentra energia necesară acestei acțiuni. Rezultatul este o accelerare instantanee (sau constant uniformă, în funcție de mișcare). Acest lucru face ca personajul animat să pară credibil, iar numărul de cadre cheie și faze variază în funcție de frecvență - o imagine mai exagerată a ceea ce se întâmplă în viața reală.
Când vrem să subliniem o anumită mișcare într-o animație, plasăm mai multe cadre la începutul și la sfârșitul acelei mișcări - dar includem și mai puține faze între ele. Acest lucru creează o intrare lentă și o ieșire lentă. Acest principiu este utilizat pe scară largă în animație atunci când dorim să desenăm mișcarea unui personaj între pozițiile îndepărtate ale corpului - de exemplu, săritul în sus.
Sfat: Dacă sunteți web designer și lucrați cu tranziții pentru a crea animații pe paginile site-ului, probabil că ați dat peste conceptul de „timing”, pentru care se folosește funcția Tranziţieîn CSS3. Această caracteristică folosește Smooth In și Smooth Out, printre alți parametri, pentru a descrie curba de viteză din animație. La fel, dacă lucrați în After Effects, probabil veți observa în meniu Asistent de cadre cheie comenzile „Lină fără probleme”, „Intrare lină” și „Ieșire lină”. Într-un caz sau altul, dacă ai folosit aceste opțiuni, înseamnă că aplici deja celebrul principiu al animației în proiectele tale!
Atracţie
Atracția poate fi descrisă prin cuvintele „carismatic” sau „apel personal”, pe care artistul le înzestrează cu personajele sale. Nu contează dacă personajul este pozitiv sau negativ, un erou sau un răufăcător, un bărbat sau o femeie - cel mai important lucru este că privitorul se poate identifica cu ei. Trăsăturile fizice influențează, de asemenea, comportamentul și personalitatea unui personaj. Prin urmare, atunci când un personaj face o acțiune sau exprimă o atitudine față de ceva, este important să ne gândim la modul în care calitățile sale fizice, sociale sau culturale se vor armoniza cu acest comportament/atitudine.
Vedeți cum desenul de mai sus reflectă în mod specific atracția fiecărui personaj. Pentru a sublinia anumite trasaturi sunt suficiente mici detalii, de exemplu, silueta unei femei sau fata alungita a unui majordom si o ipostaza tensionata, dar mereu eleganta. Lucrul important aici este să înțelegeți natura fiecărei caracteristici pe măsură ce le adăugați la scenele dvs.
Observați ce mișcări și acțiuni specifice face fiecare personaj pentru a se dezvălui privitorului. Se vor comporta ca o femeie senzuală? Ce mai face hoțul? Ca un escroc? Ce mai face majordomul? Cum e chelnerul? Cum e stilistul? Care specific Ce trăsături disting acest personaj? Ce haine poartă? Trebuie să observăm constant nuanțele comportamentului oamenilor în viața reală pentru a folosi aceste detalii în avantajul nostru.
Să trecem rapid prin fiecare dintre principiile rămase pentru a obține o înțelegere generală:
Înscenare
Montarea este creată pentru a direcționa atenția publicului către o componentă importantă a cadrului. În producție pot fi utilizate scenarii sau obiecte suplimentare. În esență, această tehnică este necesară pentru a concentra atenția asupra a ceea ce este cel mai important și pentru a elimina toate detaliile neimportante. Acest concept este folosit foarte mult în benzi desenate. Culoarea, lumina și unghiul camerei sunt folosite pentru a concentra atenția privitorului asupra celor mai importante detalii.
Am adăugat mașina în cadru pentru a sublinia semnificația a ceea ce se întâmplă. Acum avem context clar și totul devine clar!
Prin Acțiune și Poză la Poză
„Acțiune prin acțiune” înseamnă un storyboard detaliat al unei scene de animație de la început până la sfârșit. „Poze to Pose” se referă doar la desenul cadrelor cheie, golurile dintre care vor fi ulterior completate cu faze. Lucrul interesant este că prima tehnică este folosită doar în animația 2D. Dar tehnica Pose to Pose este încă folosită în scenariile de film și animația 3D.
Inerție și suprapunere
Inerția se referă la continuarea mișcării părților individuale ale corpului unui personaj datorită mișcării întregului corp. De exemplu, unele părți ale corpului continuă să se miște, în ciuda faptului că personajul s-a oprit brusc. „Suprapunerea” este o tehnică prin care unele părți ale corpului se mișcă cu o anumită întârziere față de cea principală. De exemplu, corpul, membrele sau părul se mișcă la un interval de timp diferit față de cap. Combinarea acestor două tehnici vă permite să creați animații mai realiste.
Observați cum părul și tricoul se mișcă cu viteze diferite, urmând mișcarea.
Arc
Când mișcarea unui personaj urmează o anumită cale, o numim „arc”. Imaginați-vă mișcările ciclice ale mâinilor unui dirijor de orchestră sau secvența mișcărilor unui patinator de viteză sau a unui atlet olimpic care execută o săritură în înălțime. Fiecare dintre ele face multe mișcări care se îmbină într-un lanț de elemente secvențiale netede. Dacă la un moment dat rupi acest lanț și forțezi personajul tău să facă ceva care nu se potrivește în el, animația ta va arăta ciudat.
Acțiune de fundal
Acțiunea de fundal este adăugată la acțiunea principală din cadru pentru a îmbunătăți efectul pe care doriți să îl creați. Imaginați-vă un personaj care merge pe stradă și nu acordă atenție la ceea ce se întâmplă în jurul lui. În același timp, mașinile trec în viteză pe lângă el pentru a sublinia pericolul. Sau imaginați-vă privirea de îndoială de pe fața funambulului. Acestea sunt exemple de acțiuni de fundal în cadru care îi subliniază semnificația.
Sincronizare
„Cronometrarea” înseamnă calcularea numărului de desene care compun o anumită acțiune. De exemplu, un obiect sau un personaj care se mișcă încet sau cu dificultate este de obicei un personaj greu. Timpul dictează numărul de cadre și faze pe care trebuie să le desenați pentru a transmite scena în mod credibil. Va trebui să faceți același lucru pentru a desena un obiect ușor.
Sincronizare este un concept extrem de important în animație și este utilizat pe scară largă pentru a crea personaje și acțiunile acestora.
Redare finală
Desenul final se referă la acuratețea desenelor pe hârtie. Desenele trebuie să aibă greutate și volum pentru a fi văzute și interpretate corect. Cu toate acestea, nu există despre care vorbim despre desenul detaliat pentru a face desenul realist. Vorbim despre modul în care vă prezentați cunoștințe teoretice desen. Un artist care a stăpânit elementele de bază ale designului poate crea iluzia de volum în desenele sale, chiar și într-o schiță 2D. Aceasta este arta iluziei de verosimilitate.
Unele stiluri de animație necesită un realism extrem în reprezentarea obiectelor, a îmbrăcămintei și a altor obiecte pentru a prezenta scena privitorului. De exemplu, aceasta ar putea fi o anumită perioadă istorică, care trebuie descrisă până la cel mai mic detaliu. Din acest motiv, cunoștințele teoretice și principii practice desenul și anatomia umană sunt de neînlocuit.
Platforma Tuts+ are mai multe articole și cursuri scrise de diferiți autori care vă vor ajuta să aprofundați elementele de bază ale desenului. Acolo poți trece prin diferite stiluri de desen și poți deveni un artist complet.
3. Mișcări secvențiale și cicluri de mers
Potrivit lui Ken Harris, animator la Warner Bros., „Mersul este primul lucru de învățat”. A învăța să faci un personaj de desene animate să meargă exact așa cum vrei tu este cea mai dificilă sarcină din animație. Există mai multe moduri și diferă în funcție de dimensiunea, complexitatea, contextul și intensitatea scenei.
În mod curios, mersul nu este altceva decât o încercare de a te sprijini într-o poziție verticală. Cu alte cuvinte, încercăm să evităm să cădem la pământ! Imaginați-vă un bebeluș care încearcă să stea în picioare... aplecându-se în față, ar putea face un pas reflex.
Adulții merg cu încredere și, de regulă, nu fac pași bruși. De fapt, abia ne ridicăm picioarele de pe pământ. Mișcările noastre sunt păstrate la minimum necesar, scopul principal este de a deplasa corpul înainte.
În animație totul este diferit. Plimbarea unui personaj poate spune o întreagă poveste. Prin urmare, vom folosi tehnici de exagerare și sincronizare pentru a obține rezultatul dorit.
Să analizăm procesul simplificat din figura de mai jos:
Exemplu de ciclu de mers simplu: corpul se ridică ușor în sus etapele de transfer.
Observați că brațele se mișcă opus picioarelor; iar când corpul se ridică în faza de leagăn, un picior este drept.
Acum umplem golurile cu faze suplimentare și completăm ciclul principal de mers în animație:
Diferite tipuri de mers și alergare
După cum am menționat, în animație (și în viață) există diferite plimbări și pot fi folosite pentru a transmite sentimentele și dorințele dorite ale personajelor. Diferitele șabloane transmit acest lucru:
Modele de animație celebre: acestea au fost create pe baza cărții Cartoon Animation de Preston Blair. Sunt sigur că ești familiarizat cu aceste imagini din diferite desene animate.
Exemplu pas de mers: Corpul se mișcă în sus și în jos tot timpul.
Diferențele în mersul animalelor cu patru picioare
Mișcarea animalelor cu patru picioare - mai mult subiect complex, deoarece trebuie să monitorizați mișcarea picioarelor din față și din spate. Mișcarea netedă vă va îngreuna munca, dar merită să învățați din exemple de mișcări din viața reală.
Mersul unui animal din desene animate este o interpretare simplificată a ceea ce se întâmplă în lumea animală reală. Mușchii și articulațiile ocupă poziții diferite în funcție de faza de mișcare a corpului:
Privește mai sus cum se comportă picioarele din față și din spate etapele de transfer corp: capul coboară ușor pe măsură ce piciorul din spate se deplasează înainte. Opusul are loc în timpul balansării labei din față.
Există și alte tipuri de mersuri ale animalelor în animație care își urmează propriul ritm. Să ne uităm la două dintre ele mai jos:
Exercita. Încercați să găsiți traiectorii de mișcare în imaginile de mai sus. De asemenea, rețineți că canterul este un exemplu genial de utilizare a compresiei și extensiei.
Un exemplu de galop animat. Labele din față inițiază mișcarea și oferă impulsul necesar.
Redarea realistă a unui ciclu de mers pe jos sau alergare depinde de mai mulți factori precum greutatea, înălțimea, intenția... Cel mai important lucru aici este să observați aceste mișcări pe baza exemple reale din viata.
Desenul mers și alergare este un subiect destul de complex care merită un curs separat dedicat doar acestuia. Unele animale, cum ar fi caii, au diferențe în anatomia lor, ceea ce face ca picioarele lor să se miște diferit. Consultați secțiunea „Animale cu copite” din mine, vor fi mai multe detalii acolo. Dacă doriți să aruncați o privire mai profundă asupra mișcărilor cailor, consultați această carte de Monika Zagrobelnaya.
Punând totul împreună
Înainte de a încheia, am creat o secvență de animație care combină exemple ale mai multor tehnici discutate mai sus. Puteți spune care este folosit?
Sfârşit!
Rolul animației tradiționale în arta secolului 21 este dezbătut în mod activ astăzi. Studiourile moderne de animație precum Pixar sau Dreamworks folosesc încă cel puțin 90% din tehnicile descrise mai sus. Abilitatea de a da viață unui desen - fie prin pin-up-uri, benzi desenate sau animație - este un lucru frumos. Dacă putem face un copil să creadă că un animal poate vorbi și se comporta ca un om, este uimitor. Când emoțiile privitorului se trezesc, niciun cuvânt nu poate exprima sentimentele pe care artistul le trăiește în acel moment.
Carlos Gomes Cabral
Sunt un produs din nebunia anilor 80, locuind în orașul Rio de Janeiro (Brazilia). Am fost pasionat de arte, benzi desenate și muzică încă de când eram copil, m-am dedicat mai multor proiecte în același timp și urăsc să stau nemișcat. Cu o diplomă de licență în IT, lucrez în prezent la o companie de mobilitate tehnologică. De asemenea, sunt îndrăgostit de grafica în mișcare, HTML5, web design și tendințele UX. Mă puteți găsi pe Twitter (@cgcabral).
Subiect: Animație în mișcare în Flash.
Tipul de lecție: Lecție-proiect cu elemente de muncă creativă.
Ţintă:
Aspect educativ- dezvoltare creativitate elevii prin gândire imaginativă activă, dezvoltând capacitatea de a lucra cu computere și informații pentru a-și extinde cunoștințele.
Aspectul de dezvoltare– aplicarea creativă a cunoștințelor lor în domeniul graficii computerizate bidimensionale.
Obiectivele lecției: Prezintă elevilor tipurile de animație. Dezvoltați capacitatea de a crea animații simple în Flash.
Forme de organizare a activităților educaționale și cognitive ale elevilor:
- individual– fiecare elev creează un proiect individual al unui fragment din basmul „Kolobok”;
- grup– proiectele individuale ale elevilor fac posibilă implementarea unui proiect de grup al basmului „Kolobok”. Lucrează pentru viitor - arătând basme copiilor preșcolari și școală primară ca parte a dezvoltării unui centru sociocultural la școală.
Planul lecției:
- Organizarea lecției.
- Enunțul problemei lecției.
- Aflați despre clasificarea animațiilor în Flash (conversație euristică).
- Actualizarea cunoștințelor despre crearea de obiecte desenate manual în sistem.
- Demonstrație de creare a unei animații simple.
- Lucrări practice elevii la calculator.
- Rezumând lecția.
- Teme pentru acasă.
PROGRESUL LECȚIEI
1. Organizarea lectiei
Profesorul verifică pregătirea elevilor pentru lecție.
2. Enunțul problemei lecției
Să ne uităm la câteva obiecte și să aflăm pe care le preferi. Care vă plac cel mai mult și de ce?
Vizualizați unele pagini Web, diapozitive de prezentare cu și fără animație.
În timpul conversației, aflăm că site-urile web și slide-urile de prezentare cu animație sunt mai frumoase.
Cum să creați animație este subiectul lecției de astăzi ( Anexa 1).
3. Obțineți informații despre clasificarea animațiilor în Flash(conversație euristică cu demonstrație. Anexa 1)
Scopul principal al sistemului din Flash este de a „reanima” imaginile desenate manual.
După ce stăpânești tehnicile de bază de lucru în sistem, vei fi capabil să:
Creați o prezentare eficientă sau un program de instruire;
- creați un site web sau adăugați o „întorsătură de viață” designului site-ului dvs., de ex. creare de videoclipuri publicitare web (bannere);
- creează un desen animat;
- programează-ți primul joc.
Înainte de a începe să facem ceva în practică, să ne uităm la conceptele de bază în animație: cadru(cadre), cadru cheie, strat(straturi) și cronologie(cronologie), personaje ( simboluri) (Anexa 1).
Animaţie- este o modificare a proprietăților unui obiect în timp (animația este procesul de modificare a dimensiunii, poziției, culorii sau formei unui obiect în timp).
Cadru. Toate filmele constau din cadre (cadre). Fiecare cadru conține o imagine statică. Iluzia mișcării este creată de modificări subtile ale modelelor de la un cadru la altul. Cadrul poate fi compus fie manual, fie generat de Flash
Cadru cheie– cadru disponibil pentru procesare (afișat ca un cerc negru dacă conține o imagine și alb dacă nu există imagine). O fotografie în care realizatorul realizează o tranziție de imagine animată.
Strat - acesta este un bloc de film format din imagini individuale, animație cu propria cronologie .
Cronologie - un câmp care afișează informații despre straturi, care cadre sunt cadre cheie și care sunt generate de Flash.
Animație în Flash, din punctul de vedere al creării, se pot distinge următoarele subspecii: cadru cu cadru animaţie, automat (transformatoare) animație și animație bazată pe scenarii. Fiecare tip de animație are propriile avantaje și dezavantaje și domenii de aplicare.
Animație stop motion constă în întregime din cadre cheie, iar conținutul cadrelor îl creați singur. Acest lucru amintește de procesul de creare a desenelor animate, când fiecare cadru este desenat pe o foaie separată și dacă aveți 5000 de cadre într-un desen animat, atunci va trebui să desenați 5000 de desene. (arată prezentarea de diapozitive pe hârtie). În Flash acest lucru este, desigur, mult mai ușor de făcut decât pe hârtie, dar este totuși munca grea, în plus, dimensiunea fișierului pentru animația cadru cu cadru este mare. În Flash, animația cadru cu cadru este utilizată în cazurile în care problema nu poate fi rezolvată în alte moduri.
În animație de transformare munca principală în timpul creării sale este efectuată de Flash, care vă permite să obțineți o animație simplă. Animație automată (așa-numita animație tweened), atunci când se folosește, autorul creează doar primul și ultimul cadre ale animației, iar Flash generează automat toate cadrele intermediare.
Animație bazată pe scenarii. Un script este o descriere a comportamentului unui obiect în limbajul nativ Flash numit ActionScript.
Din punct de vedere al metodei de construcție, animația se împarte în animație în mișcareŞi animație de schimbare a formei. Animația în mișcare este realizată pe instanțe ale unui obiect și vă permite să-l mutați, să schimbați scara, să-l transformați, să adăugați transparență și să aplicați culoare; În același timp, forma obiectului rămâne neschimbată. Shape Animation funcționează direct cu desene și vă permite să schimbați un desen în altul în timp ce îi schimbați poziția, dimensiunea și culoarea.
Animație de formular
Astăzi ne vom familiariza cu principiile creării animației formelor.
Spre deosebire de animația în mișcare, animația de formă funcționează numai cu primitive, adică cu forme create folosind instrumente de desen. La fel ca în animația în mișcare, nu ar trebui să existe mai mult de o formă animată într-un strat.
Animație în mișcare
Crearea animației în mișcare diferă de animația cadru cu cadru prin faptul că nu trebuie să creăm manual fiecare cadru, este suficient să creăm primul cadru al animației și ultimul, programul va umple automat toate cadrele intermediare. Trebuie să rețineți că animația în mișcare este aplicabilă numai simbolurilor și nu ar trebui să existe mai mult de un simbol animat pe un strat.
Cu alte cuvinte, Înainte de a începe să vă creați propriul „desen animat”, ar trebui să decideți asupra alegerii mecanismului pentru implementarea acestuia.
4. Actualizarea cunoștințelor despre crearea de obiecte desenate manual în sistem.
Aflați cum puteți crea un obiect, selectați culoarea de fundal și culoarea conturului formei, selectați obiectul, unde se află proprietățile obiectului ( cu demonstrație pe tabla interactivă).
5. Demonstrație de creare a unei animații simple.
6. Lucrări practice ale elevilor la calculator
Crearea unui mini-proiect bazat pe basmul „Kolobok”.
Comentariu pentru profesor. Fiecare elev primește lucrări practice pentru a crea un fragment separat dintr-un basm. Se recomandă să exprimați în prealabil basmul „Kolobok” și să împărțiți fișierul de sunet în scene separate pentru a indica studenților durata animației în timpul lucrului lor.
Lucrare practică pe tema „Cea mai simplă animație în mișcare în Flash”
Opțiune - 1
Exercita . Picture1.jpg) un coc se rostogolește pe potecă și se aud următoarele cuvinte:
Cocul stătea acolo, stătea întins acolo, apoi s-a rostogolit de la fereastră la bancă, de la bancă la podea, de-a lungul podelei până la uşă, a sărit peste prag - şi mai departe pe potecă.
Sunetul durează 9 secunde. 13 cadre – 1 secundă. Animați imaginea în tot acest timp (117 cadre) și exportați un fragment al filmului într-un catalog D:/Utilizator/_ sub nume scape.avi
Algoritm de execuție
- Deschideți programul Flash MX 2004 (D:/SCHOOL/Flash MX 2004/*.exe).
- Folosind bara de instrumente din spațiul de lucru, creați un kolobok dintr-un basm.
- Adăugați o imagine de fundal:
- Creați un nou strat selectând comanda Inserare – Cronologie – Strat(treceți la al doilea strat făcând clic pe numele stratului).
- Importați imaginea de fundal File – Import – Import to stage.(Selectați o poză din catalogul D:/FOTO/Kolobok/Figure1.jpg).
- Redimensionați imaginea folosind instrumentul Transformare gratuită pentru a se potrivi cu cadrul.
Opțiune - 2
Exercita . Creați un fragment din basmul „Kolobok”, unde în imaginea de fundal (D:/FOTO/Kolobok/Image2.jpg) un bărbat de turtă dulce se rostogolește pe poteca către un iepure și se aud următoarele cuvinte:
Chicul se rostogolește și un iepure îl întâlnește:
- Nu mă mânca, coasă, îți voi cânta un cântec.
Opțiune - 3
Exercita . Creați un fragment din basmul „Kolobok”, unde în imaginea de fundal (D:/FOTO/Kolobok/Picture3.jpg) cocul fuge de iepure și se aud următoarele cuvinte: Și cocul s-a rostogolit - doar iepurele a văzut-o.
Opțiune - 4
Exercita . Creați un fragment din basmul „Kolobok”, unde în imaginea de fundal (D:/FOTO/Kolobok/ Poza4.jpg) cocul se rostogolește pe poteca spre lup și în același timp se aud următoarele cuvinte:
Cocul se rostogolește pe o potecă în pădure și o întâlnește un iepure:
- Kolobok, Kolobok! Te voi mânca!
- Nu mă mânca lup cenușiu, o să-ți cânt o melodie.
Opțiune - 5
Exercita . Creați un fragment din basmul „Kolobok”, unde în imaginea de fundal (D:/FOTO/Kolobok/ Poza5.jpg) cocul fuge de lup și se aud următoarele cuvinte:
Opțiune - 6
Exercita . Creați un fragment din basmul „Kolobok”, unde în imaginea de fundal (D:/FOTO/Kolobok/ Poza6.jpg) un urs se rostogolește pe potecă și se aud următoarele cuvinte:
Cocul se rostogolește prin pădure și un urs îl întâlnește:
- Kolobok, Kolobok! Te voi mânca!
- Păi, unde poți, picior roșu, să mă mănânci!
Opțiune - 7
Exercita . Creați un fragment din basmul „Kolobok”, unde în imaginea de fundal (D:/FOTO/Kolobok/ Poza7.jpg) cocul fuge de urs și se aud următoarele cuvinte:
Și cocul s-a rostogolit din nou - ursul tocmai a avut grijă de el.
Opțiune - 8
Exercita . Creați un fragment din basmul „Kolobok”, unde în imaginea de fundal (D:/FOTO/Kolobok/ Poza8.jpg) cocul se rostogolește pe potecă spre vulpe și în același timp se aud următoarele cuvinte:
Cocul se rostogolește și vulpea îl întâlnește:
- Bună, bunule! Cântă-mi o melodie!
Turta dulce a început să-și cânte cântecul, Alice a ascultat și s-a strecurat mai aproape.
Opțiune - 9
Exercita . Creați un fragment din basmul „Kolobok”, unde în imaginea de fundal (D:/FOTO/Kolobok/ Poza9.jpg) cocul sare pe nasul vulpii și se aud următoarele cuvinte:
Frumoasa melodie! – spuse vulpea – Da, am îmbătrânit – nu aud bine. Stai pe degetul meu mic și mai cântă o dată.
Opțiune - 10
Exercita . Creați un fragment din basmul „Kolobok”, unde în imaginea de fundal (D:/FOTO/Kolobok/ Poza10.jpg) vulpea a mâncat chifla și se aud următoarele cuvinte:
Kolobok a sărit pe nasul vulpii și a cântat:
- Sunt o chifla, o chifla!...
Alice - ah! - și l-a mâncat.
7. Rezumând lecția
Toate lucrările de creare a unui film au loc folosind panoul Timeline, a cărui imagine este prezentată mai jos. Panoul Cronologie este împărțit în două părți printr-o linie verticală care poate fi mutată cu mouse-ul. Partea dreaptă a panoului este așa-numita „linie de cadru” - o linie pe care sunt situate simbolurile de cadru, care arată ca dreptunghiuri mici. Conținutul cadrelor sunt imagini statice care se modifică în timp și apar pe câmpul de lucru. Numerotarea cadrelor este prezentată în partea de sus a liniei.
Sub linia cadrului există o „bară de stare”.
Ultimul cadru
în lanțul de cadre duplicat este indicat printr-un dreptunghi alb.
- Pentru a activa un strat, trebuie să-l selectați. Puteți desena și edita numai pe stratul activ. Stratul activ este evidențiat în Timeline și o pictogramă creion indică faptul că poate fi editat (Layer 3).
- Conținutul straturilor care se află deasupra cronologiei apare deasupra conținutului straturilor de sub ele. Pentru a schimba straturile, trebuie să trageți numele stratului în locul dorit de pe cronologie.
- Pentru a crea un nou strat, selectați o poziție pe cronologia noului strat și faceți clic pe butonul „Adăugați strat”.
- Pentru a șterge un strat, pur și simplu trageți-l în Coșul de gunoi.
- Pentru a redenumi un strat, faceți dublu clic pe el pe cronologie.
- Când creați o imagine cu mai multe straturi, utilizați controalele stratului. Făcând clic în coloana de sub imaginea castelului va bloca orice editare, iar în coloana de sub imaginea ochiului va face stratul invizibil.
Mai jos este un exemplu de videoclip de animație în care, în straturi diferite cu o deplasare de 25 de cadre, fundal diferit(peisaj) cu un bloc de text corespunzător.
- în Flash. Un simbol poate fi fie cea mai simplă primitivă geometrică sau combinația lor, fie o animație întreagă (film). Acest lucru permite ca simbolurile să fie folosite ca un mecanism puternic pentru crearea abstracțiilor în Flash. Există trei tipuri de simboluri: animație (clip video), buton (buton) și
- imagine (grafică)
- Imagine (grafică)
- , este un simbol format dintr-un singur cadru. De aici numele său static. Dacă simbolul este cu adevărat un obiect static (neanimant), este mai bine să îl faceți grafic.
Hit este starea normală pentru un buton care conține un link pe care utilizatorul l-a vizitat deja.
- Desenați singur fiecare cadru, folosind Flash numai pentru a defila printre cadre.
- Faceți ca Flash să calculeze automat cadrele intermediare.
Animație pas cu pas (cadru cu cadru).
Aceasta este o animație compusă în întregime din cadre cheie. Aceste. Dumneavoastră determinați atât conținutul cadrului, cât și „durata” acestuia (adică câte astfel de cadre statice va ocupa imaginea).
, apoi editați copia rezultată. Când doriți să utilizați imagini gata făcute ca bază, puteți face acest lucru după cum urmează - Fișier, Import... Pe cronologie, animația cadru cu cadru arată astfel:
- Avantajele acestei metode includ:
- Animația stop-motion oferă, într-un fel, mai mult control asupra animației, iar dacă ești un animator cu experiență, o poți folosi în avantajul tău.
- Acesta este singurul mod de a organiza o schimbare de imagini absolut independente - o prezentare de diapozitive (de exemplu, crearea unui banner obișnuit folosind Flash).
Și tot ce decurge din capacitatea de a desena manual fiecare cadru.
- Dezavantajele includ următoarele:
- Animația stop-motion este dificil de modificat. Mai ales dacă nu este un set discret de imagini, ci o animație aferentă. Toate cadrele trebuie modificate.
Animația cadru cu cadru ocupă o cantitate destul de mare de spațiu, deoarece este necesar să stocați informații despre fiecare cadru.
- Operațiuni de bază cu personalul:
. - Inserați un cadru cheie gol - Inserare -> Cadru cheie gol,
. - Cadru cheie care repetă conținutul celui precedent - Inserare -> Cadru cheie,
+ . - Șterge cadru cheie - Inserare -> Șterge cadru cheie,
. - Inserați un cadru obișnuit - Inserați cadru,
+ .
Șterge cadrul - Inserare -> Eliminare cadre,
- Operații de bază cu rolă:
- Urmărește videoclipul - Control, Testează film.
- Modificarea înălțimii și lățimii unui videoclip - Modificare, Film.
- Conversia unui film Flash într-un document HTML Fișier, Setare de publicare, filă HTML.
Vizualizarea unui document HTML - Fișier, Previzualizare publicare.
Să creăm un film cu mai multe straturi cu animație pas cu pas „Viața unei flori”. Primul strat - cadru, al 2-lea strat - ghiveci, al 3-lea strat - floare. Al 3-lea strat poate fi reprezentat ca trei straturi: frunză, tulpină, inflorescență.
Videoclipul este publicat folosind File->Publish Setting. În fila Formate sunt selectate opțiunile de publicare, puteți selecta mai multe dintre ele, în filele corespunzătoare setați parametri pentru opțiunea de publicare selectată, apoi faceți clic pe butonul Publicare. În acest caz, fișierele create sunt salvate în același folder ca și fișierul original cu extensia .fla.
În exemplul nostru, opțiunea fișier animat Gif a fost selectată pentru publicare, ca în toate exemplele ulterioare.
- Încercați să finalizați singur a doua sarcină folosind algoritmul de mai jos. Aceasta va crea o animație Moving Car:
- creați un strat „Peisaj”;
- rulați comanda File/Import și importați o imagine a unui peisaj sau creați un fundal „asfalt”;
- Selectați al 30-lea cadru de pe riglă și apăsați F5. creați un lanț de cadre duplicate pentru peisaj;
- creați un nou strat „Automat”;
- Să desenăm o mașină fără roți în primul cadru cheie;
- Să grupăm mașina desenată și apăsând F8 vom crea un eșantion de bibliotecă - un clip auto;
- mutați mașina, selectați al doilea cadru și apăsați F6;
- vom muta mașina și vom crea noi cadre cheie până când mașina va dispărea în afara câmpului de lucru;
- creați un nou strat și numiți-l „Roata1”;
- Să desenăm o roată în primul cadru și să creăm un eșantion de bibliotecă din ea: roată;
- Să creăm un nou cadru cheie și să mișcăm volanul în spatele mașinii mutate în el etc. în toate celelalte cadre, rotind roata la un unghi mic;
- blocați stratul „Wheel1” și copiați întreaga secvență de cadre rezultată în buffer;
- creați un nou strat și numiți-l „Wheel2”;
- selectați primul cadru și copiați întreaga secvență de cadre din buffer;
+ .
Pentru a bucla vizualizarea, faceți clic
Ca o altă sarcină independentă, puteți sugera crearea unei animații pas cu pas „Arderea unui chibrit”:
În Flash, există două opțiuni pentru construirea de imagini intermediare - interpolare în mișcare (animație de construcție bazată pe modificarea caracterului) și interpolare de formă (animație de construcție bazată pe schimbarea formelor). Aceste metode sunt fundamental diferite.
Animație în mișcare Cu această metodă de animație sunt specificate poziția inițială, culoarea, dimensiunea, orientarea și parametrii finali, iar programul însuși realizează această mișcare. creează automat cadre intermediare între cadrele cheie pe care le specificați. Aceasta înseamnă că desenați un obiect, apoi pe alt cadru faceți modificările despre care vom vorbi mai jos și îi cereți lui Flash să calculeze cadrele care se află între aceste două cadre cheie. Își face treaba și obțineți o animație fluidă.
Viteza și netezimea animației depind de numărul de cadre alocate pentru mișcare și de viteza filmului Flash (film). Viteza filmului poate fi modificată după cum urmează: Modificare->Film...,
Netezimea și durata sunt determinate de numărul de cadre alocate pentru animație (fragmentul acesteia).
Să luăm în considerare animația cu construcția de cadre intermediare (mișcare interpolată). Aceasta este cea mai folosită tehnică de animație în Flash. În acest caz, animația se bazează pe modificarea personajelor, adică. obiectul de animație este un simbol. Ca și în animația de interpolare a formei, pentru fiecare obiect la un moment dat, avem nevoie de un strat. Ar trebui să existe un simbol pe acest strat, cu care vor avea loc toate modificările.
- Când utilizați Motion Tweening, următorii parametri sunt modificați:
- dimensiune (atât proporțională, cât și disproporționată - înălțime și lățime separat);
- înclinaţie;
- locaţie;
- unghi de rotație;
- efecte de culoare;
Puteți utiliza straturi de ghidare pentru a defini traseul mișcării unui obiect.
- Există mai multe moduri de a activa interpolarea mișcării (și, din păcate, o singură modalitate de a o dezactiva). Pentru a activa interpolarea de mișcare, trebuie să activați cadrul inițial al tranziției, apoi faceți clic dreapta și selectați Creare interpolare de mișcare în meniul contextual (același lucru se poate face selectând Inserare->Creare interpolare de mișcare). O modalitate universală de a activa/dezactiva interpolarea mișcării este utilizarea panoului Cadru, selectând Mișcare în câmpul Tweening. Acolo puteți controla parametrii de animație:
- Ușurarea - accelerație exponențială inversă, funcționează exact la fel ca în interpolarea formei.
- Orientare spre cale - rotește simbolul în funcție de linia de direcție. Snap fixează simbolul în acest ghid.
În cazurile în care numărul de cadre ale scenei principale nu este un multiplu al numărului de cadre de caractere, caseta de selectare Sincronizare vă permite să sincronizați cele două animații.
Sunt numite straturile care conțin curba de-a lungul căreia trebuie să se miște obiectul straturi de ghidare(straturi de ghidare) (adică ele conțin traiectoria obiectului). Pentru a adăuga un strat de ghidare, trebuie să Selectați stratul pe care se află simbolul dvs.; apoi faceți clic dreapta și selectați Adăugare ghid din meniul contextual. În acest caz, stratul original devine un strat ghidat. Aceasta nu este singura modalitate de a crea un strat de ghidare.
Orice strat poate fi făcut ghid specificând acest lucru în proprietățile sale, sau ghidat prin glisarea stratului dorit cu mouse-ul astfel încât să fie sub ghid.
Apoi, trebuie să desenați o traiectorie de mișcare. Calea poate fi orice curbă care nu este o zonă de umplere. Toate! Stratul de control este gata. Puteți să-l dezactivați pentru editare pentru a face mai convenabil să lucrați și, în viitor, să îl faceți complet invizibil.
Acum, pentru a utiliza acest strat, trebuie să luați simbolul de punctul central (este un cerc atât de mic) și să-l trageți pe cale. Veți simți când simbolul „prinde” pe el și veți vedea cum alunecă de-a lungul lui.
Apoi, totul urmează scenariul familiar - cadre cheie, activați interpolarea mișcării... Dacă aveți nevoie ca obiectul să se rotească în funcție de traiectorie și nu doar să se deplaseze de-a lungul acestuia, atunci în panoul Cadru trebuie să activați caseta de selectare Orient to path .
Interpolarea mișcării vă permite să aplicați diferite efecte de culoare întregului simbol. Această caracteristică nu este disponibilă pentru interpolarea formei.
- Pentru a aplica un efect unui simbol, trebuie să selectați acest simbol, iar în panoul de efecte (Windows ->Panouri ->Efecte), selectați efectul dorit, setând luminozitatea, schimbarea culorii, nuanța.
- Creați propriul exemplu foarte simplu de animație a unei mingi care se mișcă într-un cerc utilizând algoritmul de mai jos:
- Să desenăm un cerc în primul cadru și să-l umplem cu o umplere cu gradient radial;
- grupează desenul;
selectați-l cu instrumentul Transformator și mutați centrul de rotație la o anumită distanță; - să trecem la cadrul 30, faceți clic
- în lista suplimentară Rotire, selectați rotație forțată în sensul acelor de ceasornic (CW) sau în sens invers acelor de ceasornic (CCW).
Următorul exemplu este puțin mai complicat - crearea unei animații a mișcării literelor text:
- Folosind instrumentul Text, creați un bloc de text;
- selectați cuvântul scris și împărțiți-l în litere separate (Modifi/Break Apart);
- să separăm literele în straturi separate Modificare/Distribuire la Straturi;
- convertiți fiecare literă din fiecare strat într-un desen, repetați comanda Modificare/Separare. Selectați fiecare literă și grupați-o;
- pe linia de cadru, la o oarecare distanță, vom crea copii ale primului cadru, faceți clic;
; - Vom selecta pe rând primele cadre pentru fiecare literă, o vom muta în afara zonei de lucru, vom schimba proporțiile literei, centrul de rotație etc.;
- În panoul Proprietăți, în lista Tween, selectați Mișcare. În lista suplimentară Rotire, selectați o rotație în sensul acelor de ceasornic;
- Să urmărim animația în fereastra de vizualizare
+ .
Animația de formular este o schimbare lină a unui obiect de animație pe câmpul de lucru. Prin obiect înțelegem aici nu un grup sau un bloc de text, ca în animația în mișcare, ci un desen obișnuit multicolor care poate consta din mai multe fragmente. Mai mult, numărul de astfel de fragmente la începutul și la sfârșitul animației poate fi diferit.
În timpul procesului de animație a formei, un desen se poate rupe în mai multe fragmente independente, fiecare dintre acestea se va transforma treptat în ceva neașteptat. Sau, invers, mai multe imagini independente situate pe câmpul de lucru, în timpul procesului de animație, schimbându-și treptat aspectul (dimensiune, culoare, formă), devin parte dintr-o singură imagine.
De exemplu, aveți nevoie de un pătrat pentru a se transforma fără probleme într-un cerc sau de silueta unui iepure să curgă lin în silueta unui lup. În aceste cazuri, se folosește interpolarea formei.
După ce există două cadre cheie, trebuie să îl activați pe primul (doar mergeți la el) și să îl selectați în panoul Cadru (Windows->Panouri->Cadru,
- Ușurarea specifică accelerația exponențială inversă. Valoarea acestui parametru poate varia de la - 100 la + 100. Aceasta înseamnă că dacă setați relaxarea negativă, mișcarea va avea loc cu o accelerație pozitivă, viteza va crește. În schimb, dacă relaxarea este pozitivă, animația va încetini;
- Parametrul Blend determină algoritmul de tranziție:
- Distributiv - netezește tranziția de la o formă la alta.
- Angular (unghiular) - încearcă să mențină proporțiile colțurilor.
Ultimul instrument în animația de interpolare a formelor este punctele de control (sfaturi de formă, literalmente - sfaturi pentru forme). Acestea sunt punctele prin care ajutați Flash să facă tranziția corect. Nu te poți descurca fără ele în cazul formelor complexe. Sunt foarte usor de folosit. Pe primul cadru cheie (de la care începe animația) adăugați un punct de control (Modificare->Transformare->Adăugați indiciu de formă, Puteți elimina toate punctele folosind Modificare->Transformare->Eliminare toate sugestiile. Puteți șterge un singur punct făcând clic dreapta pe el și selectând Eliminare indiciu în meniul contextual. Deoarece punctele de control sunt desemnate prin litere ale alfabetului latin, pot exista maximum 27 dintre ele. culoare; unghi de rotație. Adesea, în timpul procesului de animație, este necesar ca un obiect să se miște nu în linie dreaptă, ci de-a lungul unui traseu dat. În acest caz, animația este creată în mod obișnuit, iar traiectoria este desenată într-un strat separat. Un strat de cale poate suporta mai multe animații diferite, fiecare pe propriul strat, dar toate acele straturi de animație trebuie să fie sub stratul de cale. Pentru a desena o cale, puteți folosi diverse instrumente: creion, pensulă, creion, elipsă sau dreptunghi. Pentru a lega un obiect în mișcare de această traiectorie, trebuie să mutați pur și simplu acest element pe traiectorie în cadrele cheie inițiale și finale ale animației. Acest strat este conceput pentru a acoperi și a face invizibilă partea din imagine situată direct sub ea. Dacă masca de strat nu conține nicio imagine, atunci acoperă complet (maschează) stratul situat dedesubt și asociat cu acesta, care se numește strat mascat. Dacă ceva este desenat în masca de strat, atunci orice umplere a acestui desen devine o parte transparentă a stratului. Dacă animați o imagine creată într-o mască de strat, partea transparentă a măștii se va deplasa pe ecran. O mască de strat poate masca mai multe straturi. Puteți face un strat obișnuit masabil schimbându-i poziția în stiva de straturi. Trebuie doar să trageți stratul obișnuit sub masca de strat cu mouse-ul. Selectați primul cadru și deschideți panoul Proprietăți, selectați Mișcare; Să începem animația. Un buton este un tip special de simbol conceput pentru a răspunde la acțiunile utilizatorului, de exemplu, apăsarea butonului în sine, a omologul său de la tastatură sau a unei zone active dintr-un film. Hit este starea normală pentru un buton care conține un link pe care utilizatorul l-a vizitat deja; De exemplu, să creăm un buton cu animație încorporată folosind algoritmul de mai jos: Acest obiect este publicat în modul HTML cu un link către fișierul swf corespunzător. Să creăm butoane care controlează prezentarea de diapozitive: Pe (lansare) ( GotoAndStop(k); — numărul dintre paranteze indică numărul cadrului corespunzător. Pornit (apăsați) ( GotoAndStop(„începe)”; Pornit (apăsați) ( Root.prevFrame(); Pornit (apăsați) ( Root.nextFrame(); Pornit (apăsați) ( GotoAndStop("sfârșit"); Mai jos este rezultatul muncii noastre: Când creați animații folosind ActionScript, este adesea folosită o buclă cu trei cadre. În primul cadru (pregătire) se scriu datele inițiale, în cel de-al doilea cadru sunt plasate elementele corpului buclei, iar în al treilea cadru se scrie comanda de revenire la al doilea cadru gotoAndPlay (2); Operația unei bucle cu trei cadre este de a vizualiza alternativ cadrele care participă la buclă până când este îndeplinită condiția de ieșire din buclă. Să ne uităm la utilizarea unui ciclu cu trei cadre folosind exemplul de creare a mișcării măștii. Filmul nostru va fi format din trei straturi: <маскируемый клип>.setMask(<клип-маска>) Vom atașa scriptul obișnuit gotoAndPlay (2) la cel de-al treilea cadru; De fiecare dată când se accesează al doilea cadru, clipul Mask se va roti cu 2°. O fereastră în formă de clip Mask se rotește în fața ochilor utilizatorului, prin care o parte a clipului Mask este vizibilă. Să învățăm cum să controlăm culoarea unei instanțe de clip de bibliotecă. Să creăm un film în care, pe fundalul soarelui răsărit, stelele se rotesc în direcții diferite, schimbându-și culoarea. <имя экземпляра объекта Color>O instanță a unui obiect Color este creată folosind un constructor în ActionScript și are următorul format:<имя экземпляра клипа>) Un exemplu de script pentru Star1 este dat mai jos: OnClipEvent(încărcare) ( Star1Color = culoare nouă (aceasta); ColorTransform = (rb:0, gb:255, bb:255); G = 255; B = 255; Pasul = 5; OnClipEvent(enterFrame)( G -= pas; ColorTransform.gb = g; Dacă (r >=0 && b == 255 && g == 0) ( R+= pas; ColorTransform.rb = r; Dacă (g == 0 && r == 255 && b B -= pas; ColorTransform.bb = b; Dacă (b == 0 && r == 255 && g >=0) ( G -= pas; G += pas; Dacă (g == 255 && b == 0 && r R+= pas; R -= pas; Dacă (r == 0 && g == 255 && b>=0) ( B -= pas; B += pas; Aceasta._rotație -= 3; Butoanele și meniurile sunt una dintre cele mai importante părți ale unui site web sau ale oricărei alte aplicații în care interactivitatea este importantă. Să creăm un meniu Flash. pe (lansare) (getURL("1.html", "_self");) Ca prim pas în crearea unei animații în mișcare, creăm un strat separat pentru aceasta (regula „fiecare obiect animat are un strat separat” rămâne în vigoare). Apoi, într-un cadru cheie gol al acestui strat (un astfel de cadru poate fi creat apăsând tasta F7 oriunde în strat), plasăm sau creăm un obiect de animație: un grup, un bloc de text sau o instanță de simbol. La o distanță suficientă de-a lungul liniei cadrului (calcul simplu: rata de cadre înmulțită cu secunde. Adică, dacă animația durează 3 secunde, trebuie să găsiți al 36-lea cadru), folosind tasta F6, creați o copie a acestui cadru cheie. Aceasta va fi faza finală a animației. Editând modificări ale locației, mărimii, proporțiilor sau orientării obiectului de animație în acest cadru cheie, obținem faza finală a animației. Mai multe tipuri de editare „profundă”, de exemplu, folosind modul de editare de grup sau folosind comanda de meniu „Split”, nu sunt permise. Fazele de început și de sfârșit ale animației trebuie să provină de la același obiect. Să trecem la primul cadru cheie făcând clic în celula cadru. În panoul de proprietăți, selectați „Animation - Motion” din listă. Această alegere, după cum se poate observa clar în Fig. 7.3, setează imediat între cadrele cronologiei la violet și apare o săgeată care conectează începutul și sfârșitul animației. Dacă apare o linie întreruptă în loc de săgeată, înseamnă că ceva a fost greșit și, cel mai probabil, nu va exista animație. Chiar dacă animația funcționează, evident că se va bloca mai târziu. Iată câteva motive pentru eroare: există un obiect nepotrivit în cadru (de exemplu, doar o imagine negrupată), „rămășițele” unor obiecte sunt păstrate în cadru, mișcarea este aplicată, de exemplu, la două grupuri simultan . Uitați-vă la panoul cu proprietățile cadrului: dacă există un buton triunghiular galben cu un semn de avertizare (!), atunci Flash încearcă să vă spună despre o eroare.
Când selectați „Mișcare” în panoul de proprietăți, se deschid setări suplimentare pentru „animația în mișcare” (Fig. 6 4). Puteți schimba poziția centrului de rotație folosind instrumentul Transformare liberă. Să facem obiectul să se miște într-un cerc. Asta este. Să vedem (testăm) filmul. Dacă este necesar, vom face modificări. Da, vom face. Și acestea sunt următoarele: la un moment dat obiectul nostru trebuie să se micșoreze și apoi să revină la dimensiunea inițială. Pentru a face acest lucru: Puteți crea interpolari de mișcare în două moduri: Pentru a anima mișcarea utilizând comanda meniului contextual, efectuați următoarele acțiuni: Dar de foarte multe ori este imposibil să descrii mișcarea prin mișcarea în linie dreaptă. Cu animația de mișcare descrisă, în orice caz, obiectele noastre se deplasează de-a lungul segmentelor drepte între cadrele cheie (sau o curbă este destul de dificil de stabilit). Dacă aveți nevoie să vă deplasați pe o traiectorie complexă, în principiu, puteți împărți această mișcare într-o masă de piese individuale și... obțineți o animație care este aproape de cadru cu cadru. Cu toate acestea, există situații în care aceasta este singura cale de ieșire. Dar există o altă modalitate - de a stabili traiectoria mișcării. Pentru aceasta, se folosește un strat special care controlează mișcarea: un ghid pe care este trasată o linie - un ghid sau o traiectorie de mișcare. Pentru a face un obiect să se miște pe o anumită cale, trebuie să efectuați următorii pași. Există două greșeli principale atunci când direcționați un obiect pe o anumită cale: elevii nu ancorează obiectul în al doilea cadru cheie sau linia de ghidare are mici întreruperi (vizibile doar la mărire mare). Să mai facem un mini-exercițiu - mișcând un creion pe hârtie. Pentru a face acest lucru: Vă rugăm să rețineți: calea obiectului este invizibilă în modul de testare a filmului și nu va fi vizibilă în filmul terminat. Dacă doriți să vedeți traiectoria în film, trebuie să o copiați și să o lipiți pe orice alt strat (vizibil) (există o comandă „Lipire pe loc” în meniul de editare). Asta este! Am studiat elementele de bază ale animației automate în Flash. Tot ce rămâne este să te familiarizezi cu tehnici mai complexe pentru a deveni adevărați profesioniști. Ca prim pas în crearea unei animații în mișcare, creăm un strat separat pentru aceasta (regula „fiecare obiect animat are un strat separat” rămâne în vigoare). Apoi, într-un cadru cheie gol al acestui strat (un astfel de cadru poate fi creat apăsând tasta F7 oriunde în strat), plasăm sau creăm un obiect de animație: un grup, un bloc de text sau o instanță de simbol. La o distanță suficientă de-a lungul liniei cadrului (calcul simplu: rata de cadre înmulțită cu secunde. Adică, dacă animația durează 3 secunde, trebuie să găsiți al 36-lea cadru), folosind tasta F6, creați o copie a acestui cadru cheie. Aceasta va fi faza finală a animației. Editând modificări ale locației, mărimii, proporțiilor sau orientării obiectului de animație în acest cadru cheie, obținem faza finală a animației. Mai multe tipuri de editare „profundă”, de exemplu, folosind modul de editare de grup sau folosind comanda de meniu „Split”, nu sunt permise. Fazele de început și de sfârșit ale animației trebuie să provină de la același obiect. Să trecem la primul cadru cheie făcând clic în celula cadru. În panoul de proprietăți, selectați „Animation - Motion” din listă. Această alegere, după cum se poate observa clar în Fig. 7.3 setează imediat între cadrele cronologiei la violet și apare o săgeată care conectează începutul și sfârșitul animației. Dacă apare o linie întreruptă în loc de săgeată, înseamnă că ceva a fost greșit și, cel mai probabil, nu va exista animație. Chiar dacă animația funcționează, evident că se va bloca mai târziu. Iată câteva motive pentru eroare: există un obiect nepotrivit în cadru (de exemplu, doar o imagine negrupată), „rămășițele” unor obiecte sunt păstrate în cadru, mișcarea este aplicată, de exemplu, la două grupuri simultan . Uitați-vă la panoul cu proprietățile cadrului: dacă există un buton triunghiular galben cu un semn de avertizare (!), atunci Flash încearcă să vă spună despre o eroare. Orez. 7.3. Cronologie cu scenariu de animație în mișcare Când selectați „Mișcare” în panoul de proprietăți, se deschid setări suplimentare pentru „animația în mișcare” (Fig. 6 4). Orez. 7.4. Panoul de proprietăți atunci când selectați interpolari de mișcare Puteți schimba poziția centrului de rotație folosind instrumentul Transformare liberă. Să facem obiectul să se miște într-un cerc. Asta este. Să vedem (testăm) filmul. Dacă este necesar, vom face modificări. Da, vom face. Și acestea sunt următoarele: la un moment dat obiectul nostru trebuie să se micșoreze și apoi să revină la dimensiunea inițială. Pentru a face acest lucru: Puteți crea interpolari de mișcare în două moduri: o utilizarea panoului de proprietăți cadrului; o folosind comanda „Creare animație în mișcare” din meniul contextual făcând clic dreapta pe cadru. Pentru a anima mișcarea utilizând comanda meniului contextual, efectuați următoarele acțiuni: o Desenați sau introduceți orice obiect într-un cadru cheie. o Faceți clic dreapta în celula primului cadru și selectați comanda „Creare motion tween” din meniul contextual. În acest caz, întreaga imagine din cadru va fi convertită automat într-un simbol grafic cu numele „Clădire animație1” (un cadru albastru de evidențiere și un punct de ancorare vor apărea în centrul cadrului). o Creați ultimul cadru cheie din animația de mișcare și mutați și transformați obiectul. Pentru a seta traiectoria mișcării, se folosește un strat special care controlează mișcarea: un ghid pe care este trasată o linie - un ghid sau o traiectorie de mișcare. Pentru a face un obiect să se miște pe o anumită cale, trebuie să efectuați următorii pași. 17. Creați cadre cheie cu pozițiile inițiale și finale ale obiectului, setați animația în mișcare între ele. 18. Faceți clic dreapta pe numele stratului care conține animația în mișcare. În meniul contextual, selectați „Adăugați un ghid” sau faceți clic pe pictograma corespunzătoare din stânga jos. 19. Ca urmare, în lista de straturi va apărea un nou strat, marcat cu o pictogramă specială (Fig. 7.5), iar numele stratului de animație se va muta la dreapta - semn că acest strat a devenit sclav. strat. 20. Faceți clic pe numele stratului de ghidare pentru a-l activa. 21. În cadrul cheie al acestui strat, utilizați orice instrument de desenare a conturului pentru a desena traiectoria mișcării obiectului. Această linie nu trebuie să conțină secțiuni care se intersectează, întreruperi și nu ar trebui să fie închisă. 22. Selectați cadrele cheie de animație și setați în panoul cu proprietăți ale cadrului (activarea animației în mișcare): 23. „Orientați de-a lungul căii”, dacă trebuie să orientați axa de simetrie a obiectului de-a lungul liniei de ghidare; 24. „Snap”, deoarece trebuie să legați punctul de înregistrare al obiectului de ghidul de mișcare (Fără acest parametru, obiectul nu va dori să se miște de-a lungul curbei!). Testează filmul. Orez. 7.5. Crearea căilor de mișcare Există două greșeli principale atunci când direcționați un obiect pe o anumită cale: elevii nu ancorează obiectul în al doilea cadru cheie sau linia de ghidare are mici întreruperi (vizibile doar la mărire mare). Să mai facem un mini-exercițiu - mișcând un creion pe hârtie. Pentru a face acest lucru: Vă rugăm să rețineți: calea obiectului este invizibilă în modul de testare a filmului și nu va fi vizibilă în filmul terminat. Dacă doriți să vedeți traiectoria în film, trebuie să o copiați și să o lipiți pe orice alt strat (vizibil) (există o comandă „Lipire pe loc” în meniul de editare). Asta este! Am studiat elementele de bază ale animației automate în Flash. Tot ce rămâne este să te familiarizezi cu tehnici mai complexe pentru a deveni adevărați profesioniști. Exemple de întrebări pentru control 8. Lucrări practice: Bărbați dansați: Viața este mișcare. Poți anima bile, cercuri, dreptunghiuri, linii și alte forme... Dar haideți să ne asumăm o sarcină grandioasă: faceți „omulețul” să se miște (să danseze). Ce trebuie să știți și să puteți face pentru a finaliza sarcina: să poată utiliza instrumente de desen, să poată edita obiecte vectoriale, să cunoască elementele de bază ale creării de animație cadru cu cadru și animație în mișcare.
Pot exista multe opțiuni pentru trecerea de la o formă la alta, astfel încât animația poate lua calea care ți se potrivește într-o măsură mai mică. Chiar și transformarea unei figuri geometrice atât de simple ca dreptunghi situat vertical în același dreptunghi situat orizontal poate avea loc în moduri diferite. De exemplu, în timpul procesului unei astfel de transformări, o figură poate deveni sub forma unui oval sau chiar a unui cerc. Pentru a controla procesul de animație, trebuie să încercați să simplificați animația prin împărțirea desenelor în mai multe fragmente independente situate în straturi diferite, dar participând simultan la animație. O tehnică mai coordonată este utilizarea semnelor de formă, care au fost discutate mai sus.
Mai jos este un exemplu al acestei metode de animație de „transformare” a unui elefant într-o oaie și înapoi.
în noul cadru cheie, mai întâi ridicați o aripă a fluturelui și apoi a doua;
Mai jos este un fișier GIF animat care folosește animația formei literelor textului „La mulți ani”, iar apoi textul care apare este „șters” folosind o mască de strat, un dreptunghi cu umplere în gradient, astfel încât efectul de se obține litere „iridescente”. Fundalul este un fragment de grafică raster.
Dacă trebuie să creați mai multe butoane identice, atunci în acest caz este suficient să creați un singur șablon de buton. Și apoi aplicați inscripțiile necesare pe el, schimbați culoarea sau dimensiunea.
Urmărire — afișează mesaje când sunt efectuate acțiuni;
Algoritm pentru crearea unui buton pentru a accesa pagina Web specificată:
Algoritm pentru crearea unui buton pentru a opri un clip:
Scripturi cu ActionScript
Orez. 7.3.Exemple de întrebări pentru control
