FlashEff2Tutorials

1.Createanimageshowandhideeffect
1.CreateanewActionScript3.0Flashfile:File>New,selectFlashFile(ActionScript3.0).Inthe Propertiespanel,settheframerateoftheFlashmovieto30fps. 2.Importyourimageintoyourproject:File>Import>ImporttoStageandselecttheimagefrom yourlocalcomputerthatyouwishtousefortheeffect. 3.Withtheimageselectedonthestage,transformitintoasymbol(pressF8orModify>Convert tosymbol).IntheConverttoSymboldialogboxgiveyourclipaname,setthetypetoMovieClip andpressOK. 4.[optional]Ifitisn'talreadyselected,selectthenewmoviecliponthestageandgiveitan instancenameof"myClip".Ifyoudonotgiveitaninstancename,FlashEff2willautomatically assignitoneintheformof"InstanceName_*",where"*"representsanindexnumber(starting from0). 5.OpentheComponentspanel(Window>ComponentsorCtrl+F7forWindows/Cmd+F7forMac OS)andfromtheFlashEff2folderselectthecomponentanddragitovertheimagecliponthe stage. 6.OpentheFlashEff2Panel(Window>Otherpanels>FlashEff2Panel)andsignintoyour JumpeyeComponentsaccount.Ifyouarealreadysignedin,makesurethattheFlashEff2instance youplacedonthestageisselectedsothatthepanelwillloadthesettingscontrols. 7.IntheFlashEff2PanelselecttheShowtabtobringupthelistofavailablepatterns.Inthe Patterntab,selectSymbol(itisselectedbydefault)tolistthesymbolpatternsandchoosethe FESAlphapatterntoapplyanalphaeffect. 8.ThisbringsupthelistofavailablepresetsoftheFESAlphapattern(theFreeFlashEff2version willonlyhaveonepresetavailable).Youcanchooseoneofthepresetsthatyouwouldliketo applyontheimage.IfyouhavethePremiumPlusversion,you'llbeabletofurthercustomizethe effectbypressingthe"Editsettings"buttonthatopensthelistofpropertiesforthechosen pattern. 9.Next,selecttheTweentabtochangetheeasingtypefromeaseInOuttoeaseOutandsetthe lengthoftheshoweffect(tweenDuration)to3seconds. 10.TheOptionstaballowsyoutospecifywhethertheshoweffectwillautomaticallyexecuteor notandtheamountoftimethecomponentshouldwaitbeforeapplyingtheshoweffect.Forthis exampleyoucanleavethesettingsastheyare. 11.Thehideeffectcanbesetupexactlythesamewayastheshoweffect.SoselecttheHidetab toopenthelistofpatternsandthenchooseSymboltolistthesymbolpatterns. 1

 12.Selectthe"FESChaoticMasks"patternandthenselectapresetthatyou'dliketobeapplied. 13.IntheOptionstabsetthedelayparameterto5seconds(thetimefromtheendoftheshow effecttothebeginningofthehideeffect). 14.Onceyousettheshowandhideeffects,youcantestyourfilebypressingCtrl+Enterfor WindowsorCmd+EnterforMacOS.

2.Createatextshowandhideeffect

1.CreateanewActionScript3.0Flashfile:File>New,selectFlashFile(ActionScript3.0).Inthe Propertiespanel,settheframerateoftheFlashmovieto30fps. 2.SelecttheTextTool,placeatextfieldonthestageandthenwritesometextinthetextfield. 3.Withthetextfieldselected,setitupfortheeffect:inthePropertiespanelgiveittheinstance nameof"myText",setthetypetobe"DynamicText",theantialiassettingmustbe"Antialiasfor animation",enablethe"RendertextasHTML"optionandpresstheEmbedbuttontoopenthe EmbedCharactersdialogbox.Inthedialogboxpressthe"Autofill"buttontoembedonlythe charactersfromthetextfield. 4.OpentheComponentspanel(Window>ComponentsorCtrl+F7forWindows/Cmd+F7forMac OS)andfromtheFlashEff2folderselectthecomponentanddragitoverthetextfieldonthe stage. 5.OpentheFlashEff2Panel(Window>Otherpanels>FlashEff2Panel)andsignintoyour JumpeyeComponentsaccount.Ifyouarealreadysignedin,makesurethattheFlashEff2instance youplacedonthestageisselectedsothatthepanelwillloadthesettingscontrols. 6.IntheFlashEff2PanelselecttheShowtabtobringupthelistofavailablepatterns.Inthe Patterntab,select"Text",whichliststhetextpatterns,andchoosethe"FETBlur"patterntoapply analphaeffect. 7.Inthepresetslistthatopensup(theFreeFlashEff2versionhasonlyonepresetforeach pattern)youcanchooseanypreconfiguredpresetthatyoulike. 8.IfyouhavethePremiumPlusversion,selectthe"Editsettings"buttontoeditthepropertiesof theblureffect.Tochangethewaycharactersaredisplayedfromthe"preset"propertylist,select "random".Thiswaythecharacterswillbedisplayedinarandomorder.Fromthepreviewareain thetopleftcorneryoucanseehowtheeffectwilllooklike.Ifyouwanttousethesesettingslater on,youcansaveyourpresetbypressingonthe"Savepreset"buttonandgivingitaname. 9.SelecttheTweentabandcheckthe"Usecustomtweening"optiontoallowyoutocustomize thetween.FromthetweenTypelistselect"Bounce". 10.TheOptionstaballowsyoutospecifywhethertheshoweffectwillautomaticallyexecuteor 2

notandtheamountoftimethecomponentshouldwaitbeforeapplyingtheshoweffect.Forthis exampleyoucanleavethesettingsastheyare. 11.Thehideeffectcanbesetupexactlythesamewayastheshoweffect.ThusselecttheHidetab thatopensthelistofpatternsandthenchoose"Text"tolistthetextpatterns. 12.SelecttheFETMagneticWindpatternandselectapresetthatyou'dliketobeapplied. 13.Tofurthercustomizetheeffect,pressonthe"Editsettings"button(featureavailableonlyfor thePremiumPlusversion)andfromthepresetlistselect"char:random(d1)".Thiswillapplythe effectoncharactersinarandomorder. 14.IntheOptionstabsetthedelayparameterto5seconds(thetimefromtheendoftheshow effecttothebeginningofthehideeffect). 15.Onceyousettheshowandhideeffects,youcantestyourfilebypressingCtrl+Enterfor WindowsorCmd+EnterforMacOS.

3.ApplyFlashEff2filters

1.CreateanewActionScript3.0Flashfile:File>New,selectFlashFile(ActionScript3.0).Inthe Propertiespanel,settheframerateoftheFlashmovieto30fps. 2.Importyourimageintoyourproject:File>Import>ImporttoStageandselecttheimagefrom yourlocalcomputerthatyouwishtousefortheeffect. 3.Withtheimageselectedonthestage,transformitintoasymbol(pressF8orModify>Convert tosymbol).IntheConverttoSymboldialogboxgiveyourclipaname,setthetypetoMovieClip andpressOK. 4.[optional]Ifitisn'talreadyselected,selectthenewmoviecliponthestageandgiveitan instancenameof"myClip".Ifyoudonotgiveitaninstancename,FlashEff2willautomatically assignonetoitintheformof"InstanceName_*",where"*"representsanindexnumber(starting from0). 5.OpentheComponentspanel(Window>ComponentsorCtrl+F7forWindows/Cmd+F7forMac OS)andfromtheFlashEff2folderselecttheFlashEff2anddragitovertheimagecliponthestage. 6.OpentheFlashEff2Panel(Window>Otherpanels>FlashEff2Panel)andsignintoyour JumpeyeComponentsaccount.Ifyouarealreadysignedin,makesurethattheFlashEff2instance youplacedonthestageisselectedsothatthepanelwillloadthecontrolstomakethesettings. 7.IntheFlashEff2PanelselecttheFilterstabtostartapplyingfilters.You'llseethattheFiltertab hasthreemoretabsavailable:"Select1stfilter","Select2ndfilter"and"Select3rdfilter".Thisis becausethepanelallowsyoutoapplyuptothreefiltersonthesametargetobject. 8.Selectthefirsttabtoapplyonefilterontheimage.Thiswillopenthelistoffilterpatterns 3

available. 9.Fromthatlist,select"WaterReflection"toapplytheWaterReflectionfilter. 10.Inthepresetslistthatopensup(theFreeFlashEff2versionhasonlyonepresetforeach pattern)youcanchooseanypreconfiguredpresetthatyoulike. 11.Tofurthercustomizethefilter,pressonthe"Editsettings"button(featureavailableonlyfor thePremiumPlusversion),setthe"reflectionAlpha"propertyto1andthe"reflectionRatio"to 127. 12.Ifyoutestyourclipnow(Ctrl+EnterforWindowsorCmd+EnterforMacOS)you'llseethat yourimagewillhaveawaterreflection.

4.CreatebuttonsandapplycommandswithFlashEff2

1.CreateanewActionScript3.0Flashfile:File>New,selectFlashFile(ActionScript3.0).Inthe Propertiespanel,settheframerateoftheFlashmovieto30fps. 2.Youcanturnyourimages,shapesandtextintobuttonsusingFlashEff2. 3.Tocreateabuttonfromanimageimportyourimageintoyourproject:File>Import>Importto Stageandselecttheimagefromyourlocalcomputerthatyouwishtousefortheeffect. 4.Withtheimageselectedonthestage,transformitintoasymbol(pressF8orModify>Convert tosymbol).IntheConverttoSymboldialogboxgiveyourclipaname,setthetypetoMovieClip andpressOK. 5.[optional]Ifitisn'talreadyselected,selectthenewmoviecliponthestageandgiveitan instancenameof"myButton".Ifyoudonotgiveitaninstancename,FlashEff2willautomatically assignonetoitintheformof"InstanceName_*",where"*"representsanindexnumber(starting from0). 6.OpentheFlashEff2Panel(Window>Otherpanels>FlashEff2Panel)andsignintoyour JumpeyeComponentsaccount.Ifyouarealreadysignedin,makesurethattheFlashEff2instance youplacedonthestageisselectedsothatthepanelwillloadthecontrolstomakethesettings. 7.IntheFlashEff2PanelselectthePresetstabtoopenthelistofbuttonpresets.Ifyouhavethe FlashEff2Premiumversion,youwillbeabletoselectfrommultiplepreconfiguredpresets, otherwisetherewillbeonlyoneavailable:thedefaultpreset. 8.Tofurthercustomizethebuttonstates(up,overanddownstates)youcanselectthe"Edit settingsandstates"buttontobringupthesettingsforthethreestatesofthebutton(thisfeature isavailableonlyfortheFlashEff2PremiumPlusversion). 9.Tocontinue,opentheOptiontabandcheckthe"useHandCursor"optionsothathandcursoris displayedoverthebutton. 4

 10.Now,youcantesttheflashclip(Ctrl+EnterforWindowsorCmd+EnterforMacOS)andthe buttonwillbeworking(itreactstothemouseactivities:rollover,rollout,pressandrelease). 11.Thefinalstepistoapplysomeactiontothebutton.YoucaneitherdoitbyusingActionScript codetolistentothebuttoneventsandexecutesomeactionsontheappropriateoneorsimplyby usingFlashEff2commands.WiththeFlashEff2Panelopened,insidetheButtontab,selectthe Commandtab.Hereyouwillbeabletoaddasetofcommandstoyourtargetobject. 12.Clickonthe"Add"buttonandfromtheopeninglistselect"FECNavigateToURL".Thispattern opensawebpageinyourbrowser. 13.Fromthe"evenType"listselect"release"tosetupthepatterntoexecuteonthemouse releaseactionoverthetargetbutton.Leavethe"browserTarget"propertytoopenthewebpage inanewwindow("_blank")andtypetheURLtothedesiredwebpageinthe"url"textbox. 14.TesttheapplicationbypressingCtrl+EnterforWindowsorCmd+EnterforMacOSandifyou clickonthebuttonyouhavepreviouslycreated,you'llseethatnowitalsoopensthetargetweb pageintoyourbrowser.

5.CreatealoopinganimationwithFlashEff2

TheeasiestwaytocreatealoopinganimationwithFlashEff2istocreatethetimelineanimation spannedacrossmultipleframesaslongastheFlashEff2animationisplaying.Itisverysimilarto creatingasymbolortextshowandhideanimationpresentedintheprevioustutorials. 1.Thesimplestwaytocreateashowandhideanimationonthetargetobjectistouseasingle FlashEff2Componentinstance(forboth,theshowandthehideanimations).Onceyoumanaged tocreatesuchananimation(pleaserefertotutorials1and2)youneedtomakeplayagainand again,inotherwords,toloop. 2.Forthis,yousimplyneedtoexpandtheanimationtoasmanyframesasnecessarytoplaythe entireanimation. 3.Firstofall,werecommendthatforsuchtimelineanimations,youstartFlashEff2fromthe secondframeon,sothattheFlashEff2hasenoughtimetoinitialize.Ifyoufollowedthetutorials onhowtocreateshow/hideanimationsforimagesandtexts,thenfromthetimelineselectthe frame(s)containingthetargetobjectandtheFlashEff2Componentinstanceanddragthemtothe secondframe(youcanotherwisecreatetheshow/hideanimationdirectlyonthesecondframe). 4.Next,youneedtocalculatehowmanyframesshouldtheanimationplayonthetimeline.You needtoknowtheframerateofyourFlashclip(athowmanyframesperseconditissettoplay) andthetotaltimeofyourFlashEff2animation. TheFlashEff2animationcontainsashowanimationthatissettoplayforanamountoftimesetin theTweensubtaboftheShowtab(tweenDurationparameter)whichbydefaultis2seconds.To thattimeyouneedtoaddthedelaybeforetheshowanimationstarts,whichisgivenbythedelay 5

parameterintheOptionssubtaboftheShowtab.Thisoneisusually0sotheshowanimation startsassoonastheFlashEff2Componentinstanceisplacedonthestage,overthetargetobject. Next,thereisapausebetweentheshowandhideanimationswhichissetthroughthedelay parameterintheOptionssubtaboftheHidetab(thisoneisalso2secondsbydefault)andfinally thehideanimationwhichalsohasatweenDurationparameter(2secondsbydefault).Ifyouadd upthesefourvaluesyougetthetotalamountoftimethattheFlashEff2Componentinstanceand thetargetobjectshouldbeonthestage,incaseofatimelineanimation.Inthisparticularexample (allvaluesareleftasdefaults)thetotaltimewouldbe6seconds:0seconds(delayforshow)+2 seconds(showanimation)+2seconds(delayforhide)+2seconds(hideanimations). Thisvaluenowhastobetransformedintoanumberofframes.Thiscanbeachievedsimplyby multiplyingthetimeinsecondswiththeframerateofyourclip.Inthiscase6seconds*30fps= 180frames.SotheFlashEff2instanceandtheimageshouldspanacross180frames,fromthe secondframetothe181stframe. 5.So,onyourtimelinenavigatetoframe181,selectitandpressF5toexpandtheframesto181.If yourFlashEff2andimageareplacedontwoseparatelayers(liketheattachedexample),thanyou needtodothisoperationforbothframes. 6.Ifyoutestyourclipnow(Ctrl+EnterforWindowsorCmd+EnterforMacOS)you'llseethatthe show/hideanimationofyourtargetobjectislooping.Oncethehideanimationhasfinishedthe playheadalsoreachestheendofthetimelineandmovesbacktothefirstframetoplaythe contentsagainandagain.

6.TimelineanimationswithFlashEff2

Timelineanimationsaremadeexactlythesameasintheprevioustutorial(Createalooping animationwithFlashEff2).Theattachedexamplecontainsashow/hideanimationonanimage andtwomoreshow/hideanimationsontext.Alltheassets(FlashEff2Componentinstances,the imageandtextfields)areplacedonseparatelayerstoeasilyaccessthemlateron. Eachsetofanimationsstartsfromadifferentframesothattheanimationsareconsecutiveand evenmore,thetwotexteffectshaveacrossfadelikesequence:theshowanimationonthe secondtextfieldstartsatthesameframewherethehideanimationofthefirsttextfieldis supposedtostart.Sothetwoanimations(hideandshow)areplayingatthesametimeto simulatethecrossfadelikeeffectbetweenthem. Theanimationsstopattheverylastframebecauseofthestop()command.Ifyouwouldlikethem toloopcontinuously,simplyremovethestop()commandfromthelastframe.