ALKUOPAS FLASHIIN. 1. Johdantoa Flashiin

Transkriptio

1 1 ALKUOPAS FLASHIIN 1. Johdantoa Flashiin Flash on www-sivujen, multimedian ja animaation tuottamiseen tarkoitettu ohjelma, joka käyttää hyväkseen vektorigrafiikan ominaisuuksia. Flash ei ole rajoittunut HTML-kielen rajoitteisiin. Flashilla voit tuottaa myös laadukasta ja monipuolista mediasisältöä vaikkapa webbiin tai erilaisiin esityksiin. Flashin sisältämät monet erilaiset ominaisuudet antavat tekijälle vapaat kädet tuottaa grafiikkaa, web-sivustoja, interaktiivisia kokonaisuuksia tai vain yksinkertaisia navigointipalkkeja, presentaatioita, portfolioita, julisteita, pelejä, interaktiivisia oppaita, yksittäisiä sovelluksia, myynti- ja markkinointiesityksiä Flash-tekniikka perustuu vektorigrafiikkkaan, mutta esityksiin voidaan tietysti tuoda eli importoida bittikarttagrafiikkaa eli kuvia. Tietysti flashiin pystyy tuomaan myös mediatiedostoja, kuten ääntä ja videota ja voihan sitä itsekin piirtää, kirjoittaa tai siirtää elementtejä leikepöydän kautta. ActionScript on ohjelmointikieli, jonka avulla Flash -esitystä voi ohjata, kontrolloida sen tapahtumia sekä reagoida käyttäjän toimiin. ActionScriptin perusteiden osaaminen helpottaa ja tehostaa Flashilla työskentelyä merkittävästi. Tällä kurssilla käytämme ActionScript versiota 2 (AS2). Flash-esitykset voidaan katsella sellaisilla laitteilla, joissa on Flash-selainlaajennus eli flash-plugi. Tämä mainio plugi on ehkä laajimmin levinnyt selainlaajenne ja sen voi tietysti ladata ilmaiseksi Adoben sivuilta. Nykyään (2011) täyttä flassiä voi katsella myös kännyköillä, joissa on Android 2.2 käyttis.

2 2 Flashin tiedostoformaatit Flash-työskentelyssä meillä on kaksi tiedostoformaattia: työtiedosto, jossa sisältöä luodaan ja käsitellään, päätteenä.fla sekä esitystiedosto, varsinainen juklkaistava flash-tiedosto, päätteenä.swf. Termejä Näyttämö (stage) - varsinainen työskentelyalue. Joka kohtauksella on oma näyttämönsä, jolla näkyy sillä hetkellä aikajanalla aktiivisena olevan kehyksen mukainen sisältö Aikajana (timeline) - esityksen etenemistä kuvastava liikejana. Sillä työskennellään kehysten ja kerrosten kanssa. Aikakursori näyttää missä aikajanan kehyksessä mennään Kehys (frame) - aikajanalla oleva yksittäinen frame, esitys etenee ja liikkuu kuljettaessa kehyksestä toiseen (oletusnopeus 12 fps eli kehystä sekunnissa). Avainkehys (keyframe) Avainkehys merkitsee muutosta, liikkeen alku- tai päätepistettä. Tavallinen kehys on avainkehysten välissä. Kohtaus (scene) - esitys voi sisältää useita (määrää ei rajoitettu) kohtauksia, jotka tallennettaessa liitetään yhteen. Sisällön tuottaminen yksinkertaistuu kun kokonaisuus jaetaan osiin. Symbolit ovat kirjastoon tallennettuja yleensä interaktiivisia elementtejä, graafisia symboleja, painikkeita tai elokuvaleikkeitä. Äänet ja bittikarttakuvat lisätään kirjastoon, vaikka ne eivät ole varsinaisia symboleja. Symboleja voi käyttää moneen kertaan. Motion Tween ohjelmallinen animointi, jolla voidaan animoida objektin paikkaa, kokoa, pyörimistä, läpinäkyvyytta ja väritystä. Taso (layer) tasojen pinoamisjärjestyksestä riippuu, mikä näkyy minkin objektin päällä tai alla. Objekteja ja liikettä on helppo sijoittaa päällekkäin, täysin toisistaan riippumatta. Jokainen liikkuva objekti kannattaa sijoittaa omalle tasolleen. On olemassa joitakin erikoistasoja kuten ohjaus- ja maskitaso. Hyödyllisiä näppäinyhdistelmiä - julkaise (testaa): omppu + Enter - lisää väliframe: F5 - lisää keyframe: F6 - lisää tyhjä keyframe: F7 - muuta symboliksi F8 - ActionScript-ikkuna: F9 - library-ikkuna: F11 - undo ctrl-z - poista frame tai useita :shift F5

3 3 2. Flash-käyttöliittymä Flash-ohjelman työtila sisältää paljon kelluvia ikkunoita. Kelluvina ikkunoina toimivat niin työkalurivit, paneelit, scripti-ikkuna, kirjasto ym. Kaikkien työkalujen ei tarvitse olla nähtävillä kaiken aikaa, vaan valitse oletusnäyttöön ne, joita tulet todennäköisimmin tarvitsemaan. Pienen kokemuksen jälkeen tiedät jo, mitä paneeleja omassa työssäsi eniten käytät. Yläreunasta löydät alasvetovalikot komentineen ja vasemmassa reunassa työkaluvalikko. Flashin käyttöliittymän paneelit ovat kelluvia ja voit siirrellä niitä, muuttaa niiden kokoa ja avata / sulkea niitä tarvittaessa. Suljetun paneelin saat avattua Windows-valikon kautta. Kuvassa on numeroitu seuraavat paneelit: 1. Stage eli näyttämö. Flash-esitys koostetaan tähän. Valkoinen alue on esityksen koko. Elementtejä voi sijoittaa myös harmaalle alueelle ja tuoda niitä esim. animaatiolla stagelle. 2. Layerit eli tasot. Flash-esityksen elementit tuodaan omille tasoilleen. Tasot kannattaa nimetä tason tarkoituksen mukaan. Flash-esityksellä ylemmällä tasolla olevat elementit näkyvät päällimmäisinä. Tasojen paikkaa voidaan vaihtaa hiirellä vetämällä. 3. Timeline eli aikajana. Esitys etenee aikajanaa pitkin frame (yksi ruutu aikajanalla) kerrallaan niin, että kaikki eritasoilla saman framen kohdalla olevat symbolit näkyvät yhtäaikaa. Oletuksena on, että 12 ruutua on yksi sekunti, joten 24 ruudun kohdalla on kulunut 2 sekuntia esityksen alusta. 4. Properties eli ominaisuudet-paneeli. Kun aktivoit symbolin flash-esityksessä stagella esim. hiirellä klikkaamalla, avautuu k.o. symbolin ominaisuudet properties-paneelissa. Tässä kuvassa on näkyvillä flash-

4 esityksen ominaisuudet, jossa voit muuttaa esim. esityksen kokoa (tässä size: 550 x 400 pixels), taustaväriä (background) tai montako framea esitetään sekunnissa (tässä 12 framea / sek.). 5. Library eli kirjasto. Kaikki objektit kuten kuvat, äänet, videot, symbolit tulevat kirjastoon, josta ne voidaan tuoda useampia kertoja flash-esitykseen. Flash varaa muistia kuitenkin vain kirjastossa olevan symbolin verran, vaikka käyttäisit samaa symbolia samanaikaisestikin monta kertaa stagella. Kun symboli tuodaan kirjastosta esitykseen, saa se oman ilmentymän eli instanssin, jolloin sille voidaan antaa omia erlaisia ominaisuuksia (esim. läpinäkyvyys, koko, väri). Symbolin ilmentymä voidaan myös nimetä (instance name) yksilöllisesti, jolloin siihen voidaan kohdistaa komentoja action scriptin avulla. Symboleja voidaan muokata symbolien muokkaustilassa, johon pääsee esim. kaksoisklikkaamalla symbolin edessä olevaa kuvaa kirjastossa. Tämä muokkaus kohdistuu kaikkiin k.o. symbolin instanceihin esityksessä. 6. Color Mixer värien säätöön ja liukuvärien ja kuviotäytteen luontiin 4 3. Aikajana Frame rate kertoo, millä nopeudella elokuvaa tällä hetkellä ajetaan. Yksikkönä on fps (frames per second) ja oletusnopeus on 12 fps eli 12 kehystä sekunnissa. Nopeutta voi muuttaa tarpeen mukaan.toistonopeuden vieressä kerrotaan käytetty kokonaisaika (Elapsed time) josta on helppo seurata esityksen ajallista kestoa. Kehyksenkeskityspainike (Center Frame) keskittää toistopään kohdalla olevan kehyksen keskelle aikajanaa (ei fyysistä muutosta, vain aikajanan vieritys)

5 5 Aikajanan freimien näkymään voidaan vaikuttaa aikajanaikkunan oikeassa yläkulmassa olevan kehysnäkymäpainikkeen avulla: Kehyksen leveys (tiny small normal medium large) Short (pienentää kehyksen korkeutta 20%, jos käytössä useita tasoja, kaikkien korkeus pienennetään) Tinted Frames (erityyppisten kehysten näyttäminen eri väreillä, esim. liike- tai muotoanimaatiokehykset) Preview (tasoilla olevan grafiikan esikatselu kehyksissä) Preview in context (tasoilla olevan grafiikan esikatselu suhteessa kokonaisuuteen l. skaalattuna koko näyttämöön) Tasot Tasot voivat olla eri pituisia, mutta esitystä ajettaessa tasoja toistetaan päällekkäin. Tasojen tilaa voit itse määrittää pienillä painikkeilla, jotka sijaitsevat tasoluettelon oikeassa ylälaidassa. Tason voi piilottaa näkyvistä esim. silloin, kun teet tarkkaa työtä johon et tarvitse muiden tasojen objekteja ja haluat yksinkertaistaa näyttämön tilannetta hetkellisesti. Jokaisen tason voi lukita jottei sitä pääse vahingossa muokkaamaan. Tämä on hyödyllistä opetella heti aluksi, sillä taso aktivoituu automaattisesti kun aktivoit sillä olevan objektin. Kun näyttämö on täynnä objekteja eri tasoilla, saatat helposti tehdä vahingossa muutoksia väärälle tasolle. Lukitse siis taso aina silloin kun et työskentele sillä! Ääriviivatilassa tasolla olevat objektit näkyvät näyttämöllä ääriviivoina. Jokaisella tasolla on oma tunnusvärinsä jolla ääriviivat piirretään, joten eri tasojen elementit on helppo tunnistaa. Kynän kuvake tasorivillä kertoo aktiivisen tason, jolla tällä hetkellä työskentelet. Samoin aktiivinen taso näkyy mustana muiden näkyessä harmaina.

6 6 4. Työkalut ja niiden asetukset Tools-työkalurivin alaosassa näkyy Options-työkalurivi. Options pitää sisällään kulloinkin aktiivisena olevan työkalun mahdolliset asetukset. Työkalut nimettynä kuvasta riveittäin ja vasemmalta oikealle * Valintatyökalu (Selection tool) - snap, smooth, straighten * Alavalinta (Subselect tool) - muotoviivan ankkuripisteiden muokkaus * Free Transform Tool (koon muutos, kierto, jne) / Gradient Transform Tool (kuvatäytön asetukset) * 3D Rotation / 3D Translation Tool (AS3 ja elementin oltava symboli) * Lasso (Lasso tool) - epäsäännöllisen alueen valinta yksinkertaisen muodon sisältä, magic wand properties, polygon (monikulmion valitseminen yksinkertaisen muodon sisältä * Bezierkynä vektoripiirtoon (Pen tool) * Tekstityökalu (Text tool) * Viivatyökalu (Line tool)- ominaisuudet piirtopaneelissa * Muototyökalu (Rectangle/Oval/Polystar Tool) * Kynätyökalu (Pencil tool) vapaa piirto, asetukset straighten smooth ink * Sivellin / spray (Brush/Spray Brush Tool) - toimintatapa (Brush mode): Paint normal, Paint fills, Paint behind, Paint selection, Paint inside * Deco Tool - tehosteiden luomiseen * Bone / Bind Tool (objektien linkittämiseen 3D-animaatioissa) * Paint Bucket / Ink Bottle Tool. Maalikannutäytön ominaisuuksien muuttaminen: ominaisuudet Gap size, Lock fill, * Eyedropper Tool - Pipettinäyte objektin täyttöväristä tai viivan tyylistä, jota halutaan käyttää muualla * Pyyhekumi (Eraser Tool), Eraser mode: normal fills lines selected inside, Faucet(hana) = voit poistaa täyttöjä tai viivoja napsauttamalla poistettavaa kohdetta (toimii kuten Delete * Hand Tool (tartuntatyökalu, esim. vierittämiseen) * Zoom Tool (työalueen zoomaus) * Stroke Color (viivan väri) * Fill Color (täyttöväri)

7 7 5. Flashin objektit Piirretyt objektit Flashillä voidaan piirtää sisältää kahdentyyppisiä elementtejä: yksinkertaisia muotoja (shape): siveltimen veto, täyttö tai piirtotyökaluilla luotu muoto, mikä tahansa graafinen elementti, jota voidaan muokata yksittäin. Ne sijaitsevat tason pohjalla ja niitä voidaan leikata toisilla muodoilla, kuten seuraavassa kuvassa. piirto-objektit: Objektit sijoittuvat aina tasolla yksinkertaisten muotojen päälle päälle. Piirto-objektit eivät leikkaa toisiaan kuten muodot, vaan ne pinoutuvat päällekkäin, ja niiden järjetystä voidaan muuttaa. Tekstit Flash-dokumenttiin voidaan lisätä staattista- dynaamista- ja input-tekstiä. Staattine teksti on perustekstielementti ja sen tekstityyppiä, kokoa, väriä ja rivivälistystä jne on mahdollista muotoilla. Staattiselle tekstille voi kehittää erilaisia animaatioita ja muita efektejä. Staattinen tässä yhteydessä tarkoittaa sitä että teksti on muuttumatonta ja pysyy sellaisena dokumentin luomisen jälkeen kun dokumentista on julkaistu Flash-tiedosto. Staattisen tekstin lisäksi muita tekstityyppejä Flashissa ovat dynaaminen teksti jolloin tehdään tekstikenttä, johon teksti tuodaan jostain muusta lähteestä, sekä lomakkeissa ja vastaavissa käytetyt input-tekstit. Symbolit Symboleita on kolmentyyppisiä: Graafiset symbolit: Graafisen symbolin aikajanalle voi luoda sisältöä kuten pääesitykseenkin, mutta äänet ja interaktiiviset toiminnot eivät toimi graafisen symbolin aikajanalla. Se soveltuu parhaiten elementteihin, joissa ei esitetä liikettä, mutta sitä voidaan käyttää esityksessä useita kertoja. Painikkkeet : interaktiivisia, reagoivat osoittimen liikkeeseen, painikkeisiin voidaan liittää erilaisia toimintoja

8 Painikesymbolin aikajanalla on neljä kehystä: Up, Down, Over ja Hit * Up - painikkeen kuvake, kun hiiri ei ole painikkeen päällä * Over - Kehys näytetään, kun osoitin on painikkeen päällä * Down - Kehys näytetään, kun hiirtä napsautetaan painikkeen kohdalla * Hit - Osuma-alue, jolla painike vastaa osoittimen liikkeeseen (jos ei määritelty, käytetään edellisen avainkehyksen muotoa Movieclipit: voi sisältää interaktiivisia toimintoja, ääniä ja muita elementtejä kuten pääesitys. Movieclipillä on oma aikajana, joka etenee itsenäisesti riippumatta pääesityksen. Niitä voidaan ohjelmoida actionscriptillä monipuolisesti. Mite sitten niitä symboleja tehdään: * voit muuntaa jo olemassaolevan objektin symboliksi (Insert - Convert to Symbol eli F8) * voit aloittaa tyhjästä sen tekemisen (Insert - New Symbol) * jos haluat tehdä toisen, vain hieman jo olemassa olevasta symbolista poikkeavan symbolin, kannattaa käyttää monistamista: valitse ensin symboli, klikkaa hiiren oikean puoleista näppäintä ja lopuksi klikkaa Duplicate 8 Bittikarttakuvat Importilla tuodut kuvat menevät kirjastoon ja niitä voidaan käyttää useastikin. Kirjasto Käytetyt objektit kannattaa konvertoida symboleiksi symbolikirjastoon Kirjastosta symboli voidaan noutaa esitykseen useampana esiintymänä eli ei aiheudu turhaa tiedoston koon kasvua. Symbolin muokkaaminen kirjastossa välittää muutokset kaikkiin jo käytettyihinkin esiintymiin, mutta jokaista esiintymää voi muokata myös erikseen. Esim. metsä on helppo tehdä yhdestä puu-symbolista, jonka esiintymiä käännetään, kokoa muokataan, tummuuksia vaihdellaan. Symbolikirjastossa symbolit on helppo lajitella kansioihin esim. käyttötarkoituksen tai esityskohdan mukaan.

9 9 Kansiojaottelua kannattaa käyttää, sillä symbolikirjastoon tallentuvat paitsi itse tehdyt symbolit, myös kaikki tuotu grafiikka, äänet jne. Symbolikirjastossa näet symbolin kuvakkeesta heti, minkä tyyppinen symboli on kyseessä. Symbolin muokkaaminen Symbolin luominen ja muokkaaminen ovat mahdollisia symbolin editointi näkymässä. Olemassa olevan symbolin editoiminen onnistuu kaksoisnapauttamalla symbolia joko näyttämöllä tai symbolikirjastossa. Symbolinäkymä on hyvin samannäköinen kuin normaali näyttämö, jokaisella symbolilla on oma aikajana (painikkeilla hieman erinäköinen kuin muilla) joten siirtyminen symbolin muokkaustilaan tapahtuu helposti vahingossa, jopa huomaamatta. Ole siis tarkkana! Työtilan voi tarkistaa elokuvaikkunan aikajanan alapuolelta: Symbolin nimi näkyy aktiivisena silloin, kun olet sen editointitilassa. Poistuminen tästä tilasta takaisin kohtauksen käsittelemiseen tapahtuu napsauttamalla kohtauksen nimeä.

10 10 6. Esityksen asetukset Flash-projektia aloitettaessa on määritettävä esityksen toistonopeus ja esityksen koko. Tiedot kannattaa määrittää heti työtä aloitettaessa sillä asetusten muuttaminen kesken kaiken vaikuttaa jo tehtyyn työhön. Esityksen asetukset löydät valikosta Modify-Document tai Properties-paneelista. Frame Rate - esityksen toistonopeus. Fps (frames per second) eli montako kehystä ajetaan sekunnissa. Oletusarvo 12 fps, joka on hyvä oletusarvo ainakin kurssin alkuharjoituksissa. Dimensions/Size - Esityksen leveys ja korkeus pikselimittoina. Background Color - Esityksen taustaväri eli näyttämön väri. näyttämön väriä kannattaa käyttää hyödyksi esityksessä, mikäli on tarkoitus peittää koko näyttämö objekteilla. Julkaiseminen Valmiin projektin julkaiseminen tapahtuu File-Publish-komennolla tai näppinyhdistelmällä omppu + Enter. File-Publish Settings -ikkunassa voit parametroida julkaistavan flashin asetuksia. Publish Settings -ikkunassa voit rastittaa haluamasi vaihtoehdot ja nimetä tiedostot toivomallasi tavalla. Oletusarvoisesti tiedostot nimetään työtiedoston mukaan. Valitessasi julkaisumuotoja ikkunaan ilmestyy lisää välilehtiä jotka sisältävät julkaisumuotojen asetukset. Julkaisu tapahtuu oletusarvoisesti samaan kansioon jossa työtiedosto sijaitsee.

11 11 7. Symbolien luominen Painikkeet Painikkeet ovat symboleita, jotka reagoivat osoittimen liikkeeseen. Katsoja voi niiden avulla vaikuttaa esitykseen ja ohjata sitä. Painikkeeseen voidaan liittää monia erilaisia toimintoja, jotka määritellään Action Script-tapahtumina. Painikesymbolin luominen alkaa samoin kuin tavallisenkin symbolin, valitsemalla Insert - New Symbol. Painikkeita luotaessa käytössä on tavallisesta poikkeava aikajana, joka sisältää neljä kehystä: Up - kehyksen sisältö näytetään kun painike on ylhäällä, ts. normaalitilassa. Over - kehyksen sisältö näytetään silloin kun osoitin on painikkeen päällä Down - kehyksen sisältö näytetään kun hiiren painiketta napsautetaan painikkeen päällä Hit - kehyksessä määritellään painikkeen osuma-alue, ts. minkä kokoisella ja muotoisella alueella napsautus luetaan painikkeeseen osuneeksi. 1. Aikakursori on aloittaessasi valmiiksi kehyksessä Up. Piirrä työkaluilla haluamasi muotoinen ja värinen painike tai tuo vaikka bittikartta 2. Halutessasi painikkeen muuttavan muotoaan kun osoitin siirtyy sen kohdalle, aktivoi Over-kehys ja paina F6 (luo normaalisti avainkehyksen). Luo nyt edellisen painikkeen tilalle haluamasi muoto. 3. Toimi samoin Down-kehyksessä mikäli haluat painikkeen edelleen muuttavan muotoaan sitä napsautettaessa. 4. Mikäli haluat painikkeen toimivan muun kokoisella ja -muotoisella alueella kuin se itse on, määrittele alue normaalein piirtotyökaluin kehyksessä Hit. HUOMAA! että mikäli jätät jonkin kehyksen "käyttämättä", sen kohdalla noudatetaan edellisen kehyksen toimintoa. Ts. mikäli jätät Hit-kehyksen tyhjäksi, osuma-alueena toimii Down-kehyksessä määritelty painike. Mikäli jätät Overkehyksen tyhjäksi, osoittimen osuessa painikkeeseen se pysyy samanlaisena kuin Up-kehys sen määrittelee. Movieclipit Elokuvaleike luodaan kuten mikä tahansa symboli, valikosta Insert-Symbol. Anna symbolille nimi ja valitse tyypiksi Movie Clip. Huomaat, että käytössäsi on aivan samanlainen työskentelyalue kuin pääesityksessä. Movieclippi luodaan aivan samalla tavalla kuin esityskin, luoden avainkehyksiä ja haluttuja tapahtumia.

12 12 8. Animaatiot Animaatiota saadaan aikaan, kun asetetaan peräkkäin frameja, joiden sisältö poikkeaa toisistaan vain hiukan. Avainkehykset (keyframe) määrittävät, milloin muutos tapahtuu Animaatiomenetelmiä: Frame to frame-animaatio, jolloin jokaista kehystä muokataan yksittäin. Animoinnin tarkka ohjaaminen mahdollista, mutta aikaa vievää. Vrt. piirrosanimaatio, hiekkaanimaatio.. Tween-animaatio, jolloin määritetään animaation ensimmäisen ja viimeisen kuvan muoto ja paikka. Flash laskee ja muodostaa automaattisesti välissä olevat kehykset. Animoitavan elementin on oltava symboli tai ryhmä. Shape- eli muotoanimaatiolla voidaan muuttaa objektin muotoa, väriä, läpinäkyvyyttä, kokoa ja paikkaa. Animaatio kykenee vain yksinkertaisten muotojen muuttamiseen ts. ei ryhmiä, symboleita tms. Liikkeenohjaustason (Guide Layer) luominen Liikkeenohjaustasoa kannattaa käyttää silloin kun jokin elementti liikkuu tiettyä haluttua reittiä pitkin. Taso sisältää polun tai viivan, jota pitkin elementti liikkuu. Liikkuva objekti voi olla staattinen tai animoitu. Voit luoda jo olemassaolevan tason liikkeenohjaustasoksi tai vaihtoehtoisesti luoda kokonaan uuden liikkeenohjaustason jolloin se linkitetään liikkuvan elementin sisältävään tasoon. Maskitaso Maskitasot on tehty piilottamaan alla oleva tai olevia tasoja. Kaikki mitä piirrät maskitasolle, puhkaisee reiän maskiin. Maski tehdään omalle tasolleen (mask layer). - kun maskattava (peitettävä) taso on valittuna, niin tee sen yläpuolelle uusi taso, piirrä siihen jotain ja muuta sen tyypiksi hiiren oikealla painikkeella mask. Piirrettyyn kohtaan tulee reikä, josta maskattava taso näkyy.maskaus näkyy vasta kun testaat esityksen (control/test movie) tai lukitset sekä maski, että maskattavan tason.

13 13 9. Action Script Komennon lisääminen Painikkeista yksin ei ole paljonkaan iloa ennen kuin niihin liitetään jokin toiminto, siirtymä tms. Action Scripttoiminnot on helppo liittää ja määritellä. Painikkeiden lisäksi ActionScriptiä voidaan lisätä myös keyframeihin ja movieclippeihin. Hiiritapahtumat on(press) kun käyttäjä napsauttaa hiirtä kuvakkeen päällä on(release) kun käyttäjä vapauttaa hiiren napsautettuaan kuvaketta on(releaseoutside) käyttäjä painaa painiketta ja vapauttaa hiiren painikkeen ulkopuolella on(rollover) käyttäjä siirtää painikkeen kuvakkeen päälle on(rollout) käyttäjä siirtää osoittimen pois kuvakkeen Näin lisäät komennon - Aktivoi haluamasi painike tai keyframe - Laajenna Actions-paneeli tai klikkaa symbolia hiiren oikealla painikkeella ja valitse Actions Yleisimmät komennot Esityksen hallinta stop() esim. on(press) { stop(); } gotoandstop() esim. on(release) { pysäyttää aikajanalla liikkuvan toistopään siirtyy annettuun frameen ja siirtymisen jälkeen pysähtyy

14 gotoandstop(15); } gotoandplay() esim. on(press) { gotoandplay(15); } play esim. on(press) { play(); } geturl() esim. on(release) { geturl (" } loadmovie() esim. on(release) { loadmovie ("hahmo.swf", 20); } siirtyy annettuun frameen ja jatkaa toistoa käynnistää keskeytetyn liikkeen aikajanalla aloittaen seuraavasta kehyksestä linkki www-sivuun lataa muita swf-esityksiä tai kuvia emo -esitykseen. Uusi esitys voi korvata nykyisen tai se voidaan ladata osaksi nykyistä. 14 unloadmovie() esim. on(release) { unloadmovie (20); } poistaa esityksen FlashPlayeristä

15 Äänet Flashissa Äänien nauhoittaminen ei mahdollista Flashissa, vain tuominen, joten nauhoittaminen tai luominen on tehtävä jollakin audio-ohjelmalla. Mahdolliset tiedostotyypit wav, aiff ja mp3 (QuickTime mahdollistaa myös muita formaatteja) Ääni tulee osaksi toteutustiedostoa, tiedostot pysyvät kohtuullisina kun äänet ovat MP3-muodossa Ääniraidan tuominen tapahtuu valitsemalla File - Import. Äänitiedosto sijoittuu automaattisesti kirjastoon. Kirjastosta voidaan käyttää joko koko äänitiedostoa tai vain sen osia toistuvasti esityksen eri osissa eli esitystiedoston koko ei kasva merkittävästi. Äänet kannattaa sijoittaa omalle kerrokselleen työskentelyn helpottamiseksi, vaikka se ei välttämätöntä olekaan (vrt. actionit). Ääniä voi liittää normaalisti myös painiketapahtumiin. Flash sisältää joitakin valmiita ääniraitoja, löydät ne valitsemalla Window - Common Libraries - Sounds Painiketapahtumaäänet Painikeäänet toistetaan silloin kun painiketoiminnossa on niin asetettu. Kun haluat äänen kuuluvat esim. silloin kun painiketta napsautetaan, sijoita ääni painikkeen muokkaustilassa Down-kehykseen. Ääniasetusten määritteleminen Ominaisuudet saat näkyviin kun olet käyttänyt esityksessä vähintään yhtä ääniraitaa: Ominaisuudet löytyvät Properties-paneelista kun äänen esiintymäpaikka on aktiivinen (esim. kehys) Äänet (Sound) - luettelo Flashiin tuoduista äänistä Äänitiedot - alkuperäisen äänen näytteenottotaajuus, resoluutio, toistoaika ja tiedoston koko Tehosteet (Effect) - valmiiksi määriteltyjä aanenohjaustehosteita (none: ei mitään, Left Right Channel: vasen/oikea kanava, Fade Left to Right Right to Left: häivytys kanavasta toiseen, Fade In Out: voimista/hiljennä vähitelleen: Custom: omat tehosteet) Synkronointitapa (Sync) - ääniesiintymän käsittely (Event: tapahtumaohjattu ääni, alkaa toistua kun aikajana kohtaa avainkehyksen, jolle ääni on asetettu, lyhyille äänille, Start: useita saman äänen esiintymiä voidaan käynnistää päällekkäin, jos saman äänen toinen esiintymä jo toistuu, tämä pysäyttää aikaisemman ja aloittaa uuden, Stop: kun useita eri äänien esiintymiä toistuu samanaikaisesti, voit lopettaa niitä tällä asetuksella, Stream: äänivirta, varmistaa että muut kerrokset pysyvät tahdissa ääniraidan kanssa, voi hypätä joidenkin animaatiokehysten yli. Äänivirta pysähtyy aina kun esitys pysähtyy) Toistokerrat (Loop) - kuinka monta kertaa ääni toistuu alusta loppuun Muokkaus (Edit) - valintaikkuna, jossa voidaan säätää äänenvoimakkuutta, äänenvoimakkuustehosteita ja toiston kestoaikaa Ääniraidan editointi Edit-ikkunassa Jokaisen ääniesiintymän asetukset voidaan säätää erikseen. Näin samaa ääniraitaa voidaan käyttää esityksessä useaan kertaan eri tavoilla. Ääniraidan käsittelyyn pääset napsauttamalla Sound-paneelista Edit-painiketta.

16 16 Valittu ääni näkyy digitaalisessa muodossa, vasen ja oikea kanava erikseen. Äänen kuva näkyy vasemmalta oikealle ja ohjausviivat kertovat millä voimakkuudella ääntä missäkin kohdin toistetaan. Tehosteet - sisältää valmiiksi määriteltyjä helppokäyttöisiä tehosteita joita voit käyttää joko sellaisenaan tai työskentelyn aloituspohjana. Aikajana - Aikajanalla voit tarkastella äänen kestoa sekunteina tai kehyksinä. Aikajanan alussa on pieni äänen aloituksen osoitinpalkki ja aikajanan lopussa lopetuspalkki. Näitä siirtämällä voit vaikuttaa ääniesiintymän aloitus- ja lopetuskohtaan. Tällä tavoin voit toistaa eri kohdissa esitystä eri pätkiä samasta ääniraidasta. Ohjauskahvat - Ohjausviiva siis ilmaisee äänen voimakkuutta esiintymän eri kohdissa, ohjauskahvoilla ohjataan ko. viivoja. Oletusarvoisesti ääniesiintymässä on valmiina yksi kahvaa esityksen alussa. Voit lisätä lisää ohjauskahvoja napsauttamalla haluamasi kanavan alueella vasenta näppäintä. Ohjauskahvan siirtäminen onnistuu vetämällä sitä hiiren vasen painike alhaalla. Ohjauskahvan voit poistaa esiintymästä vetämällä sen kanava-alueen ulkopuolelle. HUOM! Tapahtumaohjattu ääni toistuu niin kauan kuin sille on määritelty toistokertoja, vaikka esitys loppuisi tätä ennen.

17 Esityksen rakentaminen useammasta tiedostosta Flash- esitys voidaan rakentaa lataamalla swf-tiedostoja tai kuvatiedostoja (.jpg,.gif,.png) emoesityksen päälle. Ladattavan tiedoston paikka määrätään asettamalla haluttuun paikkaan tyhjä movieclippi (pointteri). Ladattavan tiedoston vasen yläkulma sijoittuu tähän kohtaan. Tyhjälle movieclipille on annettava instannsi-nimi, johon latauskoodissa viitataan. esim. loadmovie("tuotteet.swf", pointer_mc); loadmovie("kuva1.jpg", osoitin_mc); Latauskoodi voidaan sijoittaa painikkeeseen tai frameen. esim. on (release) { loadmovie("nelio.swf", _root.sisaltopointer_mc); }

18 Flash-videon tekeminen Vaiheet: 1. Kuvaus: Kuvataan video videokameralla, kännykällä tms. välineellä 2. Siirretään video tietokoneelle editointi ohjelmaan 3. Editoitaan ja exportataan tiedosto levylle

19 19 4. Avataan tiedosto Adobe Media encooderissa, jossa se pakataan.flv-videoksi, joka taas voidaan linkittää flashpresentaatioon. 5. Parametroidaan encoodattava video settings ikkunasta ja sitten encoodaus start queue -painikkeesta 6. Lisää video flash-esitykseen File/Import/Import video 7. Valitse controlleri eli skini 8. Kun tallennat flashin ja julkaiset sen siten, että saat myös html-tiedoston niin sinulla on seuraavat tiedostot