Reklámgrafika

Page 1/1

Reklámgrafika

Juhász Ferenc

Tartalomjegyzék Tartalomjegyzék .........................................................................................................2 1. El!szó .................................................................................................................5 2. Bevezetés ............................................................................................................5 2.1. Reklámgrafika.............................................................................................6 2.2. Reklám az Interneten ..................................................................................7 2.3. Piackutatás ..................................................................................................9 2.3.1. Keres! motorok...................................................................................9 2.3.2. Szövetséges kezelés ..........................................................................10 2.3.3. Media vásárlás ..................................................................................10 2.3.4. Honlaptervezés..................................................................................10 2.3.5. Fogyasztóvédelem.............................................................................10 2.3.6. Ellen!rz! kérdések............................................................................11 3. A Flash 5...........................................................................................................12 3.1. Vektorgrafika ............................................................................................12 3.2. Alapvet! fogalmak....................................................................................13 3.2.1. Kocka, kulcskocka ............................................................................13 3.2.2. Réteg .................................................................................................14 3.2.3. Szimbólumok, könyvtár....................................................................14 3.2.4. Jelenet ...............................................................................................15 3.2.5. Ellen!rz! kérdések............................................................................15 3.3. A Flash felhasználói felülete.....................................................................15 3.3.1. A színpad (Stage)..............................................................................16 3.3.2. Az id!vonal (Timeline).....................................................................17 3.3.3. Indítópult (Launcher bar)..................................................................18 3.3.4. Eszközsávok (Toolbars)....................................................................18 3.3.5. Panelek (Panels)................................................................................18 3.3.6. Könyvtár (Library)............................................................................19 3.3.7. Filmintéz! (Movie Explorer) ............................................................19 3.3.8. Ellen!rz! kérdések............................................................................20 3.4. Grafikák készítése.....................................................................................20 3.4.1. A nyíl ................................................................................................22 3.4.2. A ceruza (Pencil) ..............................................................................23 3.4.3. Az ecset (Brush)................................................................................23 3.4.4. A toll (Pen) .......................................................................................23 3.4.5. Fehér nyíl (Subselect) .......................................................................24 3.4.6. Tintásüveg (Ink Bottle) .....................................................................24 3.4.7. Festékesvödör (Paint Bucket) ...........................................................24 3.4.8. Pipetta (Dropper) ..............................................................................25 3.4.9. Radír (Eraser)....................................................................................25 3.4.10. Kéz (Hand)........................................................................................25

2

3.4.11. Zoom ................................................................................................ 25 3.4.12. Ellen!rz! kérdések ........................................................................... 25 3.5. Szöveges objektumok............................................................................... 25 3.5.1. Ellen!rz! kérdések ........................................................................... 26 3.6. Objektumok tulajdonságainak megváltoztatása ....................................... 27 3.6.1. Takarási sorrend ............................................................................... 28 3.6.2. Transzformáció (Transform) ............................................................ 28 3.6.3. Igazítás ............................................................................................. 29 3.6.4. Csoportosítás és feloldása................................................................. 30 3.6.5. Széttördel, elszakít (Break Apart) .................................................... 30 3.6.6. Színek ............................................................................................... 31 3.6.7. Színminták........................................................................................ 32 3.6.8. Ellen!rz! kérdések ........................................................................... 32 3.7. Szimbólumok, példányok ......................................................................... 32 3.7.1. Közös könyvtár................................................................................. 34 3.7.2. Ellen!rz! kérdések. .......................................................................... 34 3.8. Animáció .................................................................................................. 34 3.9. Köztesmozgás (Motion Tween) ............................................................... 35 3.9.1. Mozgásvezérl! (Motion Guide) ....................................................... 37 3.9.2. Maszk használata.............................................................................. 37 3.10. Köztes alakváltozás (Shape Tween) ..................................................... 38 3.10.1. Regisztrációs pont áthelyezése átméretezéskor ................................ 38 3.10.2. Objektumok közötti átalakulás ......................................................... 39 3.11. Interaktív mozik ................................................................................... 39 3.11.1. Nyomógomb..................................................................................... 39 3.11.2. Moziklipek ....................................................................................... 41 3.11.3. Animáció moziklippé alakítása ........................................................ 41 3.12. Tesztelés, mentés, publikálás ............................................................... 41 3.13. Hagymahéj tesztüzemmód ................................................................... 42 3.14. Action Script ........................................................................................ 42 3.14.1. Képkockához rendelhet! ActionScript kód ...................................... 43 3.14.2. Nyomógomb események, amelyekhez ActionScript kód rendelhet! 43 3.14.3. Moziklip események, amelyekhez ActionScript kód rendelhet!...... 44 4. Gyakorlatok...................................................................................................... 46 4.1. Rajzoljunk Napot...................................................................................... 46 4.2. Fogd és vidd ............................................................................................. 47 4.3. Átalakuló szöveg ...................................................................................... 49 4.4. Aktív nyomógomb.................................................................................... 50 4.5. URL.......................................................................................................... 50 4.6. Animált gomb létrehozása........................................................................ 51 4.7. Pásztázó fényforrás................................................................................... 53 4.8. Villanó logo.............................................................................................. 54 4.9. Körök........................................................................................................ 56

3

4.10. Golyók ..................................................................................................57 4.10.1. Megállítható és elindítható golyó......................................................57 4.10.2. Példa moziklip alkalmazására...........................................................58 4.10.3. Példa moziklipbe ágyazott moziklipre..............................................60 4.11. Mez! .....................................................................................................62 4.12. Hóesés...................................................................................................63 5. Irodalom............................................................................................................67

4

Reklámgrafika

Bevezetés

1. El!szó A segédlet a Gábor Dénes F!iskola azonos cím" tantárgyának tananyagát tartalmazza. Támaszkodik a számítógépes grafikával kapcsolatos fogalmakra, feltételezi azok ismeretét. Mégis, ha a jobb megértés úgy kívánja, a tárgyalás során felmerül! fogalmak leglényegesebb vonatkozásait röviden összefoglaljuk. A segédlet tartalmilag és formailag meg kíván felelni nemcsak a nappali, hanem a távoktatás követelményeinek is. Ezt a célt szolgálják a fejezetek végén lév! ellen!rz! kérdések, továbbá a könnyebb elsajátítást el!segít! figyelmeztet! jelölések

! " #

Számítógép használható. Súlyponti rész. Aprólékos, figyelmes áttanulmányozást igényl! anyagrész. Kiegészít! ismeretek. $ Megoldandó írásos feladat. % A tananyaghoz tartozó el!adásvázlatok, mintapéldák és egyéb oktatási segédanyagok a f!iskola honlapjáról letölthet!k. 2. Bevezetés A reklám a modern fogyasztói társadalom egyik nélkülözhetetlen mozgatója. Számos hátrányos tulajdonsága ellenére az élet nem képzelhet! el nélküle. Intenzív élményt nyújtva megragadja a néz! figyelmét. Érdekes hatásokat alkalmaz, gyakran a túlzásoktól sem riad vissza. A sikeres hirdetések szövege gyakran beépül a köztudatba. A reklámok hordozói igen változatos képet mutatnak, a képek mellett tárgyak, irodalmi szövegek, zene is hordozhat reklámtartalmat.

5

Reklámgrafika

Bevezetés

A reklám f!bb felhasználási területei: Cégreklám Termékreklám Közérdek" reklám A reklámok sikeréhez nagyban hozzájárul a célcsoport szokásainak, igényeinek az ismerete. Általában egyetlen ötlet köré épül. A reklám üzenetét az ezen ötlet köré csoportosított képek, hangok, feliratok, animációk közvetítik a néz!höz. Ezek közül talán a képi információk hatnak legintenzívebben a néz!re. 2.1. Reklámgrafika A számítógépes grafika három f! területe az International Standards Organization (Nemzetközi Szabványügyi Szervezet) fogalomgy"jteménye szerint: generatív számítógépes grafika (interactive computer graphics) számítógépes képfeldolgozás (image processing) alakfelismerés, képelemzés (picture analysis) A reklámgrafika a vizuális kommunikáció egy tömör, szuggesztív formája. Lényegét tekintve a generatív grafikához, azaz a képeket emberi beavatkozás által létrehozó grafikához tartozik, de esetenként a képfeldolgozás eszközeit is igénybe veszi. Megjelenési formája igen változatos: Szórólap, ismertet!, prezentáció, tárgyak Plakátok: kisméret", városi, óriás, gigant Fényreklám: fényújság, tet!reklám Média reklám: újságokban, televízióban, az Interneten A XIX század mutatványosai, kikiáltói fontos szerepet játszottak a kor termékeinek népszer"sítésében. A XX században szerepüket a televíziós reklám és a termékbemutatók vették át. Ezen mozgalmas látványosságok megfelel!je az Interneten az animációs reklám.

6

Reklámgrafika

Bevezetés

2.2. Reklám az Interneten A legutóbbi id!ben a hagyományos reklámok mellett egyre nagyobb tért hódít magának az Internetes reklám. Miután 1991-ben a National Science Foundation feloldotta a hálózat üzleti használatának tilalmát, majd 1995-ben vissza is vonult a területr!l, alapvet! változások indultak el az Internet életében. A hálózat évenkénti növekedése meghaladta a 300 százalékot. Az üzleti világ felfigyelt a sok látogatót vonzó keres!kre, majd kés!bb a szintén egyre népszer"bb portálokra. 1995-ben a Wired Internetes magazin "feltalálta" a hirdetési szalagot (banner). A felhasználók számának drasztikus növekedése vonzó hirdetési felületté tette a legforgalmasabb honlapokat. Az Internet további elterjedésével egyre több tartalomszolgáltató ismerte fel az új technológia adta lehet!ségeket a vásárlóer! manipulálásában. A reklámszakmának fel kell ismernie, hogy az Interneten más törvényszer"ségek érvényesülnek, mint a hagyományos reklámok piacán. Míg egy újság olvasottsága jól mérhet! az eladott példányok számával, addig egy honlap olvasottságát kevésbé jellemzi annak látogatottsága: a látogatottság mér!száma pusztán technikai eszközökkel is növelhet!. A f! különbség a hagyományos és az Internetes reklám között abban rejlik, hogy az utóbbiban jóval nagyobb szerep jut a közönségnek, az esetek többségében ugyanis ! dönt arról, hogy egy bizonyos hirdetést meg óhajt-e tekinteni vagy sem. Egy másik szempont a reklám tartalmának megnövekedett szerepe. Nagyon sok sikeres honlap a sikerét az Interneten kívül alapozta meg. A tapasztalatok azt mutatják, hogy ahhoz, hogy egy cég az Internet segítségével váljon sikeressé, nem árt, ha eredeti szolgáltatás ötletével

7

Reklámgrafika

Bevezetés

áll el!, vagy egy meglév! piac megszerzését a legels!k között kísérli meg. A helyzet bonyolultságát csak fokozza, hogy az Interneten nem teljesen kialakult még a szolgáltatásért való fizetés mechanizmusa. A legtöbb felhasználó ma is az ingyenes szolgáltatásokat keresi. Jól jellemzi ezt az Interneten keresztül zajló zene-kereskedelem (mp3fájlok letöltése, cseréje) teljesen kezdetleges állapota. A hirdetésekb!l származó bevételekre csak a legnagyobbak alapozhatnak: újságok honlapjai, internetszolgáltatók, keres!oldalak. Ennek ellenére vannak kísérletek kisebb honlapok hirdetésekre alapozott fenntartására is.

8

Reklámgrafika

Bevezetés

2.3. Piackutatás Az új évezredben a cégek sikeres tevékenységéhez egyre inkább nélkülözhetetlen az Interneten való megjelenés. Az Internet szükségessé tesz egy folytonos és intelligens piackutatást. A piackutatás a legfontosabb összetev!je a honlap sikerének. Ma már nem elegend! elkészíteni egy honlapot és bejelentkezni néhány keres! helynél. A folyamatos és konzisztens piackutatást nem lehet semmi mással helyettesíteni. Kell! odafigyelés hiányában a versenytársak azonnal elfoglalják piaci pozícióinkat. Ezért a piackutatásnak több arculatúnak és fogyasztó-központúnak kell lenni. A piackutatást végz!knek tisztában kell lenni a következ!kkel: keres! motorok, szövetséges kezelés, média vásárlás, honlaptervezés, fogyasztóvédelem. 2.3.1. Keres! motorok Keres! motorok használatánál nem elegend! megfelel! kulcsszavak hozzáadása a honlapokhoz. A sikerhez nagyban hozzájárul: a honlaphoz vezet! küls! linkek számának gyarapítása, a kulcsszavak kiválasztásánál olyan szavak felvétele, amelyek a legkülönösebb keresési szokásoknál is felmutatják a honlapot, az egyensúly megtalálása a kulcsszavak száma és el!fordulása között, a keres!motorok találati listájának elemzése, alkalmas domain nevek vásárlása,

9

"

Reklámgrafika

Bevezetés

2.3.2. Szövetséges kezelés A kifejezés azt jelenti, hogy a cég egy piackutatója (nem egy program) a világhálón bolyongva megpróbál kapcsolatba kerülni más honlapokkal abból a célból, hogy egyezségek alapján egymás forgalmát kölcsönösen növeljék. Ez jelentheti linkek cseréjét, levelezési listák egyesítését, tartalmak cseréjét, hírcsoportok elérhet!vé tételét, egymást népszer"sít! cikkeket, stb. 2.3.3. Media vásárlás Fontos, hogy a legjobb formában a legalkalmasabb honlapon jelenjen meg a reklámozott termék. A sikerhez nélkülözhetetlen, hogy eljusson a célközönséghez a termékr!l szóló üzenet. 2.3.4. Honlaptervezés Mint ahogy minden áruházban a dizájn és a vásárlás menetének könny" volta, úgy minden eladással és reklámozással foglalkozó honlapnál kulcsfontosságú szempont a könny" kezelhet!ség és az esztétikus megjelenés. A honlapok tervezésénél a marketing elemeket esztétikusan be kell csomagolni. 2.3.5. Fogyasztóvédelem A mai honlapoknak két fontos feladata van: a vásárlás hatékonnyá tétele, továbbá információgy"jtés a potenciális vásárlókról. A fogyasztók kiszolgálása könny" volt, amikor még új volt a világháló. Napjainkban azonban a feladatok egyre b!vül! sorát rója a világhálón jelenlév! cégre. Az ügyfelek mindegyike kitüntetett elbánást vár. Ennek leghatékonyabb eszköze napjainkban a honlap által a fogyasztóval folytatott e-mail dialógus. Az alkalmas technológia kiválasztásával az ügyfél kitüntetettnek érezheti magát, úgy érezheti, hogy vásárlását szándéka szerint bonyolíthatja.

10

Reklámgrafika

Bevezetés

Jelenleg az Internetez!k kb. 1 százaléka használja vásárlásra a világhálót. A növekedést testre szabott, egyedi szolgáltatásokkal, és min!ségi ügyfélszolgálattal lehet elérni. A reklámok ebben a közegben is fontos szerepet játszanak. Mindent összevéve elmondható, hogy az Internetes reklámokra már kevésbé jellemz! a hagyományos reklámok rövidsége, primitívsége, agresszivitása. A hagyományos "meggy!z! er!" szerepét egyre inkább a reklám tartalma veszi át, amelynek támaszkodnia kell a piackutatás által feltárt tényekre. E mellett nem elhanyagolhatók a megjelenéssel szemben támasztott esztétikai kritériumok és az oldalak könny" kezelhet!sége sem. 2.3.6. Ellen!rz! kérdések. 1. Milyen reklámhordozókat ismer? 2. Milyen szempontokra kell figyelemmel lenniük a piackutatást végz! szakembereknek?

11

Reklámgrafika

Flash 5

3. A Flash 5 A Flash grafikus alkalmazás kiváló lehet!séget kínál ahhoz, hogy grafikák és animációk készítésével látványossá és egyszersmind interaktívvá tegyük honlapunkat. A Flash megjelenését az animált gif képek és jpeg fájlok leváltása iránti egyre növekv! igény tette szükségessé, melyek elég nagy méretük ellenére nem túl sokoldalú felhasználást tesznek csak lehet!vé. Napjainkban a Flash a világhálón jelenlév! reklámok egyik legfontosabb megjelenési formája. Bizonyos statisztikák szerint a böngész!k 97 százalékán tekinthet!k meg a Flash segítségével készített mozik. 1995-ben jelent meg a Macromedia cég Shockwave nev" programja, amelyik lehet!vé tette a cég egy másik alkalmazása, a Director alkalmazás által készített mozik Világhálón való megjelenítését. Az így exportált mozik már egy ingyenes, böngész!be integrált b!vít!program segítségével voltak lejátszhatók. A Flash megjelenésének közvetlen el!zménye a Macromedia cég 1997-ben kiadott FutureSplash nev" programja volt. 3.1. Vektorgrafika Az Interneten való megjelenésnél a legfontosabb figyelembe veend! szempont a sávszélesség, ami napjainkban a legtöbb esetben nem elegend!en nagy. A bittérképes grafika egy nagy kép esetén nagyméret" fájlt eredményez, mivel a képeket egy raszteren elhelyezked! pontok, azaz pixelek segítségével jeleníti meg. Ezt néha raszter grafikának is nevezik. Ezzel szemben a vektor grafika, más néven objektum orientált grafika olyan hardware illetve szoftver hátteret feltételez, amelyik geometriai formulákat használ a képek megjelenítésére. Mivel a rajzot utasítások segítségével tárolja, ezért a kép nagyításakor nem növekszik meg a fájl mérete, továbbá a kép részletgazdagsága sem romlik el a nagyítással. Azokat a programokat, amelyek vektor grafikus képeket is képesek kezelni, angol

12

"

Reklámgrafika

Flash 5

nyelvterületen „draw” programnak, míg a csak bittérképes képeket kezel! programokat „paint” programnak nevezik. Az alábbi képek egy felnagyított, bittérképes grafikával illetve egy felnagyított vektoros grafikával ábrázolt gömböt mutatnak.

Ezen szempontokat figyelembe véve logikus, hogy a Flash a vektorgrafikát támogatja els!sorban, de emellett lehet!vé teszi bittérképes grafikák importálását is. Minthogy a Flash mozikat egy b!vít!program (plug-in) segítségével lehet megtekinteni, ezért függetlenek a böngész!t!l. 3.2. Alapvet! fogalmak Mozik készítése közben a következ! fogalmakkal találkozunk. Kulcskocka (Keyframe) Réteg (Layer) Színpad (Stage) Szimbólumok (Symbol) Könyvtár (Library) Jelenet (Scene) Id!vonal (Timeline) 3.2.1. Kocka, kulcskocka A Flash mozik hasonlóan a filmekhez kockákból (rame) épülnek fel. Ha meg szeretnénk érteni a Flash filmek felépítését, hasznos, ha a rajzfilmet vesszük alapul. A rajzfilmek készítése az eseményvázlat (Storyboard) elkészítésével kezd!dik. Ez nem más, mint a leend! film

13

"

Reklámgrafika

Flash 5

néhány egymás utáni képbe s"rített rövid leírása. Ennek alapján aztán elkészül az úgynevezett vázlat, azaz a mozgást nagyvonalakban leíró kulcskockák sorozata. A kulcskockák közötti összeköt! kockák elkészítése aztán a rajzolók sokaságát foglalkoztatja. A kulcskockák elkészítése alkotó jelleg" munka. A Flash az összeköt! kockák gépies magrajzolása alól mentesíti az animáció készít!jét, minthogy a kulcskockák és egyéb rendelkezések alapján képes összeállítani az animációt. 3.2.2. Réteg A rajzfilmek készít!i a változó és a minden kockán megjelen! állandó elemeket külön fóliára rajzolták, így a fóliák használatával nem kellett kockáról kockára megrajzolni az azonos elemeket. Az így kialakított rétegek a takarások segítségével hozzájárultak a térbeliség illúziójának keltéséhez is.

"

A Flash is használ rétegeket, amelyek úgy képzelhet!k, mint egymásra helyezett átlátszó fóliák, amelyekre különböz! elemeket helyezhetünk. A rétegek használata azzal a további el!nnyel jár, hogy csökkenti a film fájljának méretét. A rétegek számának csak a memória mérete szab határt, számuk szaporítása nem növeli a végs! fájl méretét. A rétegeket el lehet rejteni, sorrendjüket meg lehet változtatni, használatukkal a szerkesztési m"veletek és maga a film felépítése is áttekinthet!bbé válik. 3.2.3. Szimbólumok, könyvtár Az egyedi filmkockák létrehozása szerkesztése a színpadon történik. A színpadon létrehozott alakzat a könyvtárban tárolható és ily módon szimbólummá válik. A szimbólumok olyan elemek, amelyek többször is felhasználhatók a moziban. A szimbólumok lehetnek grafikák, gombok, moziklipek, hangfájlok, bet"k. A színpadra helyzet szimbólumot a szimbólum egy példányának nevezzük. A

14

"

Reklámgrafika

Flash 5

szimbólumok használata csökkenti a fájl méretét, hiszen függetlenül attól, hogy hány példányban jelenik meg, csak egyszer tárolódik a fájlban. Ha megváltoztatjuk a szimbólum valamely tulajdonságát, valamennyi példányának megváltozik ez a tulajdonsága. Ha viszont egy példány tulajdonságát változtatjuk meg, úgy ez nem vonatkozik a többi példányra. A szimbólumok fontos szerepet játszanak a mozik interaktívvá tételében. A könyvtárban importált grafikákat, hang és mozi fájlokat is tárolhatunk. 3.2.4. Jelenet A rajzfilmek jelenetekb!l állnak. Hasonlóan, a Flash film is jelenetekre (Scene) tagozódhat. A filmkockák jelenetté illetve mozivá való összeállítása az id!vonal segítségével történik. 3.2.5. Ellen!rz! kérdések 1. Miben különbözik a kulcsfilmkocka a filmkockától? 2. Számít-e a rétegek sorrendje a mozi végs! megjelenése szempontjából? 3. Növeli-e a fájlok méretét a szimbólumok használata? 4. Mit nevezünk id!vonalnak? 5. Ha a szimbólumnak egy tulajdonságát megváltoztatjuk, vajon megváltozik-e ez a tulajdonság az összes példánynál? 3.3. A Flash felhasználói felülete A Flash szerkeszt! egy rajzoló program és egy mozi szerkeszt! egyben. Rajzoló funkciói nagyban hasonlítanak egy szokásos rajzoló program megfelel! funkcióira.

15

"

Reklámgrafika

Flash 5

!

A program legördül! menüvel rendelkezik. A munka megkönnyítését ablakok sora segíti. Az ablakok segítségével elérhet! funkciók legtöbbje a legördül! menüb!l is elérhet!. A munkát ezenkívül a jobb egérgombbal való kattintásra megjelen! helyi menük, illetve a kurzorral az alakzatok fölé állva megjelen! rövid leírások teszik könnyebbé. Az Edit/Keyboard Shortcuts menüpont segítségével testre szabhatjuk a menüpontokhoz rendelt billenty"kombinációkat. A képerny! közepén található a színpad (Stage), fölötte az id!vonal (Timeline), alatta az indítópult (Launcher bar), amelyik a fontos ablakok gyors megnyitását szolgálja. 3.3.1. A színpad (Stage) A mozik szerkesztése és el!zetes megtekintése a színpadon történik. A színpad használatát hivatott megkönnyíteni a View/Rulers,

16

Reklámgrafika

Flash 5

View/Grid/ShowGrid menüpont, amelyek a vonalzó illetve a rácsháló megjelenítésér!l rendelkeznek. A Window menüpontban található alpontok feladata a munkánkat segít! ablakok megjelenítése. Valahányszor elindítjuk a Flash alkalmazást, az létrehoz egy FLA kiterjesztés" új fájlt. Miel!tt hozzákezdünk a mozi elkészítéséhez, célszer" a mozi néhány alapvet! paraméterét beállítani. A Modify/Movie menüparancs hatására megjelen! Movie Properties párbeszédablakban beállíthatjuk a kockák számát másodpercenként (Frame Rate: 12 általában elegend!), a színpad méreteit szélesség x magasság alakban (Dimensions: Width x Height), a háttér színét (Background Color) valamint a mértékegységet (Ruler Units). A színpad szélességére és magasságára egyaránt a minimum18 maximum 2880 képpont (Pixel) korlátok érvényesek. 3.3.2. Az id!vonal (Timeline) A színpad felett látható vízszintes szalag (ablak) az id!vonal. Ez, mint egy filmszalag mutatja a mozi kockáit, rétegenként. A piros függ!leges vonal jelzi a lejátszó fejet, azaz az aktuális kockát, amit szerkeszthetünk a színpadon. A rajzelemeket több rétegben (Layer) elosztva helyezhetjük el a filmkockán. A rétegek sorokként jelennek meg az id!vonalon. A rétegek sorrendje vonszolással megváltoztatható, a legfels! sor a legfels! réteget mutatja. A réteg sorának bal oldalán található vezérl!k segítségével beállíthatjuk, hogy a réteg rejtett/nemrejtett, zárolt/nem zárolt, illetve rendelkezhetünk a rétegben lév! objektumok részletes/kivonatos megjelenítésér!l. A rétegek átnevezhet!k, elnevezésükkor, az animáció könny" kezelhet!ségének érdekében, célszer" kifejez! neveket használni. A mozi hosszát újabb kockák hozzáadásával növelhetjük. A kulcskockák olyan kitüntetett kockák, amelyek vezérlik az

17

#

#

Reklámgrafika

Flash 5

átmeneteket és az eseményeket. A kulcskockákat fekete pont jelöli. Az id!vonalon ábrázolt kockák s"r"ségét az id!vonal jobb fels! sarkában kattintva kinyíló menü segítségével szabályozhatjuk. Az id!vonalat vonszolással áthelyezhetjük a képerny! különböz! pontjaira. Kockák és rétegek csoportos kijelölésére a Windowsban szokásos „kattintás majd Shift+kattintás” (egymás utáni elemek kiválasztása) illetve a „Control+kattintás” (hozzávétel a kijelöltekhez) kijelölések is használhatók. Az éppen szerkesztett mozit megtekinthetjük szerkeszt! környezetben is a Control/Play menüparanccsal. A Window/Toolbars/Controller panel kinyitása után a mozi lejátszását a panel megfelel! gombjaival szabályozhatjuk. 3.3.3. Indítópult (Launcher bar) Az indítópult az Info panel, Mixer panel, Character panel, Instance panel, Movie Explorer ablak, Actions panel, Library ablak gyors megnyitását szolgálja. 3.3.4. Eszközsávok (Toolbars) A Window/Tools ablak a szokásos rajzfunkciókat tartalmazza. A Window/Toolbars/Main menüpont a szokásosan a menüsor alatt elhelyezked! eszköztár megjelenítésér!l rendelkezik. 3.3.5. Panelek (Panels) A Window/Panels menüpont lebeg! panelek egész sorát ajánlja fel, hogy megkönnyítse a munkánkat.

18

#

#

Reklámgrafika

Flash 5

!

A lebeg! panel olyan nem-modális ablak, amelyik állandóan kinyitva tartható és az aktuális elem (objektum) megfelel! tulajdonságát mutatja. 3.3.6. Könyvtár (Library) A Window/Library a szerkesztésnél gyakran használt elemek gy"jt!helye. 3.3.7. Filmintéz! (Movie Explorer) A filmintéz! lehet!vé teszi a mozi elemeinek vizuális áttekintését. Nagyban megkönnyíti a bonyolult filmekben való eligazodást. Segítségével a film objektumainak gyors megtalálása, módosítása is könnyen megvalósítható.

19

Reklámgrafika

Flash 5

3.3.8. Ellen!rz! kérdések 1. Mi a filmintéz! feladata? 2. Hány réteget tartalmazhat egy mozi? 3.4. Grafikák készítése A Flash lehet!vé teszi pusztán grafikák készítését is, azonban az animációk készítésénél sem nélkülözhetjük a grafikus eszközök által nyújtott lehet!ségeket. Mind a rajz, mind az animáció elkészítésénél akkor járunk el helyesen, ha a többször is felhasználásra kerül! elemeket a szimbólum könyvtárban helyezzük el. Az eszköztár ablak a rajzelemek elkészítéséhez szükséges eszközöket, továbbá a m"ködésüket szabályozó beállításokat jeleníti meg. Az ablak négy részre tagolódik.

20

Reklámgrafika

Flash 5

! A legfels! Tools részben maguk az eszközök kaptak helyet. nyíl (Arrow): objektumok a kiválasztását teszi lehet!vé. fehér nyíl (Subselect) vonal (Line) segítségével egyenes vonalat lasszó (Lasso) toll (Pen) szöveg (Text) ellipszis (Oval) téglalap (Rectangle) ceruza (Pencil) ecset (Brush) tintásüveg (Ink Bottle) festékesvödör (Paint Bucket) pipetta (Dropper) radír (Eraser) Az ablak View részében található eszközök a megtekintést szolgálják A Colors rész segítségével a határvonal (Stroke) és a kitöltés (Fill) színének beállítását végezhetjük el. A fehér és fekete négyzettel az alapértelmezett színekhez térhetünk vissza. A piros vonallal áthúzott négyzet a szín hiányát jelenti. A nyilakban végz!d! ív a háttér és az el!tér színének felcserélését végzi. A Colors részben beállított értékek az éppen kiválasztott vagy az ezek után létrehozott objektumok jellemz!it határozzák meg. Az Options rész az éppen kiválasztott eszköznek megfelel! beállítási lehet!ségeket mutatja. 21

Reklámgrafika

Flash 5

3.4.1. A nyíl A nyíl eszköz segítségével kiválasztó üzemmódba léphetünk. Ha ekkor egy bels! résszel rendelkez! objektum bels! részére kattintunk, úgy kijelöljük ezen objektum bels! részét. A kett!s kattintás mind a bels! részt, mind a határvonalat kijelöli. Ha egy bels! rész nélküli objektumra kattintunk, akkor az éppen érintett vonaldarab válik kijelöltté. A kett!s kattintás ebben az esetben a teljes, esetleg több darabból álló vonal kijelölését jelenti. Objektumokhoz igazítás (Scale to Objects) üzemmódot választva alakzatainkat pontosan illeszthetjük egymáshoz. Miután kijelöltük az illesztend! alakzatot, válasszuk ki a Scale to Objects üzemmódot. Az illeszkedési pontot egy kis kör jelöli. Helyzete attól függ, hogy mely pontjánál fogtuk meg az alakzatot. Ez legtöbbször a regisztrációs pont, azaz az alakzat középpontja. Ha a kiválasztott alakzatot egy másikhoz közelítjük, akkor alakzatunk a kis körrel jelölt pontjánál fog illeszkedni a másikhoz. A simítás (Smooth), egyenesítés (Straighten), forgatás (Rotate) méretezés (Scale) üzemmódokat az alakzat kiválasztása után lehet érvényesíteni. A nyíl eszköz lehet!vé teszi objektum alakjának megváltoztatását. Az alakzat határának egy pontja fölé állva, vonszolással az alakzat formájának folytonos deformációját idézhetjük el!. Ha eközben a Ctrl gombot lenyomva tartjuk, a deformáció nem lesz folytonos, a vonszolt pontnál a határ szögletessé válik. Vonalak rajzolása a vonal (Line), ceruza (Pencil) vagy ecset (Brush) eszközökkel lehetséges. Ha vonal (Line) rajzolása közben lenyomva tartjuk a Shift gombot, úgy a vonaldarabok által alkotott szögek 45 fok többszörösei lesznek. Az éppen aktuális vonal stílusát, vastagságát, a Window/Panels/Stroke panelon, a kitöltés stílusát pedig a Window/Panels/Fill panelon állíthatjuk be.

22

Reklámgrafika

Flash 5

3.4.2. A ceruza (Pencil) A ceruzával (Pencil) való rajzolásnál három üzemmód közül választhatunk. Az egyenes (Straighten) üzemmód egyenes szakaszokból építi fel az általunk rajzolt vonalat. A sima (Smooth) üzemmód segítségével törésmentes görbéket tudunk rajzolni, míg a tinta (Ink) üzemmód a szabadkézi rajznak felel meg. Az üzemmódot a rajzolás el!tt ki kell választani. 3.4.3. Az ecset (Brush) Az ecsettel való rajzolás el!tt ki kell választani az üzemmódot a rendelkezésre álló öt üzemmód közül. A Paint Normál üzemmód ráfest a kiválasztott rétegen lév! rajzra. A Paint Fills üzemmód a határvonalakat szabadon hagyja. A Paint Behind üzemmóddal az üres területekre illetve az objektumok mögé lehet rajzolni. A Paint Selection üzemmód a kiválasztott alakzat kitöltött részeire ír. A Paint Inside üzemmóddal az alakzat színnel kitöltött részeire rajzolhatunk. 3.4.4. A toll (Pen) A toll eszközzel a színtéren egymás után elhelyezett úgy nevezett talppontokat köthetünk össze. A talppont két féle lehet: sarokpont illetve hajláspont. Egy kattintással egy sarokpontot helyezhetünk el a színpadon. Két sarokpontot egyenes szakasz köt össze. Ha két pontot görbe vonallal szándékozunk összekötni, úgy a két pont közül legalább az egyiknek hajláspontnak kell lennie. Hajláspont elhelyezésekor egérrel a megfelel! helyre állunk, majd az egeret a kívánt irányba húzva egy olyan irányt határozunk meg, amely a ponthoz illesztend! görbe érint!jének felel meg. Ezt az irányt az úgy nevezett érint!irány-pontpár szemlélteti. Egy hajláspontnak egy másik ponttal való összekötésekor a vonaldarab hajláspontbeli érint!je megegyezik a hajláspontban beállított iránnyal. Ily módon sarok- és hajláspontok alkalmazásával összetett vonalakat lehet rajzolni. A vonal befejezése az utolsó pontra való kett!s kattintással lehetséges. Ha ehelyett végül ismét a kezd!pontra kattintunk, zárt vonalat kapunk.

23

Reklámgrafika

Flash 5

Hajláspontra kattintva az sarokponttá alakul, sarokpontra kattintva elt"nik az. A görbe egy tetsz!leges pontjára kattintva új talppontot hozhatunk létre. Az Edit/Preferences/Editing/Pen Tool menüpontban a toll eszközt érint! beállításokat találunk. 3.4.5. Fehér nyíl (Subselect) Megrajzolt vonal módosításához használjuk a fehér nyíl (Subselect) eszközt. Ha ekkor egy sarokpontra kattintunk, akkor az egy üres négyzetté, míg a hajlítópont egy üres körré változik. Ilyenkor áthelyezésre az egéren kívül használhatók a billenty"zet nyíl gombjai is. Csoportos kijelölés a Shift billenty" lenyomása mellett lehetséges. Hajlítópontra kattintva, láthatóvá válnak a saját illetve a szomszédos hajlítópontokhoz tartozó érint!irány-pontok is. Ezek áthelyezésével átalakíthatjuk a görbedarabok illeszkedését. Sarokpont hajlásponttá alakítása az Alt billenty" lenyomása mellett a pontnak az egérrel való vonszolásával lehetséges. 3.4.6. Tintásüveg (Ink Bottle) A tintásüveg eszközzel a moziban szerepl! alakzatok határvonalának színét adhatjuk meg. 3.4.7. Festékesvödör (Paint Bucket) A kitöltés színének meghatározására a festékesvödör eszközt használhatjuk. Ha a kitöltend! alakzat határa hézagokat tartalmaz (nem beépített zárt alakzat), akkor szükségünk lehet a megfelel! hézagméret (Gap Size) beállítására, hogy alakzatunk fölvegye a kiválasztott színt.

24

Reklámgrafika

Flash 5

3.4.8. Pipetta (Dropper) A pipettával színmintát vehetünk egy vonaldarabról illetve kitöltésr!l, hogy azután ezt átvigyük egy másik objektumra. A mintául szolgáló alakzat fölé állva az egérkurzor ceruza alakja azt jelzi, hogy vonalszínr!l, az ecset pedig azt, hogy kitölt!színr!l veszünk mintát. Ekkor egy kattintás hatására megtörténik a mintavétel és az egérkurzor vonalszín esetén tintásüveggé, kitölt!szín esetén festékesvödörré alakul. Ha ezután egy másik alakzatra kattintunk, az alakzat fölveszi a mintául szolgáló alakzat színét. 3.4.9. Radír (Eraser) A radírnak öt üzemmódja (Eraser Mode) megfelel az ecset üzemmódjainak. Az radír alakjának (Eraser Shape) alkalmas megválasztásával megkönnyíthetjük munkánkat. A felitatás (Faucet) üzemmód lehet!vé teszi, hogy könnyedén kitöröljük vagy csak az alakzat határát, vagy csak a belsejét. Kett!s kattintás a színtéren törli a színtér teljes tartalmát. 3.4.10. Kéz (Hand) A színpad néz!pontját helyezhetjük át vele. 3.4.11. Zoom A nagyítást/kicsinyítést szabályozhatjuk vele. Egy másik lehet!ség a munkaterület bal alsó sarkában található Zoom Control mez! használata, ahol százalékban adhatjuk meg az átméretezést. 3.4.12. Ellen!rz! kérdések 1. Mi a pipetta feladata? 3.5. Szöveges objektumok A Flash három beépített bet"típussal rendelkezik. A sans (talpatlan arányos), a serif (talpas arányos) és a typewriter (nem arányos) 25

Reklámgrafika

Flash 5

bet"típusok használata javasolt akkor, ha azt szeretnénk, hogy bet"ink minden gépen helyesen jelenjenek meg. Egyszer" szövegek megjelenítéséhez kétféle, nyújtható és állandó méret" szövegdoboz áll a rendelkezésünkre. Ha a szöveg (Text) eszköz kiválasztása után a színpad egy pontjára kattintunk egy nyújtható típusú szövegdobozt kapunk. Ennek hossza alkalmazkodik a begépelt szöveg hosszához. Ha a szöveg (Text) eszközt használva az egeret vonszoljuk a színpad területén, úgy egy állandó méret" szövegdobozt kapunk. A nyújtható szövegdoboz jele egy üres karika, míg a rögzített méret" szövegdoboz jele egy üres négyzet a szövegdoboz jobb fels! sarkában. Nyújtható szövegdoboz rögzített méret"vé alakítása az üres karika vonszolásával lehetséges. Rögzített méret" szövegdoboz nyújthatóvá alakítása az üres négyzetre való kett!s kattintással történik. A szöveg karaktereinek illetve a bekezdések formázása A Window/Panels/Character, Window/Panels/Paragraph menüpontokkal lehetséges, amelyek egyetlen ablak füleiként jelennek meg.

!

3.5.1. Ellen!rz! kérdések 1. Hányféle bet"típust ismer a Flash 5?

26

Reklámgrafika

Flash 5

3.6. Objektumok tulajdonságainak megváltoztatása A színpadon megjelenített alakzatok a következ! kategóriákba sorolhatók Szerkeszthet! objektum Olyan a színpadon szerkeszthet!, csoporthoz nem tartozó objektum, amely nem rendelkezik szimbólummal. Kijelölésnél megjelenése raszteresre változik. Egy kattintás a belsejére csak a belsejét, két kattintás a belsejét és a határát is kijelöli. Egy kattintás a határra a határ aktuális darabját, két kattintás az egész határt kijelöli. Szöveges objektum Kijelölésnél kék téglalaphatár jelenik meg körülötte. Kétszeres kattintás hatására szöveg szerkeszt! üzemmódba jutunk. Csoport Csoportot szerkeszthet! objektumokból, szöveges objektumokból, példányokból és más csoportokból alakíthatunk ki. Kijelölésnél kék téglalaphatár jelenik meg körülötte. Kétszeres kattintással csoport szerkeszt! üzemmódba juthatunk, ahol megváltoztathatjuk a csoportot alkotó objektumok tulajdonságait. A színpadra visszatérve már a megváltoztatott csoportot látjuk. Példány Egy szimbólumnak a színpadra vonszolásával keletkezett objektum. Kijelölésnél kék téglalaphatár jelenik meg körülötte. Kétszeres kattintással szimbólum szerkeszt! üzemmódba juthatunk, amit a színpad közepén megjelen! kereszt jelez. A színpadra visszatérve az objektum összes példányát már a megváltoztatott tulajdonságokkal látjuk.

27

Reklámgrafika

Flash 5

3.6.1. Takarási sorrend Az egy azon rétegen elhelyezked! szerkeszthet! objektumok létrehozásuk sorrendjében kerülnek egymás fölé úgy, hogy az utoljára létrehozott objektum van legfelül. Ha a fölül lév! objektumot elmozdítjuk, a másik objektum alatta lév! része törl!dik. Ha az objektumok kitöltésének színe megegyezik és a fels! objektum határa lehet!vé teszi a kitöltések összeolvadását, akkora két szerkeszthet! objektum összekapcsolódik és a továbbiakban már egyetlen objektumként jelenik meg. Csoport és példány típusú objektum esetén az utoljára létrehozott objektum van legfelül és valamennyi a szerkeszthet! objektumok felett. Egymáshoz viszonyított sorrendjüket a Modify/Arrange menüpont parancsaival állíthatjuk be. 3.6.2. Transzformáció (Transform) A Window/Panels/Transform panelon az objektumok átméretezése, forgatása és ferdítése valósítható meg.

!

Az átméretezés adatait százalékban, míg a forgatás (Rotate) és ferdítés (Skew) adatait fokokban kel megadni. A kényszerít (Constrain) választógombbal az arányos átméretezésr!l lehet rendelkezni. A megadott transzformáció az Enter billenty" hatására hajtódik végre. A jobb alsó sarokban lév! alapállapot (Reset) gomb visszaállítja a transzformáció el!tti állapotot. A t!le balra lév! transzformáció a 28

Reklámgrafika

Flash 5

másolaton (Copy and apply transform) gomb az eredeti objektum változatlanul hagyása mellett egy másolaton hajtja végre a transzformációt. Ez egy hasznos segítség akkor, amikor egy alakzat transzformáltjainak segítségével akarunk egy objektumot létre hozni. 3.6.3. Igazítás Az objektumok elrendezésére a Window/Panels/Align panel számos lehet!séget kínál. Az egyszer"ség kedvéért tegyük fel, hogy a színpadhoz (To Stage) gomb be van kapcsolva.

Az igazítás (Align) sor els! három lehet!sége a kiválasztott objektumok bal szélét, közepét illetve jobb szélét igazítja vízszintesen balra, középre illetve jobbra a színpadon. Az (Align) sor második három gombja a függ!leges igazításról rendelkezik. Az elosztás (Distribute) sor els! három lehet!sége a kiválasztott objektumokat úgy rendezi el függ!legesen, hogy fels! szélük, közepük, illetve alsó szélük egyenletesen helyezkedjen el a színpadon. A sorban elhelyezked! másik három gomb az vízszintes elrendezését teszi lehet!vé. A méretezés (Match Size) gombcsoport a kiválasztott objektumoknak a vízszintes, függ!leges, illetve mindkét méretét a színpadhoz igazítja.

29

!

Reklámgrafika

Flash 5

A térköz kiegyenlítése (Space) gombcsoport a kiválasztott alakzatok közti távolságokat egyenlíti ki vízszintes illetve függ!leges irányban. Ha a színpadhoz (To Stage) gomb be van kapcsolva, úgy az igazítás, elosztás, méretezés, térköz kiegyenlítése a színpadhoz viszonyítva történik. Ellenkez! esetben a színpad szerepét az a legkisebb téglalap veszi át, amelyben a kiválasztott objektumok elhelyezhet!k. 3.6.4. Csoportosítás és feloldása A Flash a Modify/Group menüpont segítségével lehet!vé teszi elemek egyetlen objektummá való alakítását. A csoportosítás feloldása a Modify/Ungroup menüpont segítségével lehetséges. A csoportok hierarchikus struktúrát alkothatnak. A csoportosítatlan objektum bittérképes alakzatként viselkedik, azaz, ha nem az egész alakzatot jelöljük ki, úgy a m"veletek csak a kijelölt részre fognak vonatkozni. 3.6.5. Széttördel, elszakít (Break Apart) A Modify/Break Apart menüparancs elszakítja a példányt a hozzárendelt szimbólumtól. Hatása visszafordíthatatlan, ezért alkalmazása nagy körültekintést igényel. Az importált grafikák szimbólumként kerülnek be a moziba. Miután a példányt elszakítottuk a szimbólumtól, az így kapott bittérképes grafikát kitöltésként is használhatjuk. Szöveges objektumok esetén az elszakítás a szöveg bittérképes grafikává alakítását jelenti.

30

Reklámgrafika

Flash 5

3.6.6. Színek A színeket kiválaszthatjuk az alakzatok létrehozása el!tt, de már létez! alakzatok színét utólag is lehet módosítani.

A határvonalak stílusát, vastagságát és színét a Window/Panels/Stroke panelon állíthatjuk be. A kitöltés stílusa lehet tömör, változó, sugarasan változó, vagy választhatunk egy bittérképes

A Window/Panels/Mixer menüpont hatására megnyíló Mixer panel mind a határoló görbe, mind a kitöltés színének tetsz!leges megválasztását teszi lehet!vé. Az Alpha azaz a fedés értéke szabályozza a kiválasztott szín átlátszóságát (100 százalék takarásnak felel meg). A Flash az RGB a HSB és a hexadecimális színrendszert támogatja.

31

Reklámgrafika

Flash 5

3.6.7. Színminták A Fill és Mixer panel segítségével kikevert átmeneteket és színeket lehet!ségünk van meg!rizni a kés!bbi felhasználás céljából. A Fill panel jobb fels! kis nyilára kattintva az Add Gradient parancs az átmeneteket, a Mixer panel jobb fels! kis nyilára kattintva az Add Swatch parancs a színeket tárolja, amelyeket aztán a Swatch panel segítségével tudunk használni. Az így létrehozott színek és átmenetek a film fájljában tárolódnak. 3.6.8. Ellen!rz! kérdések 1. Mi a To Stage gomb szerepe igazításánál? 3.7. Szimbólumok, példányok A moziban többször el!forduló objektumokat célszer" az úgy nevezett szimbólumkönyvtárban tárolni. Új szimbólum létrehozására két módszer áll a rendelkezésünkre. Az Insert/Convert to Symbol menüponttal a színpadon létrehozott objektumot alakíthatjuk szimbólummá, míg az Insert/New Symbol menüponttal a szimbólumszerkeszt! üzemmódba jutva hozhatunk létre egy új szimbólumot. Mindkét esetben meg kell adnunk a szimbólum nevét és meg kell határoznunk a szimbólum típusát, ami moziklip (Movie Clip), gomb (Button) vagy rajz (Graphic) lehet. Az így létrehozott szimbólumot a Window/Library ablakban megjelen! szimbólumkönyvtárban tekinthetjük meg. A könyvtárablak fels! felében az alsó részben lév! listából kiválasztott szimbólum képe látszik. A szimbólum moziban való felhasználása a szimbólumkönyvtárban !t reprezentáló ikonnak a színpadra való vonszolásával történik. Ilyenkor a színpadon a szimbólumnak egy példánya szerepel. A példányok számának növelése nem növeli jelent!sen a mozi méretét, mert a példány nem más, mint a szimbólumra való hivatkozás csupán.

32

Reklámgrafika

Flash 5

A szimbólumok, hasonlóan a csoportokhoz, hierarchikus rendszerbe szervezhet!k. Ha módosítjuk a szimbólum egy tulajdonságát, úgy ez a tulajdonság a szimbólum összes el!fordulásánál, azaz másik szimbólumban való el!fordulásainál, illetve példányainál módosul. Ehhez szimbólumszerkeszt! üzemmódra kell váltani. A szimbólumszerkeszt! üzemmódban a szimbólumnak saját színpada és saját id!vonala van. A színpad közepén egy plusz jel jelzi a szimbólum regisztrációs pontját. Szimbólumszerkeszt! üzemmódra a szimbólum egy példányára való kett!s kattintással, vagy a példány kiválasztása után az Edit/Edit Selected menüpont segítségével lehet váltani. Ilyenkor a színpad többi alakzata elhalványul. Ugyanez érhetjük el ha a szimbólumkönyvtárban a szimbólum kiválasztása után a helyi menüb!l az Edit menüpontot választjuk. A moziszerkeszt! üzemmódra való visszatérés a színpad egy pontjára való kett!s kattintással, vagy az Edit/Edit All menüpont kiválasztásával lehetséges. Szimbólumok többszörözése a szimbólum helyi menüjében található Duplicate utasítás segítségével történhet. Ilyenkor az új szimbólumnak nevet kell adni, amely nem egyezhet meg a korábban létrehozott szimbólumok neveivel. Ezen kívül rendelkezhetünk az új szimbólum viselkedésér!l. Ha szükségünk van olyan szimbólumra, amely egy másik mozi könyvtárában található, a File/Open as Shared Library menüpont segítségével nyissuk meg a szóban forgó szimbólumot tartalmazó mozit. Ekkor ebb!l a moziból csak a könyvtár panelt fogjuk látni, ahonnan átvonszolhatjuk a kívánt szimbólumot. Figyeljük meg, hogy vele együtt átmásolódnak a felépítéséhez felhasznált szimbólumok is. Lehet!ség van arra is, hogy egy szimbólum példányának tulajdonsága megváltozzon anélkül, hogy ez érintené magát a szimbólumot illetve a többi példányt. A Window/Panels/Instance és a Window/Panels/Effect

33

Reklámgrafika

Flash 5

menüpontok segítségével a kiválasztott példány típusát és egyéb jellemz!it tudjuk megváltoztatni.

!

Ha egy szimbólumot a Modify/Break Apart menüpont segítségével széttördelünk, úgy ennek összes példánya csoportosítatlan objektumok halmazává azaz egyszer" grafikává alakul. Ha a példánnyal tesszük ugyanezt, akkor megsz"nik a példány és a szimbólum kapcsolata, és a példány válik csoportosítatlan objektumok halmazává. 3.7.1. Közös könyvtár A Flash bizonyos el!re elkészített szimbólumokkal segíti a mozik készít!it. Ezek a szimbólumok a Window/Common Libraries menüpont segítségével érhet!k el. 3.7.2. Ellen!rz! kérdések. 3.8. Animáció A Flash mozik alapértelmezés szerint másodpercenként 12 képkockát jelenítenek meg. Ez kevesebb a mozifilmek másodpercenkénti 24, a PAL 25 és az NTSC szabvány 30 értékénél, de az Interneten megjelenve elegend! ahhoz, hogy folytonos mozgás érzetét keltse. Az animáció szerkesztésének legfontosabb kelléke az id!vonal.

34

Reklámgrafika

Flash 5

!

Képkockát az Insert/Frame, míg kulcsképkockát az Insert/Keyframe menüpont segítségével szúrhatunk be az id!vonalon el!z!leg kiválasztott helyre. Képkocka törlése az Insert/Remove Frames menüpont segítségével lehetséges. 3.9. Köztesmozgás (Motion Tween) A legegyszer"bb, kockánkénti (Frame by Frame) animációnál minden kockát külön meg kell rajzolni. Ennél hatékonyabb, ha a mozgásnak csak a leglényegesebb fázisait rögzítjük a kulcskockákon, a közöttük lév! kockák tartalmát már a Flash számítja ki. Ez a technika, az úgy nevezett köztesmozgás, egyszer"síti a szerkesztést és csökkenti a mozi fájljának méretét. Köztesmozgást csak szimbólumok, csoportok és szövegek esetén alkalmazhatunk. A színek és az átlátszóság átmeneteit csak szimbólumok esetén lehet megvalósítani. A köztesmozgás elkészítéséhez rajzoljunk meg két kulcskockát, majd válasszuk ki a köztük lév! kockák bármelyikét. Ezt a megfelel! kocka Control billenty" lenyomása melletti kijelölésével tehetjük meg. (A Control billenty" nélkül nem egyetlen kockát fogunk kiválasztani.) Ezután az Insert/Create Motion Tween menüponttal elkészíthetjük a kívánt köztesmozgást, amelyet a kulcskockák között húzódó vízszintes kék nyíl jelöl. Köztesmozgás utolsó kockáját egy üres téglalap jelöli. Ennek jobbra illetve balra való vonszolásával, a köztesmozgáshoz tartozó kockák

35

Reklámgrafika

Flash 5

számát tudjuk változtatni, amellyel a mozgás lassítását illetve gyorsítását tudjuk elérni. Képkockák egy sorozatát kijelölve azok egy másik helyre, akár másik rétegbe is másolhatók illetve mozgathatók a következ! módon. Jelöljük ki a kockasorozatot, majd az Edit/Copy Frames vagy az Edit/Cut Frames menüparancsok segítségével másoljuk azokat a vágólapra. Álljunk rá arra a kockára, ahová a kiválasztott kockahalmaz els! kockáját helyezni szeretnénk. Ekkor a vágólap tartalmát az Edit/Paste Frames menüparanccsal beilleszthetjük a kívánt helyre. Csak teljes köztesmozgást lehet másolni, mozgatni. Képkockacsoport lejátszási sorrendjének megfordításához válasszuk ki a kockasorozatot, majd alkalmazzuk a Modify/Frames/Reverse menüparancsot. Köztesmozgás alatt nem csak az objektumok helyzete, hanem mérete, állásszöge, ferdesége is változtatható, amit a Window/Panels/Transfom menüpont segítségével érhetünk el. Ezen kívül fokozatosan változtatható az alakzatok színe, átlátszósága is, amit a Window/Panels/Effect panelon állíthatunk be. A kezd!- illetve végállapotok a kulcskockákon állíthatók be. A Window/Panels/Frame panelon alakzatok forgatását kezdeményezhetjük. A CW (ClockWise) óramutató járásával megegyez! irányú, a CCW (CouterClockWise) óramutató járásával ellentétes irányú forgatást jelöl. Az Easing (lassítás/gyorsítás) segítségével a köztesmozgás sebességét tudjuk befolyásolni. Az Orient to Path (irányultság az útvonal szerint) gomb bekapcsolása az eredményezi, hogy az alakzat és az útvonal érint!jének szöge a mozgás során állandó marad.

36

Reklámgrafika

Flash 5

3.9.1. Mozgásvezérl! (Motion Guide) Az alakzatoknak egy kijelölt útvonalon való mozgatása egy lejátszáskor láthatatlan, úgy nevezett Motion Guide Layer (mozgásvezérl! réteg) segítségével történik. A mozgatandó alakzatot tartalmazó rétegbe állva az Insert/Motion Guide menüparancs létrehoz egy mozgásvezérl! réteget az eredetileg kiválasztott réteg fölött. Amennyiben egy másik réteget is ugyanehhez a mozgásvezérl!höz szándékozunk kapcsolni, úgy húzzuk a réteget a mozgásvezérl! réteg alá. A rétegeknek egy mozgásvezérl!höz való kapcsolódását az jelzi, hogy valamennyien a mozgásvezérl! alatt, egy kissé jobbra behúzva láthatók. A kapcsoltság a rétegnek a mozgásvezérl! réteg fölé húzásával szüntethet! meg. Ezután meg kell rajzolni a mozgás útvonalát a mozgásvezérl! rétegen. Ez nem lehet zárt görbe. Ha kört használtunk a megrajzolásához, akkor egy kis darabjának kiradírozásával meg kell szüntetnünk a zártságot. Ajánlatos ezután ezt a réteget zárolni a kés!bbi hibák elkerülése érdekében. Végül a mozgatandó alakzat rétegére váltva, vonszoljuk az objektumot a kezd! kulcskockában az útvonal kezd!pontjához, a záró kulcskockában pedig az útvonal végpontjához. Ugyanehhez az útvonalhoz más réteg más alakzatát is hozzákapcsolhatjuk. 3.9.2. Maszk használata Érdekes hatást lehet, ha grafikus alakzatokat maszkként használunk. Ez azt jelenti, hogy a maszk alatti rétegekb!l csak annyi látszik, amennyit a maszk láttatni enged. Úgy képzelhetjük, mintha egy kulcslyukon keresztül szemlélnénk a világot, ahol a kulcslyuk játssza a maszk szerepét.

37

Reklámgrafika

Flash 5

3.10. Köztes alakváltozás (Shape Tween) Míg a köztes mozgást szimbólumokon vagy csoportokon m"ködik, addig a köztes alakváltozás csak szerkeszthet! objektumokon alkalmazható. Egy objektum szerkeszthet!sége úgy ismerhet! fel, hogy kijelölésekor az objektum színe raszteresre változik, míg egy csoport vagy szimbólum esetén egy kijelöl! téglalap jelenik meg körülötte. A köztes mozgás az Insert/Create Motion Tween menüponttal ugyanúgy elérhet!, mint a Window/Panels/Frame panelen lév! Tweening mez!nél. Ezzel szemben a köztes alakváltozás kizárólag a Window/Panels/Frame panelen lév! Tweening mez!nél választható ki. A legfontosabb különbség a köztes mozgás és a köztes alakváltozás között az, hogy míg a köztes mozgás mindig egységes objektumként kezeli a mozgatott alakzatot, addig a köztes alakváltozás során az objektum egy másik objektummá alakul át. Az is el!fordulhat, hogy az átalakulás közbüls! kockáiban részeire esik. Ezt a regisztrációs pont szerkesztéskor való ügyes megválasztásával kerülhetjük el. 3.10.1. Regisztrációs pont áthelyezése átméretezéskor Szimbólum átméretezésekor a referenciapont az objektum középpontja. Mind szerkeszthet! alakzat, mind csoport, példány átméretezésénél a megragadottal átellenes méretez!doboz marad helyben, azaz játssza a referenciapont szerepét. Csoportok, példányok esetében azonban a Modify/Transform/Edit Center menüparancs lehet!vé teszi, hogy az objektum középpontja legyen a referenciapont azaz az átméretezés középpontja. Ha az alakváltozás fázisainak szerkesztésekor csoportokkal dolgozunk, akkor a Modify/Transform/Edit Center menüparancs hatására a referenciapont változatlan marad. A csoportosítás megszüntetése után az animációban résztvev! alakzatok az animáció során a kívánt módon fognak viselkedni.

38

Reklámgrafika

Flash 5

3.10.2. Objektumok közötti átalakulás Ha két kulcskockába két különböz! alakzatot helyezünk és köztes alakváltozást állítunk be a közöttük lév! kockák számára, úgy az egyik alakzatnak a másikba való átalakulását valósítjuk meg. Az ílymódon automatikusan megvalósított átmenetet részletekbe men!en befolyásolhatjuk. Ehhez úgy nevezett alakirányítókat kell elhelyeznünk az átalakulás els! kulcskockáján (a másodikon ez nem lehetséges). A Modify/Transform/Add Shape Hint menüparancs segítségével bet"kkel megkülönböztetett piros szín" pontok jelennek meg mindkét kulcskocka színpadán. Ha ezeket az alakzat határára húzzuk, színük az els! kulcskockán sárgára, a második kulcskockán pedig zöldre változik. Ekkor az átalakulás során az alakirányító a vele azonos bet"kkel jelölt alakirányítóba megy át. Lehet!ségünk van az animáció sebességét befolyásolni. Ha a kezd! kulcskockán az A Window/Panels/Frame panel Easing mez!jének értékét nagynak választjuk, akkor az animáció gyorsan indul, majd lassulva normális sebességet vesz fel. Alacsony Easing érték gyorsuló animációt eredményez. 3.11. Interaktív mozik Az interaktív mozik készítésének nélkülözhetetlen kelléke a nyomógomb. 3.11.1. Nyomógomb A nyomógomb mindig egy nyomógomb típusú szimbólum példányaként fordul el! a moziban. A gombnak saját id!vonala van, amely azt mutatja, hogy a nyomógombok moziklipként is m"ködhetnek.

39

Reklámgrafika

Flash 5

A néz! egérrel való beavatkozását eseménynek nevezzük. A Flash által értelmezett események a következ!k. Up: az egérmutató nincs a nyomógomb fölött, Over: az egérmutató a gomb fölött van, Down: az egér gombjának lenyomása a nyomógomb fölött, Hit: kattintás az egér gombjával a nyomógomb felett Mind a négy eseményhez tartozik a nyomógomb szimbólumnak egyegy kockája, amelynek segítségével - a Hit esemény kivételével beállíthatjuk az illet! eseményhez tartozó megjelenést. A Hit eseményhez tartozó kockán egy olyan láthatatlan területet jelölhetünk ki, amelyik érzékelni fogja az egérgombbal való kattintást. A nyomógombnak az eseményre adott válaszát akciónak nevezzük. A néz! által a nyomógombon végrehajtott beavatkozások a nyomógomb különféle akcióit indíthatják el. Az akciók beállítása a nyomógomb példányán, a helyi menü Actions menüpontjának kiválasztásával lehetséges. Egyszer" gombok esetében elegend! a nyomógombnak csupán az Up esemény bekövetkezéséhez tartozó állapotát megadni. Ilyenkor a többi esemény is az itt megadott megjelenést fogja használni. Az akciók beállítása természetesen nem hagyható el.

40

Reklámgrafika

Flash 5

3.11.2. Moziklipek A Flash sokoldalúságához hozzájáruló eszközök közül talán a legfontosabb a moziklip. Ez a szimbólumok egyik viselkedési formája. A moziklipnek saját id!vonala van, a mozi id!vonalán csak egyetlen kockaként jelenik meg. A moziklipek más szimbólumok akcióival vezérelhet!k. Gyakran nyomógombok állapotaihoz rendelve találkozunk velük. A moziklip állhat egyetlen képkockából, de lehet egy animáció is. Az egyetlen kockából álló moziklip és a grafikus szimbólum közti legfontosabb különbség a hozzárendelhet! akciókban mutatkozik meg. 3.11.3. Animáció moziklippé alakítása A f! id!vonalon lév! animáció moziklippé alakítása képkockák másolásával lehetséges. Az Insert/New Symbol paranccsal hozzunk létre egy új moziklip viselkedés" szimbólumot. Ezután a f! id!vonalon kijelölt filmkockákra az Edit/Copy Frames vagy Edit/Cut Frames utasítás alkalmazásával majd az új szimbólum szerkesztési területén az Edit/Paste Frames utasítással átmásolhatjuk vagy átmozgathatjuk a kijelölt filmkockákat az új moziklipbe. 3.12. Tesztelés, mentés, publikálás Az elkészült mozi legegyszer"bb tesztelése a lejátszófej kockákon való léptetésével valósítható meg. Ennél kényelmesebb, ha a Window/Toolbars/Controller menüponttal láthatóvá tesszük a vezérl!t (Controller) és a tesztelést ennek a segítségével végezzük. Ha a mozi elkészült, a File/Export Movie menüparanccsal elmenthetjük azt egy swf kiterjesztés" fájlba, amelyet aztán a Flash

41

Reklámgrafika

Flash 5

lejátszó értelmezni tud. Ha a Control/Test Movie menüpontot választjuk, akkor a tesztelés el!tt létrejön ez az swf kiterjesztés" fájl. Ha arra vagyunk kíváncsiak, hogyan fog kinézni mozink egy böngész!ben, válasszuk a File/Publish Preview menüpontot. Ilyenkor a mozit egy html oldalba beágyazva látjuk, amelyet a böngész!be integrált Flash lejátszó (plug-in) segítségével tekintünk meg. Ilyenkor elkészül egy html kiterjesztés" fájl, amely tartalmazza a mozink megjelenítéséhez szükséges html utasításokat. 3.13. Hagymahéj tesztüzemmód Nevét a hagymahéjpapírról kapta, amely egy vékony átlátszó papír. Segítségével jól elemezhet!k a mozgások. A hagymahéj gomb bekapcsolása után az id!vonal kockaszámokat feltüntet! sávján egy úgy nevezett hagymahéj mutató jelenik meg. Ez nem más, mint egyszerre megjelenítend! kockák sorozata. Ezen kockasorozat els! és utolsó elemét vonszolással külön-külön beállíthatjuk. (Ha valamelyik irányban elérjük mozink végét, állítsuk arrébb a lejátszófejet.) Lejátszáskor a kulcsképkockák élesen, a többiek halványan jelennek meg. 3.14. Action Script A Flash programozása a JavaScript nyelvhez nagyban hasonló ActionScript nyelven történik. Interaktív filmek készítéséhez nélkülözhetetlen az ActionScript. A nyelv objektum orientált. Az osztály (class) példányait (instance) objektumoknak nevezzük. Az osztály leírása tartalmazza tulajdonságait (property), metódusait (method) és eseménykezel!it (event handler). Az osztály által definiált tulajdonságok, metódusok és eseménykezel!k a példány (objektum) létrejöttekor tölt!dnek fel konkrét tartalommal (deklarálódnak).

42

Reklámgrafika

Flash 5

Az örökl!dés során a szül! osztályból kiindulva egy olyan gyermek osztály jön létre, amelyik a szül! osztály minden tagját (adattagot és tagfügvényt) tartalmazza, és amelyik ezeken kívül még további tagokat is tartalmazhat. Az osztályok között ezen kívül még tartalmazási relációk is fenn állhatnak. Ily módon az osztályok és ebb!l következ!en az objektumok is hierarchikus rendszert alkotnak a tartalmazás és az örökl!dés alapján. ActionScript programot képkockákhoz, gombokhoz és moziklipekhez rendelhetünk. 3.14.1. Képkockához rendelhet! ActionScript kód Az id!sávon egy cellára állva a Window/Actions menüpont hatására megjelen! ablakban a Frame Actions panel jelenik meg. Az akció összeállítása történhet menüvezérelt módon (Normal Mode) vagy közvetlenül szerkesztve (Expert Mode). A kett! között a panel jobb fels! sarkában található kis jobbra mutató háromszög segítségével lehet váltani. A panelen az akciók (utasítások) kategóriákba csoportosítva jelennek meg. Az akció a kiválasztott rétegen belül a kiválasztott cellához legközelebbi szabad cellához fog hozzárendel!dni. Képkockához rendelt akció esetén egy kis a bet" jelenik meg az id!sávon a megfelel! cellában. 3.14.2. Nyomógomb események, amelyekhez ActionScript kód rendelhet! Press/Relase (lenyomás/felengedés): az eseményhez rendelt akció akkor következik be, amikor a felhasználó egy filmbeli nyomógomb felett lenyomja illetve felengedi az egérgombot. Release Outside (felengedés kívül): az egérgombnak egy filmbeli nyomógomb feletti lenyomása és a nyomógombon kívül való felengedése Key Press (billenty"lenyomás): a billenty"zet általunk meghatározott gombjának lenyomása.

43

Reklámgrafika

Flash 5

Roll Over/Roll Out (fölé mozgatás/elmozgatás): ): az akció akkor hajtódik végre, amikor a felhasználó az egérmutatót a gomb fölé illetve onnan el mozgatja Drag Over/Drag Out (fölé vonszolás/elvonszolás): ): az akció akkor hajtódik végre, amikor a felhasználó lenyomott egérgomb mellet az egérmutatót a gomb fölé- illetve onnan elmozgatja 3.14.3. Moziklip események, amelyekhez ActionScript kód rendelhet!. Load/Unload (betöltés/törlés): a hozzárendelt akciót a mozi els! kockájába való betöltés illetve a mozi törlése váltja ki. Enter Frame (képkockába lépés): az eseményhez rendelt akció akkor következik be, valahányszor a lejátszófej egy képkockába lép. Mouse Down/Mouse Up (egérgomb lenyomása/egérgomb felengedése): az akció akkor hajtódik végre, amikor a felhasználó lenyomja illetve felengedi az egér gombját bárhol a színpadon. Mouse Move (egér mozgatása): az akció akkor hajtódik végre, amikor a moziklip megjelenítése közben a felhasználó mozgatja az egeret. Key Down/Key Up (billenty" lenyomása/billenty" felengedése): az akció akkor hajtódik végre, amikor a moziklip megjelenítése közben a felhasználó lenyom illetve felenged egy gombot a billenty"zeten. Data (adat): az akció akkor következik be, amikor egy másik film egy scriptje adatokat küld. Nyomógomb és moziklip példányára (nem a szimbólumra) állva a Window/Actions menüpont hatására megjelen! ablakban az Object Actions panel jelenik meg.

44

Reklámgrafika

Flash 5

A panelen a Basic Actions kategóriába sorolt valamennyi akció alkalmazható mind nyomógombok, mind moziklipek esetében, kivéve az On Mouse Event eseményt, amely csak moziklip esetén használható. A kiválasztott akcióra kétszer kattintva hozzárendeltük az akciót az aktuális eseményhez. Ezt a tényt az ablak jobb oldalán megjelen! kód mutatja. A kód on szóval kezd!d! sorai eseményeket jelölnek, az alattuk lév! kódrészlet pedig az esemény bekövetkezésekor végrehajtandó ActionScript utasítások sorozatát. Egy ilyen on szócskát tartalmazó sorra állva lehet!ségünk van a szóban forgó esemény megváltoztatására. Ahhoz, hogy az ActionScript hivatkozni tudjon egy objektumra, a színpadon kijelölve az objektumot, a Window/Panels/Instance panel segítségével el kell nevezni azt. Az objektumokra való hivatkozás, a fájlrendszerekhez hasonlóan, a hozzájuk vezet! útvonal segítségével történik. Itt is van relatív és abszolút útvonal. A nevek közti elválasztó karakter korábban a / jel volt, a jöv!ben a Flash a pontot részesíti el!nyben. Ha el akarjuk kerülni a sok hibával járó szerkesztést, objektumokra való hivatkozások esetén használjuk a panel jobb alsó részén található plusz és karika együttesével jelölt Insert a target path gombot. Ezt a gombot használva kényelmes, grafikus felület áll a rendelkezésünkre a megfelel! objektum kiválasztására.

45

Reklámgrafika

Gyakorlatok

4. Gyakorlatok 4.1. Rajzoljunk Napot

!

1. Válasszuk a kitöltés színének a narancssárgát, a határvonal legyen színtelen. 2. Kattintsunk az Ovál eszközre, majd a Shift gombot lenyomva rajzoljunk egy kört. (A Shift hatására biztosan kört és nem ellipszist kapunk.) 3. Válasszuk ki a vonal eszközt, és rajzoljunk vele egy kis háromszöget nem messze a kör fölé. Töltsük be ezt is narancssárgával. 4. Válasszuk ki az Arrow eszközt. Kattintsunk kétszer a háromszögre, ennek hatására kiválasztjuk a háromszöget és a határát is. 5. El!készítjük a háromszög elforgatásait. Modify/Group hatására a következ! utasítások a csoportra (háromszög és határa) vonatkoznak Modify/Transform/Edit Center hatására megjelenik a forgatás középpontja, amelyet a kör középpontjába kell vonszolnunk Modify/Transform/Rotate hatására a következ! m"veletek forgatások lesznek 6. Az elforgatás Edit\Copy másolás a vágólapra Edit\Paste In Place beillesztés az eredeti fölé

46

Reklámgrafika

Gyakorlatok

A Shift billenty"t lenyomva fogjuk meg a kijelölt csoportot egyik sarkát és az egérrel vonszolva forgassuk el balra 45 fokkal. 7. A 6 pontban leírtakat ismételjük addig, amíg a Nap mind a nyolc ága el nem készül. 8. Megszüntetjük a csoportot Edit/Select All Modify/Ungroup 9. Szín beállítása a. Window/Panels/Fill panel kiválasztása b. A Radial Gradient opciót választjuk, majd a tológomb bal szélén sárga színt, a jobb szélén narancssárga színt állítunk be. c. A Paint Bucket (festék vödör) eszközt használva kattintsunk a napkorongra.

4.2. Fogd és vidd 1. Készítsünk egy csoportot a Napot alkotó elemekb!l 2. Alakítsuk moziklip szimbólummá. A nevét nem fogjuk használni. 3. Ugyanezt a csoportot alakítsuk nyomógomb típusú szimbólummá is. Ennek a nevét sem fogjuk használni. 4. A színpadon lév! objektum eseményeit kezeljük a következ! módon

47

!

Reklámgrafika

Gyakorlatok

on (press, dragOut) { startDrag (""); } on (release, releaseOutside, dragOut) { stopDrag (); } Ezt elérhetjük Expert Mode üzemmódban begépeléssel. A másik lehet!ség az, ha követjük a következ! lépéseket. a. A színpadon válasszuk ki a csoportot. A jobb gomb hatására kinyíló helyi menüb!l válasszuk az Actions pontot

48

Reklámgrafika

Gyakorlatok

b. Kattinsunk kett!t az on eseményen, majd az ablak alsó részén állítsuk be a Press és Drag Over lehet!ségeket c. Kattintsunk kétszer a startDrag függvényen, aminek eredményeként el!állt a szkript els! fele. d. A második rész hasonló lépések egymásutánjaként kapható 4.3. Átalakuló szöveg Készítsünk egy szövegnek egy másik szöveggé való átalakulását megjelenít! animációt. 1. Helyezzünk el egy szöveget a mozi els! keretében.

49

Reklámgrafika

Gyakorlatok

2. Adjuk ki a Modify/Break Apart menüparancsot 3. Helyezzünk el egy kulcskeretet az id!vonal 15. cellájában. 4. A szöveges objektum tartalmát változtassuk meg, majd erre az objektumra is adjuk ki a Modify/Break Apart menüparancsot 5. A Window/Panels/Frame panel Tweening mez!jének értéke legyen Shape 4.4. Aktív nyomógomb Készítsünk olyan nyomógombot, amelyik az egérrel végzett m"veletek hatására változtatja megjelenését. 1. Készítsünk egy piros szín" téglalapot a nyomógomb megjelenítésére. 2. Az Insert/Convert to Symbol menüparancs segítségével alakítsuk szimbólummá gomb néven. 3. Válasszuk ki a szimbólumkönyvtárban a gomb szimbólumot. A helyi menü Edit parancsával váltsunk szimbólum szerkeszt! üzemmódra. 4. Az Insert/Keyframe menüparanccsal helyezzünk el egy kulcskeretet a nyomógomb Over állapotába. 5. Színezzük át a téglalapot kékre. 6. Helyezzünk el egy kulcskeretet a Down állapotba. 7. A téglalapra alkalmazzuk a Modify/Transform/Scale and Rotate menüparancsot. Ha a Scale mez!be 75 százalékot írunk, akkor a nyomógomb lenyomáskor kicsinyítve jelenik meg. 4.5. URL Készítsen egy nyomógombot, amelynek segítségével meg lehet nyitni egy honlapot 1. A Window/Common library menüparanccsal nyissa meg a közös könyvtárt 2. Válasszon ki egy nyomógombot és vonszolja a színpadra.

50

Reklámgrafika

Gyakorlatok

3. A gomb példányát kiválasztva adja ki a Window/Actions menüparancsot. 4. A kinyílt ablakban helyezze el a következ! szkriptet on (release) { getURL ("http://www.gdf-ri.hu", "_blank"); }

A fenti ablak a normál módban kitöltend! mez!ket mutatja. Szakért! módban a szkript begépelésével lehet célhoz érni. 5. A File/Publish menüparancs után kipróbálhatjuk honlapunkat. 4.6. Animált gomb létrehozása A nyomógomb nyilak által közre fogott felirata összezsugorodik akkor, ha az egérmutató a gomb fölé kerül.

51

Reklámgrafika

Gyakorlatok

1. A színpadon létrehozott "Felirat" szöveget tartalmazó szöveges objektumból készítsünk egy felirat nev" grafikus szimbólumot. Igazítsuk középre. 2. Készítsük el a jobbra illetve balra mutató grafikus szimbólumokat egy balra illetve jobbra mutató nyilat tartalmazó szöveges objektumból. Ezeket a szimbólumokat is igazítsuk középre. 3. Hozzunk létre egy új moziklipet, a neve legyen felirat_mc 4. Állítsunk be négy réteget fölülr!l lefelé a következ! nevekkel akciok bal szoveg jobb 5. Helyezzük a bal nev" réteg els! kockájába a jobbra nev" szimbólumot, a szoveg réteg els! kockájába a felirat nev" szimbólumot, a jobb nev" réteg els! kockájába a balra nev" szimbólumot. Ennek hatására a kockák kulcskockává alakulnak. A szöveget igazítsuk a színpad közepére. Rendezzük el !ket úgy, hogy a szöveg a két nyíl közé kerüljön, majd igazítsuk !ket egy vonalba és egyenletes távolságra. 6. A bal, szoveg és jobb nev" rétegek 10. celláit kijelölve az Insert/Keyframe menüparancs segítségével helyezzünk egy-egy kulcskockát a kijelölt cellákba. Ha a kijelöléskor a Control és Shift gombokat lenyomva tartjuk, több objektum együttes kijelölését érhetjük el. 7. A 10. pozícióban méretezzük át a szöveget. A nyilakat helyezzük köré, majd igazítsuk egyvonalba és egyenletes távolságra az objektumokat. 8. A bal, szoveg és jobb rétegek egy-egy közbüls! cellájának kijelölése után, a Modify/Panels/Frame panelon a Tweening mez! értéke legyen Motion. Ezzel a rétegekre köztesmozgást állítunk be. 9. Hogy az animáció ne ismétl!djön újra meg újra, egy megállást kezdeményez! akciót rendelünk egy képkockához. Az akciók réteg els! kockájára állva nyissuk meg a Window/Actions ablakot. A Basic Actions csoportból válasszuk a Stop akciót. Ekkor a kockánál lév! kis a bet" jelzi a kockához rendelt akciót.

52

Reklámgrafika

Gyakorlatok

10. Az akciók réteg els! kockáját vonszoljuk el a 10. helyre. Ezzel azt érjük el, hogy az animáció csak a végén áll meg. 11. A mozi színpadára váltva hozzunk létre egy új nyomógomb típusú szimbólumot. 12. Állítsunk be három réteget fölülr!l lefelé a következ! nevekkel hang szoveg fo 13. A felirat nev" szimbólumot vonszoljuk a szoveg réteg Up állapotnak megfelel! pozíciójába, majd igazítsuk középre. 14. A fo réteg els!, azaz Up állapotnak megfelel! pozíciójára állva rajzoljunk egy téglalapot, amit aztán a nyomógomb megjelenítésére fogunk használni. Igazítsuk középre. 15. A fo réteg azaz Over állapotnak megfelel! pozíciójára állva vonszoljuk a színpadra a felirat_mc moziklipet, majd igazítsuk középre. 16. A fo réteg Hit állapotát kiválasztva rajzoljunk egy fehér szín" fehér határú téglalapot, amely a találatok fogadását szolgálja. 17. Window/Common Libraries/Sounds könyvtárból vonszoljuk át a Visor Hum Loop hangmintát a saját szimbólum könyvtárunkba. A hang réteg Over állapotát kiválasztva helyezzünk el egy kulcskockát az Insert/Keyframe menüpont segítségével. Vonszoljuk a hangszimbólumot a színpadra. 18. Helyezzük el a gomb szimbólum egy példányát a mozi színpadán. 4.7. Pásztázó fényforrás Készítsünk egy olyan gombot, amelynek felirata az egér, mint egy fényforrás mozgásának megfelel!en válik láthatóvá. A feladat megoldása két réteg felhasználásával történhet. A fels! réteg tartalmazza a szöveget, amelyet maszknak kell beállítani. Ezen a maszkon keresztül látszik a fényfolt, amelyik az egér hatására mozog. 1. Legyen a mozi mérete 250x125, a háttér fekete

53

!

Reklámgrafika

Gyakorlatok

2. Az els! réteg neve legyen text 3. Helyezzük el a Gábor Dénes szöveget a színpadon. A betüméret legyen 36, a szín fehér. 4. Vegyünk fel egy második réteget, neve legyen movie 5. Hozzunk létre egy kört kb. 80 átmér!vel. Mind a háttér mind a kitöltés legyen sárga (a fény színe). 6. Konvertáljuk a kört moziklippé. A szimbólum neve legyen huzo. 7. A moziklip példányának neve legyen huz 8. A movie réteg kulcskockájának eseményei közé vegyük fel a startDrag("huz", true) eseményt. A Click Mouse to Center jelöl!négyzetet állítsuk be. 9. A text réteg kulcskockáját állítsuk be maszkra. 4.8. Villanó logo Készítsen logot, amely villanó hatást keltve jelenik meg. A feladat kapcsán megismert fogások: Importált grafika szétosztása rétegek között Gradiens típusú kitöltés létrehozása 1. A File/Import menüparanccsal importáljuk a logo grafikáját. 2. A réteg neve legyen alsó. 3. Hozzunk létre még két réteget kozepso illetve felso elnevezessel. 4. Az also rétegen elhelyezked! grafikus objektumra adjuk ki a Modify/Break Apart menüparancsot. Minthogy grafikus objektumunk az importáláskor keletkez! grafikus szimbólum egy példánya, a parancs hatására megsz"nik az objektum és a szimbólum közti kapcsolat és grafikánk szerkeszthet!vé válik. 5. Az Edit/Cut menüparanccsal vágjuk ki a grafikus objektum azon részét, amelyet ki akarunk vonni a villanó megjelenés hatása alól. 6. Az így kivágott részt az Edit/Paste in Place menüparanccsal illesszük be a felso réteg cellájába. 7. Válasszuk ki a kozepso panelt, hogy létrehozzuk a villanást kiváltó elemeket.

54

Reklámgrafika

Gyakorlatok

8. A Window/Panels/Mixer panelen állítsuk be a kitöltés színét (Fill Color) fehérre, a takarást (Alpha) nullára. A jobbra mutató kis nyíl hatására kinyíló menüb!l válasszuk ki az Add Swatch menüpontot. 9. A Window/Panels/Fill panelon válasszuk a Linear Gradient értéket A Fill panel vízszintes kijelz!jének két széls! helyét az alatta lév! nyílra kattintva aktivizálhatjuk. Ezt a nyíl fels! háromszögének fekete színe jelzi. Ilyenkor a kijelz!t!l jobbra lév! négyzet segítségével változtathatjuk meg ezen úgy nevezett kulcshelyek paramétereit. Az eredményt a kijelz!t!l balra lév! négyzet mutatja. 10 Mindkét széls! helyen állítsunk be fehér színt és nulla alfa értéket, amelyet rácsháló jelez. 11. A Fill panel kijelz!jének közepére kattintva hozzunk létre egy újabb olyan helyet a kijelz!n, amelynek értékeit beállíthatjuk. Ezen újabb kulcshely alatti nyílra kattintva állítsuk az itteni kitöltést átlátszatlanra.

12. A fentiekben kialakított gradiens típusú kitöltés felhasználásával hozzunk létre egy téglalapot határ nélkül. A hatás érdekesebbé tételének érdekében téglalapunkat el is forgathatjuk. 13. A téglalapot a Modify/Group menüparanccsal alakítsuk csoporttá. 14. Vonszoljuk a téglalapot egy a következ!kben létrehozandó köztesmozgás kiinduló helyzetébe. 15. Jelöljük ki a 20. kocka celláit és adjuk ki az Insert/Keyframe parancsot. 16. A kozepso réteg 15. cellájában vonszoljuk a téglalapot a köztesmozgás végs! helyzetébe.

55

Reklámgrafika

Gyakorlatok

17. A kozepso réteg els! celláját kijelölve alakítsuk a cellasorozatot köztesmozgássá. 18. A kozepso réteg utolsó cellájához rendeljük hozzá a gotoAndPlay(1) akciót az animáció újbóli futásának el!idézéséhez. 4.9. Körök Készítsünk olyan animációt, amelyik egy felirat körül, az egér mozgásának hatására kis fölfújódó köröket jelenít meg. A szöveg minden bet"je fölé elhelyezünk egy olyan gombot, amelyik az egér hatására egy kis moziklipet indít el. A klip során egy kisméret" átlátszó kör átalakul egy nagyobb körré. 1 Legyen a mozi mérete 500x100, a háttér zöld. 2 Helyezzük el a "Gábor Dénes" feliratot a színpadon. A bet"típus legyen Courier New, bet"méret 36, a szín fekete. Minden bet" közé helyezzünk egy szóközt, a két szó között legyen két szóköz. 3 Hozzunk létre egy új grafikus szimbólumot, a neve legyen kor. Határa legyen fekete, a kitöltés átlátszó. Igazítsuk középre és legyen Alpha nullával egyenl!. 4 Készítsünk egy moziklip típusú szimbólumot, a neve legyen korok. 5 A moziklip els! kockájára helyezzük el a kor szimbólum egy megfelel!en kicsi példányát 6 A moziklip 15. kockáját alakítsuk kulcskockává. A moziklip 15. kockájára vegyük fel a kor szimbólum egy nagyobb példányát. 7 Az els! kockát választva, a Frame panel Tweening mez!jében állítsuk be a Motion értéket. 8 Jelöljük ki a 15-1 kockatartományt (így visszafelé) és helyezzük át a 2-16 kockatartományba. 9 Hozzunk létre egy atlatszo_gomb nev" nyomógomb típusú szimbólumot. Alakja legyen kör, legyen átlátszó. 10 A szimbólum akciói közül válasszuk ki a Play akciót, az esemény pedig legyen on (release) {rollover}

56

Reklámgrafika

Gyakorlatok

11 Helyezzük az atlatszo_gomb szimbólum egy példányát a moziklip els! kockájára. Igazítsuk középre és legyen Alpha nullával egyenl!. 12 Az els! kocka akciói közé vegyük fel a "stop" akciót. 13 A színpadon legyen az aktuális kocka a mozi els! és egyetlen kockája. Helyezzük a korok moziklip példányait a felirat bet"i fölé. 4.10. Golyók 4.10.1. Megállítható és elindítható golyó A mozi mutasson egy guruló golyót és két nyomógombot. A mozi a stop nyomógomb segítségével leállítható, majd a start nyomógomb hatására folytatódik. 1. Célszer" a View/Grid/Show Grid és View/Grid/Snap to Grid parancsok segítségével a rácshálót illetve hozzá való igazítást bekapcsolni. 2. Készítsen három réteget az id!vonalon gombok golyo hatter elnevezéssel. 3. A golyo rétegen az els! cellában készítsen egy golyót a színpad bal szélén. Alakítsa grafikus szimbólummá golyo néven. 4. A 72. cellában helyezzen el egy kulcskeretet. A golyó példányát vonszolja a színpad jobb szélére. 5. Egy közbens! cellát kijelölve a Window/Panels/Frame panel Tweening mez!jének értéke legyen Motion. 6. A hatter rétegen helyezzen el egy vízszintes vonalat az alap érzékeltetésére. 7. Készítsen két nyomógomb szimbólumot, az egyiket start, a másikat stop néven. Helyezze egy példányukat a gombok réteg els! cellájába. 8. A start nyomógombot kiválasztva kattintsunk kett!t a Window/Actions menüparancs hatására megnyíló ablakban megjelen! Play akción.

57

Reklámgrafika

Gyakorlatok

9. A stop nyomógomb esetében hasonlóan járhatunk el, csak ebben az esetben a Stop akción kell duplán kattintanunk.

4.10.2. Példa moziklip alkalmazására. Induljunk ki az el!z! filmb!l. Alakítsuk át a filmet úgy, hogy a golyó mozgása egy moziklipben legyen. 1 A Shift és Ctrl billenty"k használatával jelöljük ki a golyo és a hatter rétegek kereteit. 2. Az Edit/Cut Frames menüparancs segítségével vágjuk ki a kijelölt kereteket. 3. Hozzunk létre egy új moziklip szimbólumot golyo_mc néven. Álljunk rá a moziklip els! keretére.

58

Reklámgrafika

Gyakorlatok

4. Az Insert/Paste Frames menüparancs segítségével illesszük be a kivágott kereteket. 5. A szimbólumkönyvtárban álljunk rá a golyo_mc moziklipre. A Window/Panels/Instance menüparancs hatására megnyíló ablakban adjuk a klipnek a moziklip nevet. 6. A f!id!vonalon töröljük a hatter nev" réteget. 7. Vonszoljuk a golyo_mc nev" moziklipet a f!id!vonal golyo rétegének els! keretébe. 8. Mind a gombok, mind a golyo réteg els! utáni kereteit töröljük az Edit/Remove Frames menüpont segítségével. 8. A nyomógombok szkriptjeit módosítsuk a következ!képpen. Jelöljük ki valamelyik nyomógomb színpadon látható példányát. Vigyázat, kett!s kattintással nem a példányt, hanem a szimbólumot jelöljük ki. A Window/Actions hatására megnyíló ablak jobb oldalán található szkriptet töröljük ki. Ezután kett!s kattintás a with akción, majd az ablak jobb alsó sarkában található áthúzott karikára kattintva meghatározhatjuk, hogy az akció esetünkben a moziklip nev" objektumra vonatkozzon. Végül a start nyomógomb esetén a play, a stop nyomógomb esetén a stop akciót választva a következ! szkripteket kapjuk.

59

Reklámgrafika

Gyakorlatok

4.10.3. Példa moziklipbe ágyazott moziklipre A moziklipek egymásba ágyazása párhuzamosan, de nem szinkronban futó moziklipek megvalósítását teszi lehet!vé. A moziklip alkalmas arra, hogy a színpad egész felületén érzékelje a billenty"zet egy tetsz!leges gombjának lenyomását. Induljunk ki az el!z! filmb!l. A film alsó golyója, hasonlóan az el!z! filmhez, elindítható illetve megállítható a start illetve stop gombokkal. A beágyazott moziklip által megjelenített fels! golyó a billenty"zet egy tetsz!leges gombjának a lenyomásával léptethet!. 1. Készítsük el a golyo2 nev" grafikus szimbólumot. 2. Hozzunk létre egy golyo2_mc nev" moziklipet. A moziklip fels! rétegének neve legyen akciok, az alatta lév! réteg neve legyen golyo2. 3. A golyo2 rétegben építsünk fel egy kockánkénti animációt úgy, hogy a golyót a színpad jobb oldaláról fokozatosan átmozgatjuk a bal oldalra. 4. Az akciok rétegnek az utolsót kivéve minden cellájához rendeljük a stop () akciót. Az utolsó cellához rendeljük a gotoAndPlay (1) akciót, amivel a moziklip ismételt lejátszását tesszük lehet!vé. 5. A jelenetre váltva, csak a megértés megkönnyítéséért, a golyo nev" rétegnek adjuk a golyok nevet. 6. Helyezzük el a golyo2_mc szimbólum egy példányát a f!id!vonal golyok rétegének els! cellájában. 60

Reklámgrafika

Gyakorlatok

7. Készítsünk egy billentyu nev" moziklip szimbólumot. A moziklip egyetlen objektuma a színpad közepére kerül! "Nyomjon meg egy gombot a billenty"zeten" felirat legyen. 8. Vonszolással helyezzük a moziklip egy példányát a f!id!vonal gombok rétegének els! cellájába. 9. A billentyu szimbólum példányához rendeljük a következ! szkriptet. onClipEvent (keyDown) { with (_root.moziklip.moziklip2) { nextFrame(); } } Ezt megvalósíthatjuk szakért! módban (Expert Mode) begépeléssel.

Normál módban (Normal Mode) ugyanezt a kódot menük segítségével állíthatjuk el!. A két mód között a Window/Actions menüparancs hatására megnyíló ablak jobb fels! sarkában található jobbra mutató kis háromszög segítségével válthatunk. Hogy éppen melyik módban vagyunk, azt az ablak jobb alsó sarka mutatja. Ha egy ikont (áthúzott karika) látunk csak, akkor szakért! módban, míg két ikon esetén normál módban vagyunk.

61

Reklámgrafika

Gyakorlatok

4.11. Mez! Készítsünk olyan két kockából álló animációt, amelyik az els! kockán bekéri a felhasználó vezeték- és keresztnevét, majd a második kockán együtt kiírja azokat. 1. Hozzunk létre egy szöveges objektumot az els! kulcskockán "Vezetéknév:" tartalommal. 2. T!le jobbra készítsünk egy rögzített hosszúságú szöveges objektumot. A Text/Options menüpont hatására megnyíló ablakban válasszuk az Input Text opciót, a Variable mez! értéke legyen vezeteknev. 3. Ismételjük meg az els! két lépést "Keresztnév:" tartalommal, a beviteli mez! neve legyen keresztnev. 4. Helyezzünk el egy jobbra mutató nyilat ábrázoló nyomógombot. 5. A második cellába szúrjunk be egy kulcskeretet. A kulcskockán helyezzünk el egy szöveges objektumot "Teljes név:" tartalommal. T!le jobbra egy rögzített hosszúságú szöveges mez!t Dynamic Text választással, a mez! neve legyen teljesnev. 6. Helyezzünk el egy visszafelé mutató nyilat ábrázoló nyomógombot. 7. Az els! kockához rendeljük a stop () akciót, a másodikhoz a következ! szkriptet. stop (); teljesnev = vezeteknev+" "+keresztnev; 8. Az els! illetve a második kockán lév! nyomógombhoz rendeljük a következ! szkripteket on (release) { gotoAndPlay (2); }

62

Reklámgrafika

Gyakorlatok

on (release) { gotoAndPlay (1); } 4.12. Hóesés 1 Nyissunk meg egy új mozit, vagy készítsünk egy új havazas nev" réteget egy már meglév! mozi fölé. Ha új filmet készítünk, akkor a legfels! réteg alá tehetünk egy hatter nev" réteget is. 2 Készítsük el a hópehely grafikáját a havazas rétegen. Helyezzük a grafikát a színpad fölé egy kissé balra. 3 Alakítsuk moziklip típusú szimbólummá, a szimbólum neve legyen pehely 4 Másoljuk le a havazas rétegen lév! most már moziklip típusú példányt egy kissé jobbra.

5 A Window/Panels/Instances menüpont segítségével a pehely szimbólum ezen új példányának adjuk a hopehely nevet.

63

Reklámgrafika

Gyakorlatok

6 A baloldali pehely helyi menüjéb!l válasszuk ki az Actions menüpontot. Az ablak jobb fels! sarkában lév! jobbra mutató háromszögre kattintva, az ekkor kinyíló párbeszédablakban válasszuk az Expert Mode lehet!séget. Ez azt eredményezi, hogy szövegként szerkeszthetjük az ActionScript nyelven írt akciókat. Az ekkor kinyíló ablakba írjuk be a következ! szkriptet. onClipEvent (load) { clipCount = 0; } onClipEvent (enterFrame) { checker = random(100); if (checker<=8) { clipCount += 1; duplicateMovieClip (_root.hopehely, "hopehely"+clipCount, clipCount); if (clipCount == 100) { clipCount = 1; } } } 7 A második, kissé jobbra lév! hopehely nev" példány esetében járjunk el az el!z! pontban leírtak szerint. A kinyíló ablakba írjuk be a következ! szkriptet. 64

Reklámgrafika

Gyakorlatok

onClipEvent (load) { this._x = random(300); this._y = -10; yCenterSpin = 0; xCenterSpin = this._x+100; yscaleIt = 1; xscaleIt = 1; this._yscale=100; this._xscale=100; } onClipEvent (enterFrame) { if (this._yscale<=-100) { yscaleIt *= -1; } else if (this._yscale>=100) { yscaleIt *= -1; } if (this._xscale<=-100) { xscaleIt *= -1; } else if (this._xscale>=100) { xscaleIt *= -1; } if (random(10)<=1) { yscaleIt *= -1; } if (random(10)<=1) { xscaleIt *= -1; } if (yscaleIt>0){ this._rotation+=5; } if (yscaleIt<0){ this._rotation-=5; } this._yscale -= yscaleIt*5;

65

Reklámgrafika

Gyakorlatok

this._xscale -= xscaleIt*5; yCenterSpin += 3; this._y += yVelocity; this._x += xVelocity; if (this._y>=yCenterSpin) { yVelocity -= 1; } else if (this._y<=yCenterSpin) { yVelocity += 1; } if (this._x>=xCenterSpin) { xVelocity -= 1; } else if (this._x<=xCenterSpin) { xVelocity += 1; diff = yCenterSpin-this._y; yVelocity += diff/200; diff = xCenterSpin-this._x; zVelocity += diff/200; } if (this._y>=800) { this.removeMovieClip(); } }

66

Reklámgrafika

Irodalom

5. Irodalom [1] Bonnie Blake: Macromedia Flash 5, Panem Budapest 2001 [2] Eddie Carroll: www.flashkit.com/tutorials/Reviews/Flash_5_Eddie_Ca-140/index.shtml [3] Michael Kay: webdesign.about.com/library/weekly/aa082098.htm [4] Perjés László: Gondolatok az Internet reklámról és az Internet marketingr!l, http://www.lezlisoft.com [5] Robert Reinhardt - Jon Warren Lentz: Flash 5 Biblia I-II, Kiskapu Kft 2001 [6] Vásárhelyi Péter - Szeg! Tamás: Flash 5 kézikönyv, Horváth és Fellner Kft

67