Page 1

Flash technologijos 1 dalis

Dalia VisockienÄ— MarijampolÄ—


Kompiuterinė grafika • Taškinė (rastrinė, bitmap) – vaizdas sudarytas iš taškų. Didinant vaizdą taškai išryškėja. Formatai: BMP, JPG, GIF, TIFF, PNG, PSD ir kt. • Vektorinė (vector) – vaizdas sudarytas iš vektorių. Todėl kokybė nenukenčia, kai didinamas vaizdas. Formatai: EPS, CDR, DWG, FLA, SWF ir kt.


FLASH

• Adobe (iki 2005 m. Macromedia) produktas; • Vektorinės grafikos redaktorius; • Dvimatės (2D) grafikos redaktorius; • Interaktyvios (animacijos) grafikos redaktorius; • “Programuojamosios (ActionScript) grafikos redaktorius”.


Adobe Flash CS3 Professional

• Tai 9-oji programos versija


Adobe CS3

! Numatyta patogi kit킬 CS3 rinkinio program킬 integracija


Formatai • FLA – gimtasis programos formatas. Šiuo formatu išsaugoti dokumentai gali būti atveriami su programa Flash. Pastaba. Negalėsite atverti naujesnės versijos failų su senesnės versijos Flash, todėl saugodami pasirūpinkite tinkamos versijos pasirinkimu. • SWF – specialus peržiūrai skirtas formatas. Peržiūrai reikia atitinkamos versijos Flash Player (jis dažnai integruotas į naršykles, todėl SWF formato failus galime peržiūrėti naršyklėje).


F l a s h technologija

Taikoma interaktyvių multimedija (daugialypės terpės) produktų kūrimui. Tai gali būti: 1. 2. 3. 4. 5. 6. 7.

Animacija (“filmukai”) CD pateiktys Nuotraukų albumai Interneto reklama (baneriai) Žaidimai (kitos paskirties programos) WEB svetainės bei kt. paskirties produktai


Macromedia Flash CS3 naujovės – Ryšys su kitomis CS3 programomis (integracija); – Nauji įrankiai, pvz. naujos įrankių savybės; – Nauja ActionScript 3.0 versija – Įterpti automatizuoti efektai; – ir kt.


F l a s h (reikia žinoti, kad) • • • • •

Vektorinės grafikos redaktorius Dvimatės grafikos redaktorius Dinaminės grafikos redaktorius Bylų formatas *.FLA Palaiko formatus: – Importui: FLA, SWF, MOV ir kt. animacinius GIF, JPG, PNG, BMP ir kt. taškinius WAV, MP3 ir kt. – Eksportui: SWF (HTML), GIF, JPG, MOV, EXE


Programos aplinka

Spalvinių užpildų langas

Įrankiai

Spalviniai užpidai Aktyvaus įrankio savybės

Dokumento biblioteka

Savybių langas

Nuorodos į naudingas komandas


Programos aplinka (kai atvertas dokumentas)

Timeline – sluoksnių ir kardų valdymo langas Dokumento simbolių biblioteka Dokumento scenų biblioteka

Dokumento langas


Programos aplinkos tvarkymas Workspace

• Meniu Window pateikiamos komandos, skirtos pagalbinių langų valdymui. • Naujame CS3 rinkinyje sujungiamos atskirų programų naudingos ir patogios galimybės, tokiu būdu, programoje Flash CS3 atsiranda Workspace sąvoka.


Default Workspace

• Ďprasta Flash programoms aplinka


Icons and Text Default

• Bendras CS3 programoms stilius


Icons Only Default


Naujo dokumento savybės • Sukūrus naują dokumentą, pirmiausia reikėtų nustatyti dokumento savybes:

Modify/Document [CTRL+J]

Kadrų keitimo greitis fps – frame per second

Arba savybių juostoje (kai įjungtas žymėjimo įrankis Selection Tool ir “niekas nepažymėta”)


Spalvos, užpildai • Įrankių juostoje galima pasirinkti fono ir kontūro spalvinius parametrus, kuriuos perims vėliau naudojami įrankiai • Lange Color pateikiama daugiau pasirinkimo ir redagavimo variantų


Vektorinės grafikos kūrimo pagrindai • Naujų vektorinių objektų formavimui skirtas įrankių rinkinys Tools. • Šio rinkinio įrankiais galima formuoti naujus ir redaguoti anksčiau suformuotų objektų savybes. • Pasirinkus įrankį, jo savybės pateikiamos įrankių juostos dalyje Options ir savybių juostoje Properties, pvz:


Pencil Tool [ Y ]

• Pieštukas • Savybės:

Lygina Glotnina Palieka tokias pat

Savo forma panašias į apskritimą ar stačiakampį kreivę automatiškai performuoja, pvz.:


Line Tool [ L ], Pen Tool [ P ]

atkarpos

“Beze” kreivės


Rectangle Tool [ R ] Oval Tool [ O ] Stačiakampių formavimas

Formavimo metu nuspaudus SHIFT

Elipsių formavimas


Selection Tool [ V ]

Fonų, kontūrų, sričių žymėjimas Pelės kursorius, priklausomai nuo jo padėties kitų objektų atžvilgiu gali būti: Žymėti (foną, kontūrą, su SHIFT – pratęsiamas žymėjimas) “Pagauti” kontūro “kraštinį” tašką “Pagauti” objekto kontūrą Atlikti kelių objektų ir jų dalių žymėjimą (kurios patenka į žymimą sritį)


Ryšys tarp objektų • Dedant Shape tipo objektus vienas ant kito atliekamas sujungimas ir atskyrimas (connection and segmentation)

Pastaba. Objekto fonas ir kontūras – atskiri objektai


Objekto dalies žymėjimas įrankiais Selection Tool [V], Lasso Tool [L]

• Įrankius: Selection Tool [V] Lasso Tool [L] • Galime naudoti vaizdo dalių žymėjimui, pvz.:


Išeitys, norint išvengti sujungimo

1. Grupuoti objektus Modify/Group [ CTRL+G] Grupė “išardoma”: 1. Modify/Ungroup [CTRL+SHIFT+G] 2. ModifyBreak Apart [CTRL+B]

2. Formuojant objektus naudoti režimą Object Drawing [J] 3. Objektus išdėstyto skirtinguose sluoksniuose


Užpildai

• Kadangi objektų fonas ir kontūras yra atskiri objektai, galimas lankstus ne tik pačių objektų, bet ir sričių tarp jų (jei susiformuoja uždara sritis) užpildymas fonu, ar kontūro keitimas. Paint Bucket Tool [ K ] Ink Bootle Tool [ S ]

Eyedropper Tool [ I ] Fono ir kontūro atpažinimo įrankis

Gradient Transform Tool [ F ] – galime transformuoti pustonių ir taškinį užpildus


Taškiniai užpildai

• Taškiniai užpildai yra įkeliami iš išorinių resursų (taškinių grafinių failų) ir patalpinami dokumento simbolių bibliotekoje. • File/ Import/ Import to Library


Tikslumą užtikrinančios priemonės

• Būna situacijų, kai formuojant vaizdą, reikia užtikrinti tikslumą: – Tvarkingai išdėstyti objektus; – Patalpinti objektus tikslioje dokumento vietoje; – Ir pan.


Tikslumą užtikrinančios priemonės • Objektų traukos režimas – Snap to Objects • Liniuotės – View/Rulers • Tinklelis – View/ Grid / Show Grid [CTRL+’] Edit Grid [CTRL+ALT+G] • Nurodomosios linijos – View/Guides / Show Guides [CTRL+;] Lock Guides [CTRL+ALT+;] Edit Guides [CTRL+ALT+SHIFT+G] • Kiti traukos režimai - View / Snapping


Objekto savybių keitimas • Pažymėtą objektą galime redaguoti:

• Window/Info [CTRL+I] • Window/Transform [CTRL+T]


Objektų lygiavimas, rikiavimas

• Window/Align [CTRL+K]


Animacija

• Animacijos principas – vaizdų kaita skirtinguose kadruose Filmuko trukmė – 18 kadrų

Užpildytas Tuščias Raktinis kadras

Tuščias kadras “Užpildytas” kadras

Atkarpa, kuriai taikomas metodas Shape

“Aktyvus” kadras


Animacija

Pakeitimai atliekami nuo raktinio kadro iki raktinio kadro

• Insert/Timeline/Frame [F5] – ‘paprasto’ kadro įterpimas • Insert/Timeline/Keyframe [F6] – raktinio kadro įterpimas • Insert/Timeline/Blank Keyframe – tuščio raktinio kadro įterpimas


PaprasÄ?iausia animacija

Rezultatas


Animacijos peržiūra

Jei dokumente sukurta animacija, realizuojama atskiruose kadruose, galime peržiūrėti animaciją tokias būdais: 1. Dokumento redagavimo lange: pažymėję 1 kadrą ir vykdydami komandą Control/Play [ENTER] 2. Animacijos peržiūros lange: vykdydami komandą Control/Test Movie [CTRL + ENTER]


Pavyzdys Išskrenda paukščiai (faile pauksciai.gif)

Realizuokime naudodami įrankį Brush Tool [B]


Animacijos saugojimas

• Gautą animaciją siūloma saugoti programos gimtuoju formatu FLA


Animacijos saugojimas kitais formatais (eksportas)

– File/Publish Settings – File/Publish

– File/Export/ Export Image… Export Movie…


“Sudėtinga” animacija

• Jei norite sukurti “sudėtingą” animaciją, kai vienu metu animuojami skirtingi objektai, kiekvieno objekto animaciją realizuokite skirtinuose sluoksniuose.


Pavyzdys

Faile pauksciai_debesys.exe


Simboliai

• Programoje numatyta trijų tipų simbolių kūrimas, juos išsaugant simbolių bibliotekoje. • Insert/New Symbol [CTRL+F8]


Simbolių tipai

• Movie Clip • Graphic • Button


Simbolio redagavimo aplinka

Simbolio pavadinimas

Registracijos taškas

Dokumento simbolių biblioteka


Mygtuko tipo simbolis

Reagavimo sritis Įprastinė mygtuko būsena Paspaudus ant mygtuko Užvedus pelės kursorių ant mygtuko


Kitas simbolių kūrimo būdas

• Jei vėliau paaiškėjo, kad dėl tam tikrų priežasčių reikėjo sukurti simbolį, turimą objektų rinkinį galima konvertuoti į simbolį: – Pažymėti; – Vykdyti komandą Modify/Convert to Symbol [F8]


Simbolių biblioteka

• Visi dokumento simboliai patalpinami dokumento simbolių bibliotekoje • Window/Library [CTRL+L] Simbolio kontekstinis meniu


Simbolių naudojimas • Mygtukų (Button) simboliai – animacijos valdymui (programuojant); • Graphic – susiejamas su pačios animacijos scenos būsena; Movie Clip – nepriklausomai nuo situacijos scenoje, vykdo savo veiksmų ciklą; • Pastaba. Jei simbolyje saugomas viename karde saugomas vaizdas, techniškai galima teigti, kad nėra jokio skirtumo ar jis Graphic ar Movie Clip tipo.


Simbolių naudojimas • Simbolius galime naudoti animacijoje ir kituose simboliuose, juos įkeldami (įtempiant pele) iš dokumento simbolių bibliotekos. Atliekant pakeitimus simboliui, jie automatiškai keičiami visose naudojamose simbolio kopijose. • Pastaba. Simbolių biblioteka saugoma kartu su dokumentu, kas įtakoja failo dydį. Todėl bibliotekoje tikslinga palikti tik naudojamus animacijoje simbolius.


Simboliams būdingos savybės

• Simboliai, skirtingai nei grafiniai objektai turi spalvines savybes:

Ryškumas

Spalva

Skaidrumas


Metodas Motion • •

Simbolių arba sugrupuotų objektų animacijos metodas, skirtas laipsniškam simbolio (arba sugrupuotų objektų) judėjimui. Pvz. norime sukurti krentančio kamuoliuko animacijos siužetą. Sprendimo būdai: 1. Sukurti raktinių kadrų rinkinį, juose pavaizduojant vis kitoje dokumento vietoje esantį kamuoliuką, tai imituojant kritimą; 2. Sukurti du raktinius kadrus: pirmame patalpinti kamuoliuką pradinėje vietoje, paskutiniajame – žemiausiame kritimo taške, kadrų atkarpai nuo pirmo iki priešpaskutinio kadro taikyti metodą Motion.


Metodas Motion


Metodo Motion savybės

Pagreitėjimas Sulėtėjimas

Sukimosi efektas: CW – pagal laikrodžio rodyklę CCW – prieš laikrodžio rodyklę


Metodo Motion klaidingas veikimas

• Metodas Motion gali būti nesėkmingai taikomas ir neduoti laukiamo efekto. Tokiu atveju:

• Galimos priežastys: – Raktiniuose kadruose nesugrupuoti objektai, arba ne simbolis. – Reiktų vadovautis principu – viename sluoksnyje metodu Motion animuojamas vienas simbolis arba viena objektų grupė.


Judėjimas keliu

• •

Metodas Motion gali būti taikomas “judėjimo keliu” animacijos automatizuotam formavimui. Judėjimas keliu realizuojamas 2-juose (arba 3-juose) sluoksniuose: 1. Simbolio sluoksnis, kuriame simboliui taikysime metodą Motion 2. Specifinis kelio sluoksnis (Guide) 3. Kelio sluoksnio kopija, jei norime, kad kelias matytųsi.


Judėjimas keliu 1

• Sukuriame sluoksnį, kuriame patalpiname simbolį, pvz.:


Judėjimas keliu 2 •

Sluoksniui sukuriame specifinį sluoksnį Guide (sluoksnio kontekstiniame meniu vykdome komandą Add Motion Guide), kuriame formuojame kelią;

Kelią galime formuoti įrankiu


Judėjimas keliu 3

• Sukuriame animacijos kadrus, pvz.:

Šiame pavyzdyje animacija trukmė 25 kadrai, kuri 12 fps greičiu truks ~2 sekundes. Simbolio sluoksnyje būtinai Sukurkite raktinį kadrą


Judėjimas keliu 4 •

Simbolio sluoksnio atkarpai, nuo pirmo iki antro raktinio kadro, taikome metodą Motion su savybe Orient to path


Judėjimas keliu 5

• Simbolį “prilipdome” prie kelio pradžios ir pabaigos atitinkamuose raktiniuose kadruose, pvz.:


Rezultatas

Matome, kad sluoksnyje Motion Guide suformuoto kelio nematome


Judėjimas keliu * •

Jei norime, kad kelias būtų matomas animacijos demonstravimo metu, sukuriame dar vieną sluoksnį, kuriame patalpiname kelio kopiją. Norint kopiją patalpinti toje pačioje vietoje vykdykite komandą Paste in Place


Praktinis pavyzdys

• Sukurkite animaciją, taikant metodą Motion siužetui

Pavyzdys faile mergyte.exe


Pavyzdžio realizavimui reikės:

• Simbolio “mergyte”:

• Simbolio “debeselis”:


Animacijos sluoksniai

Debeselis - metodu Motion slenka skaidrus debesÄ—lis Medis Guide:mergyte Mergyte - metodu Motion, taikant savybÄ™ Orient to path juda mergytÄ— Miskas


Sluoksnis miskas

Iš jo kopijuojame į sluoksnį medis

Jame įrankiu suformuojame kontūrą, nereikalingas dalis pašaliname, o reikiamą dalį perkeliame į sluoksnį Guide:mergyte


Užduotėlės

• “Kadravimas” – Pavaizduoti augalo augimą; – Eina (“vietoje”) žmogeliukas;

• Metodas Motion – Iš patrankos iššauna sviedinys, lekia į objektą, atsitrenkus – sprogimas. – Aplink saulę sukasi žemė;


Išmokime  

Flash pamokos

Advertisement
Read more
Read more
Similar to
Popular now
Just for you