Documenti di Didattica
Documenti di Professioni
Documenti di Cultura
FLASH MX2004
Nivel:Bsico
AUTOR:CristinParraoparrao@mapmultimedia.cl
SUMARIO
1.ElObjetivodeestemanual......................................................... 4
2.QuesFlash........................................................................... 5
2.1.HistoriadeFlash
2.2.QuesActionscript
3.Interfazdelprograma............................................................. 10
3.1.Men
3.2.Paneles
3.3.Propiedades
3.4.BarradeHerramientas
4.OrganizacindeObjetos........................................................ 21
5.LneadeTiempo................................................................... 24
6.TiposdeFotogramas........................................................... 27
6.1.FotogramaSimple
6.2.FotogramaClave
6.3.FotogramasVacos
6.4.reasinFotograma
7.AnimacinFotogramaaFotograma.................................... 31
7.1.Capas
7.2.PapelCebolla
8.AnimacinporInterpolacin................................................ 38
9.AnimacinporForma......................................................... 40
9.1.ConsejosdeForma
9.2.Aceleracin/Desaceleracin
10.AnimacinporMovimiento.................................................. 44
10.1.CreacindeSmbolosGrficos
10.2.Biblioteca
10.3.LaInterpolacin
10.4.CapaGua
10.5.Mscara
11.Botones............................................................................. 54
12.AccionesBsicas.............................................................. 58
12.1.Accionesdeunbotn
13.Navegacin....................................................................... 64
CristinParraoparrao@mapmultimedia.cl 2
14.Escenas............................................................................ 67
14.1.Navegacinentreescenas
14.2.Navegacinexterna
15.ClipdePelcula................................................................ 72
15.1.BotnAnimado
15.2.ControldeunClipdePelcula
15.2.1.Instancias
16.Importacindeobjetos..................................................... 81
16.1.Imgenesvectoriales
16.2.ImgenesdeMapadeBits
16.2.1.VectorizarImgenesdeMapadeBits
16.3.Sonidos
16.4.Video
17.PublicacinyExportacin.............................................. 91
18.Ejecutables...................................................................... 95
CristinParraoparrao@mapmultimedia.cl 3
1.Elobjetivodeestemanual
Hola,minombreesCristinParrao(parrao@mapmultimedia.cl),elautorde
estemanual.Suobjetivoesserunaguadeayudaalasclasesquevoyaimpartir.
Enesesentido,nopretendeseruncursoensmismo,sinounapoyopara
recordarlosprincipiosbsicosdeestesoftware.
AprenderahacercosasbsicasconFlashnoesdifcil,peroaprendera
dominarunsoftwarerequieretiempo,dedicaciny sobretodomuchapaciencia
(cranmequelahedesarrolladobastante).
ConozcoamuchosquesedeclaranconocedoresdeFlashyenrealidad,
muevenuncuadradoyyaest.Deesosestplagadoestemercadoysutrabajo
esbastantemediocre.PoresocuandocomencaestudiarFlash4medicuenta
queeraunsoftware,queademsdeentretenido,lograbaquetuvierasunamanera
depensardiferentealosotrosprogramasdeltipoagarro,pegoylistoyque,si
queleponasdedicacin,tepodasdistinguirdelosdems.Bueno,laapuestame
resultbuena.AFlashlehaidomuybienensupenetracinycadadahayms
deseoporpartedelasempresasdeocuparestaherramienta,loqueatodosnos
favorece.
Flashllegparaquedarse,aprendamosdel.
(Estemanualsepuededescargardesde
http://www.mapmultimedia.cl/parrao/Fla_Basico_Parrao.pdf)
CristinParraoparrao@mapmultimedia.cl 4
2.QuesFlash
CristinParraoparrao@mapmultimedia.cl 5
FlashesunsoftwarepertenecientealaempresaMacromedia(
www.macromedia.com)elcualpermitecrearanimacionesquesepuedensubira
laredabajopeso.Esasanimacionespuedengenerarsedesdeelpropiosoftware
oimportandoimgenesysonidos.Sisegenerandesdeflash,sehacenatravs
devectores,loqueledaunpesomuybajoalosarchivos,sonfcilesdemanejary
ademssonescalables(adiferenciadelasimgenesdeMapasdeBits).
QuesunaAnimacin?
Seriedeimgenesconsecutivasdibujadasofotogrficasque,bajociertascondiciones,
reproducenlasensacindemovimiento.Lasimgenespuedenobtenersesobreuna
pelculayproyectarse,comoenlosdibujosanimados,opegarseenlaspginasdeun
libroyobservarseenrpidafrecuencia.
http://www.datared.com/diccionario_audiovisual/a.htm
Macromedia,hastalafechadeimpresindeestemanual,acabadeanunciar
laversin8deFlash(agosto2005).Enestemanualveremoslaversin7(Flash
MX2004).(AchayunartculointeresanterealizadoporRodrigoDuarte,quees
miembrodelMMUG,sobreelStudio8)
http://www.mmug.cl/articulos.php?id=249&tod=1)
ParaverarchivosdeFlashenInternet,debestenerunpequeoplayer(lector)
quepermitaejecutarlos.Muchagentelotiene,probablementettambin.Sino
fueraas,puedesdescargarlogratisdesde:
http://www.macromedia.com/shockwave/download/download.cgi?P1_Prod_Versio
n=ShockwaveFlash&Lang=Spanish&P5_Language=Spanish
2.1.HistoriadeFlash
(Historiasacadadehttp://dibujante.blogalia.com/historias/22722)
LahistoriadeFlashcomienzacuandoelarquitectoJonathanGaydescubriqueelmundode
losplanosylasmaquetasnoeraloquerealmenteestababuscandoensuvida.Fueentonces
cuandodescubriAppleIIylasventajasquelaprogramacinpodatraeralmundodeldiseo.
Susiniciosenlaprogramacininiciaronconlarealizacindejuegossencilloshechosen
Basic.Despus,aldescubrirPascalrealizsuprimereditordeImgenes:SuperPaint,loquele
otorgunpremioenlaferiadecienciasdesupreparatoria.
CristinParraoparrao@mapmultimedia.cl 6
Porcasualidad,enungrupodeusuariosdeMacintosh,GayconociaCharlieJacksonelcual
estabaenplanesdefundarSiliconBeachSoftware.JacksoncontratmediotiempoaGayylo
empujparaquerealizarAirboneI,elprimerjuegoparaMacquetenasonidodigital.
DespusdeseguireneldesarrollodevideojuegosytrabajarenSuperPaintII,Gaycomenza
trabajardetiempocompletoenSiliconBeachSoftware,inicindoseenelmundodelC++,y
tratandodedesarrollarsoftwareparaeldesarrollodegrficosquenoslocorranenMacintosh,
sinotambinenWindows.
ElsiguienteprogramaparaeldesarrollodegrficosfueelIntellidraw,quetratabadecompetir
conAdobeIllustratoryelAldusFreehand(elcualdespusseraadquiridoporMacromedia).La
ventajaqueofrecaelIntellidraw,esquenosloeraunaherramientadedibujo,sinoquepoda
otorgarcomportamientoalosgrficos,comomanejargrficasdebarrasintroduciendovalores
numricos.
DespusdehaberganadomuchodinerodesarrollandovideojuegosysoftwareparaSilicon,
Gaydeciditomarunnuevoretoyfundarsupropiacompaa:FutureWaveSoftware,conlaoficina
principalenSanDiego,lacualinicienEnerode1993ytenalamisindedominarelmercadode
losprogramasparalamanipulacindegrficos,fcilesdeusaryconmsherramientasparael
usuario.
PoraquelentoncesMicrosofttenasuMSDOS6.0yWindows3.1.
UnodelosproductosquerealizlanuevacompaafueelSmartSketch,(presentadoen
Noviembrede1994paraWindows3.1,enMayode1995paraMacintosh,enAgostode1995para
plataformasWindows95/NT),elcualpara1995,recibimuchoscomentariosporpartedelos
usuariosparaqueconvirtieranestesoftwareenunprogramadeanimacin,unmomentoenelque
laanimacinslosedistribuaatravsdeVHSoCDROM,ydondeelmercadodeanimacinera
muyreducido.
SmartSketchfuediseadoparacaptarlaatraccindelasimgenespintadas,laprecisinde
unprogramadedibujoylalibertaddedibujarsobrepapel.Estefueelprimerodelosprimeros
programasdedibujodeprecisinquepermitatrabajarcondibujosvectorialesutilizando
herramientastpicasdeprogramasdedibujo.
EneltiempoenqueInternethacasudebutalosojospblicos,laposibilidaddecrear
animacionesendosdimensioneshabraunnichodemercadoaFutureWave.
LaevolucinllegatalgradoquecomenzaronacrearpluginsparaNetscape,queenun
iniciocorranmuylentamente.EnestemomentoelprogramarecibielnombredeFutureSplash
Animator(tambinllamadoCellAnimator).
CristinParraoparrao@mapmultimedia.cl 7
LacompaahabadescubiertoelimpactoqueibaatenerelFutureSplashyfueentonces
cuandoacudieronconlosejecutivosdeAdobeen1995,loscualesmostraronintersenel
SmartSketchperolasfuncionesdelFutureSplashleparecieronobsoletas
Fuehasta1996,cuandoMicrosofttrabajabaenlanuevaversindeMSNdeseandolams
cercanaexperienciatelevisiva,porloqueelFutureWavesseconvirtiensuopcin.
Sinembargo,nofuehastaNoviembrede1996cuandoMacromediainvitaFutureWavea
trabajarjuntos,yposteriormenterealizarlacompradeesta,conloqueparadiciembredeese
mismoaoFutureSplashAnimatorseconvirtienMacromediaFlash1.0.
FutureSplashAnimatorfueunprogramadeanimacinen2Dparalaworldwidewebbasado
enlatecnologadedibujodelSmartSketch.Permitiendoalosdiseadoresyrealizadoresde
pginaswebcrearentornosgrficosdepginaswebsvectorialeseinteractivoscomoporejemplo,
botones,panelesdenavegacin,dibujostcnicos,bannersdeanuncios,etc.yluegoanimarlos.
Enlosaos97,98,99,yahacayomispinitosconlasversiones,3y4deFlashqueinclusoen
esosaos,noestabatanimplantadocomoahora,yerararoencontrargentequesupieseusara
fondoesteprograma,inclusoenalgunasdelasempresasporlasqueestuveesosaos,
despreciaronesteprogramasindarlemuchointerscuandoyolesproponausarloyavanzarcon
l.
Hoyenda,FLASHesunaherramientaquedistamuchodeloquefueensucomienzo,
aunquelaideaoriginalperdura,ahoralaprogramacinformapartedeunentornogrfico,dndole
unapotenciamuyfuerteeneldesarrollodesitiosweb.Dehecho,ensumomentolleguapensar
queFlashyalritmoqueibaevolucionando,llegaraacomerseaDirector,perodemomentonoha
sidoas.Contodoesto,solocabeesperarunalargavidaaFLASH.
2.2.QuesActionscript:
Seguramentelohasescuchadoanteriormente.Actionscriptesellenguajede
programacinquevieneincorporadoaFlash.Esunlenguajemedianamente
sencilloysusprincipiosbsicospuedeaprenderloscualquierpersona.Perocomo
cualquierlenguaje,tambinrequierepacienciayconcentracin.Escomoaprender
ahablarotroidioma....nadadeimposibles,perosinosalealaprimera,quizssa
lasegunda.
CristinParraoparrao@mapmultimedia.cl 8
EnmuchosladoslosdiseadoresnotocanActionscriptylosprogramadores
nosemeteneneldiseo.Sondosramasqueparecenunidas,perolos
profesionalesseespecializanparadesarrollarsemejorencadaunadeellas.Ypor
supuesto,estnlosotros....losinquietos,lasmarabuntasdelconocimientoque
buscansabercadavezms.Sialguienmepidieraunconsejo,recomendara
especializarseenunrea,perojamsdejardeestaratentoalaotra.Aunqueno
sepascmosehacealgo,siempreesbuenosaberquesloquesepuedehacer.
CristinParraoparrao@mapmultimedia.cl 9
3.InterfazdelPrograma
CristinParraoparrao@mapmultimedia.cl 10
Macromedia,desdelaversin6deFlashcomenzaasemejarlasinterfaces
desusprogramas.Comoasumequetendremosmsdealgunosdesusproductos
(Fireworks,Dreamweaver,porejemplo),lashaconstruidoparecidasparadarle
unaaparienciapropia,queseadefcilidentificacinparalaempresayquenos
guealahoradeadquirirnuevosproductosMacromedia.
AbreFlash(desdeWindowsBotnInicio>Programas>Macromedia>
MacromediaFlashMX2004).Unavezabierto,andaalMenArchivo>Nuevo.En
laventanaescogesDocumentodeFlashyAceptar.
Figura1
UnarchivodeFlashseguardaconunaextensinfla.Eseflaeseditable.Lo
quesemontaenInternetesunarchivoswf,noeditableycomprimido.Veremos
msdetalles,msadelante.
LainterfazdeFlashestdiseadaparaqueseacmodo,ordenadoyfcil
trabajarconelprograma.
Arriba(barraazul)alaizquierdatieneelnombredelarchivoyaladerechalos
tpicosiconosdeWindows(Minimizar,Restaurar,Cerrar)
CristinParraoparrao@mapmultimedia.cl 11
Unpocomsabajo,losmensdetodosoftware(Archivo,Edicin,Ver,
Insertar,etc.)
AladerechapuedesobservarunaseriedePaneles.LosPanelesnosofrecen
unagranayudaparacomplementarnuestrosdesarrollosenFlash.Losquevienen
pordefectononosayudarnmuchoparaestecurso.Puedessacarlosunoauno
(tecolocassobrelyhacesclicconelbotnderecho>CerrarPanel),esconderlos
comoindicalafigura2,ofinalmentedejarlos,yaquenoafectannadaatutrabajo
enFlash.Losiremosviendosegnlosnecesitemos.
Figura2
Esconderpaneles
Lospanelesmsadecuadosparaestecurso,sonlosquepertenecenaMen
Ventana>PanelesdeDiseo.
SiyatehasacostumbradoconungrupodePanelesyquieresqueFlashlos
memorice,andaaMenVentana>GuardarDisposicindePanelesylecolocas
unnombredistintivo.LuegopuedesleerlodesdeMenVentana>Conjuntode
Paneles.
Abajoobservaremos2barrascerradas(AccionesyAyuda)yunaabierta
(Propiedades).EnestaprimeraetapanosinteresaPropiedades.
CristinParraoparrao@mapmultimedia.cl 12
LabarradePropiedadesnosdaindicacionessobrecualquiercosaqueest
seleccionadaenelescenario.Comoahoranotenemosnadaseleccionado,nosda
indicacionesdelapelculaqueacabamosdeabrir.
Hazclicdondeindicalafigura3.
Figura3
Figura4
Estaventanaesunaconfirmacindeloquenosmostrabalabarrade
Propiedades,peroacpodemoscambiarlosvalores.Losmsimportantespor
ahorason:Eltamaodelapelcula,laVelocidaddeFotogramaslaUnidadde
Regla.Teaconsejoqueporahoralasdejescomoestn.Paratodostus
experimentoscambialoquequieras,perosiempreconservalaUnidadderegla
comoPxeles,yaqueesunamedidamuyocupadaenelmundodelasimgenes
digitales.
Elpxel(delinglspictureelement,osea,"elementodelaimagen")eslamenorunidad
enlaquesedescomponeunaimagendigital,yaseaunafotografa,unfotogramade
videooungrfico.
http://es.wikipedia.org/wiki/P%C3%ADxel
CristinParraoparrao@mapmultimedia.cl 13
AlcentrodelainterfazseencuentraelEscenario,queesdondeocurretodolo
quequeremosqueelusuariovea.Ahdibujaremos,traeremoslasimgenes,
cambiaremosdeposicinlosobjetos,etc.
Figura5
ElEscenarioestodoloblanco.Podemosacercarnosoalejarnos
delsegnocupemoslaherramientaZoom.Todologrisquerodea
loblanconoloveelusuarionormalmente.Sepuedencolocar
elementosenesazona,peronosevern.
EltamaodelEscenariocomovimosanteriormentesepuede
editarenlabarradePropiedades.
AlaizquierdaobservaremoslaBarradeHerramientas,lacual
podrsocuparalahoradedibujartusanimaciones,escribirtextoo
pintar.
Estabarrasedivideen:Herramientas,VerColoresyOpciones.
Opcionessonjustamenteeso,parmetrosquepodemoscambiarde
cadaunadelasherramientas.
CristinParraoparrao@mapmultimedia.cl 14
Seleccin :Seleccionacualquierelementoqueestdentrodelescenario.
Siesunafigurasinagrupar,puedeseleccionarpedazos.Paraseleccionaruna
figurasinagrupar,quecontengalnea,sehacedobleclic,delocontrario,se
seleccionasloelrelleno.Otramaneradeseleccionarescolocarelpunteroarriba
alaizquierdadelobjetoysinsoltar,trazarunreaqueencierrealobjeto.
OpcionesImn :Cuandoestactivadoayudaa
acercarlneasypuntascoincidentesdefiguras.
LaherramientaPunteropuedeayudarnosamodificarobjetos.Esdecir,
empujando/estirandosuformaparaobtenernuevosresultados.Estovaletanto
paracurvascomopararectas.Sloteacercasalafigurayesperasqueelicono
delpunterocambie,paraestirar,manteniendoelclicporsupuesto.
SubSeleccin :Muestralosnodosdelascurvasdefigurassinagrupar.Se
puedencontrolarlaformaconlosmanejadoresdecurva.
CristinParraoparrao@mapmultimedia.cl 15
Lazo :Seleccionaformasirregulares(amanoalzada)deundibujono
agrupado.Opciones :SeleccinatravsdepolgonosVaritaMgica(a
travsdetoleranciadecolores)
Lnea :Hacelneasrectas.ConlateclaMayspulsada,selogranlneasen
45
Pluma :Hacefigurasatravsdepuntos.Cadacurvageneramanejadores,
quepuedenvariarse.
Texto :Comocualquierotrosoftwaredesepuedemanejareltextocon
muchosparmetros.Hazclicconestaherramientaenelescenario,escribealgoy
miralabarradePropiedades.Ahencontrarsparacambiareltipodeletra,el
interlineado,eltamao,elcolor,laalineacin,estilos,interletreado,etc.
CristinParraoparrao@mapmultimedia.cl 16
Paratransformaruntextoendibujo,loseleccionas,vasalMenModificar>
Separar.Loquehaceessepararletraporletra.Silohacesporsegundavez,
conviertecompletamenteeltextoendibujo.Pierdesuscaractersticascomotexto,
peroquedaabsolutamentemodificablecomocualquierdibujo.
valo :Hacevalos.ConlateclaMaysculapresionada,logra
circunferencias.
Rectngulo :HaceRectngulos.ConlateclaMaysculapresionada,logra
cuadrados.Opciones: Redondealasesquinas(olomismoatravsdeldoble
clic).
Sitefijasbien,bajoelrectngulohayuntringulo,loqueindicaquecontiene
msdeunaopcin.EnestecasolasegundaopcineslaHerramientaPolyStar.
PolyStar :HacePolgonosyEstrellas.Seleccionalaherramientayenla
barradePropiedades,hazclicenOpciones.Tesaldrestaventanalacualte
permitedarleotrosvaloresatusformas.
CristinParraoparrao@mapmultimedia.cl 17
Lpiz :Permitedibujarlneas,comosifueraunlpizamanoalzada.
Opciones:Enderezar(endurecelascurvas),Suavizar(suavizalascurvas),Tinta
(dejalascurvaslomsparecidoaldibujooriginal)
Brocha :Permitedibujarrellenoscomosifueraunabrochaamanoalzada.
Opciones:Tamaodelabrocha,tipodebrochayformadepintar
Transformacin :Permitetransformarobjetosnoagrupados.Opciones:
Traevariasformasdetransformacin.
TransformacindeRelleno :Paramanejarlasgradientesdelosobjetos.
BotedeTinta :Alaplicarloalalneadeunobjeto,cambiasucolor,segnel
colorseleccionado.
CubodePintura :Alaplicarloalrellenodeunobjeto,cambiasucolor,
segnelcolorseleccionado.
Cuentagotas :Escapazdereconoceruncolordesdeunafotografaodibujo
ylollevaalapaletadecolores.
CristinParraoparrao@mapmultimedia.cl 18
GomadeBorrar :BorraelementosenelEscenario.Condobleclic,borra
todoloqueestenelEscenario.Opciones:Puedeborrardediferentesformasun
objetonoagrupado .
Zoom :Comounalupa,escapazdeacercarseoalejarsedelescenario.
Opciones:ZoomIn/ZoomOut .ParanoestarcambiandodelInydel
Outconstantemente,alpulsarlateclaAlt,lalupacambiaalmodocontrario.
Mano :CuandoelEscenarionosquedamuygrande,esimportantemoverlo
paraverlomsendetallesintenerquealejarse.Paraesolamanonospermite
desplazarlo.
Colores :Elcuadrodearribaseleccionaelcolordeunalneadeun
objetoydeabajosurelleno.Enelcasodelrellenosepuedenincluirgradientes
radialesylineales.
CristinParraoparrao@mapmultimedia.cl 19
Paraeditarestasgradientes,puedeocuparelTransformadordeRelleno
directamenteconelobjetoseleccionadouocuparelpaneldeMezcladorde
Colores(MenVentana>MezcladordeColores)
CristinParraoparrao@mapmultimedia.cl 20
4.Organizacindeobjetos
CristinParraoparrao@mapmultimedia.cl 21
ProbablementeentusexperimentosconFlash(ysinolohiciste,noimporta,te
locuento)tedistecuentadeque2objetosdelmismocolorquesetocansejuntan
odediferentecolorsecomen.
Doscrculosqueluegoseunieronynosepuede
separar.
Acerandediferentecoloryunosecomialotro.
Avecesbuscamosesosefectos,peroavecesnoscomplican.PoresoFlash
nosdalaposibilidaddepoderagruparobjetos,aligualqueotrosprogramas
grficosyevitarestosefectos.
Paralograreso,esmuysencillo.Dibujatuobjeto,seleccinaloyandaalMen
Modificar>Agrupar(oControl+G)yyaest.
Siqueremoseditarlo,muyfcil,hacerdobleclicenl.Loqueocurreesque
entramosalgrupoyFlashnosloadvierteconunapestaa.
CristinParraoparrao@mapmultimedia.cl 22
Luegoparasalirdel,simplementehacemosclicdondediceEscena1.
Siapesardehaberloeditado,decidesquenoquierestenerloagrupado,lo
seleccionasyescogesMenModificar>Desagrupar(oControl+Mayus+G)
Cuandohaymuchosobjetosagrupados,esprobablequequierasordenarsu
formadeapilarse,esdecir,algunosquedaronmsarribaomsdebajodeloque
queras.Paraordenareso,debesseleccionartuobjetoagrupadoeiraMen
Modificar>Organizar>Traeralfrente(siesaestuopcin).Lomsfcilyque
recomiendo,esseleccionarelobjetoeirmoviendosuordendeapilacinconla
teclaControl+Flecha(ArribaoAbajo).
CristinParraoparrao@mapmultimedia.cl 23
5.LneadeTiempo
CristinParraoparrao@mapmultimedia.cl 24
LaLneadeTiempoeslaquenospermitirqueFlashproduzcalasensacin
demovimientoynoseaunaimagenesttica.Sufuncinesimportantsimayme
atrevoadecirloelcorazndeFlashBsico.
Enellavanalojadostodoslosingredientesparaprovocarlaanimacin:
Fotogramas,FotogramasClaves,Acciones,Capas,Etiquetas,interpolaciones,etc.
Figura1
AspectodelaLneadeTiempoalabrirFlash
AspectodelaLneadeTiempoalabrirFlashydibujar
cualquiercosaenelescenario
Comosunombreloindica,implicaqueatravsdeellacorreeltiempo.El
tiempoquenosotrosqueramosypodemosmodificarloagusto.ElFotogramaesla
unidadbsicadetiempomanejadaporFlash.Pordefecto,equivalea1/12de
segundos.Esdecir,quesihay12Fotogramas,hapasado1segundo,sihay24,
hanpasado2segundos,yassucesivamente.12eseltiemporecomendadopara
animacionesenInternet,peroquesepuedemodificar.
AlabrirundocumentonuevoenFlash(Archivo>Nuevo)lalneadetiempo
aparecevaca(rectnguloblancoconcrculoblancoabajodelnmero1)ycuando
dibujamoscualquiercosaenelescenario,elrectngulosepintagrisyelcrculo
negro.NuestropequeoprimerpasoenFlash!!!
CristinParraoparrao@mapmultimedia.cl 25
Bien,enlaFigura1podemosverquehayunrectngulorosadoenelnmero
1.EnrealidadeselCabezaldeLecturaysumisinesrecorrerlaLneadeTiempo
deizquierdaaderecha,segncuntodure.
Alabrirunnuevodocumentolalneadetiempoestanpequeacomosu
unidadbsica:1Fotograma.Esononospermitearmarnosningntipode
movimiento.Alomssirveparaunafoto,peroparaanimacin,no.
Encambiomirenloqueocurreenlafigura2,cuandolalneadetiempola
hemosalargadoa40fotogramas.
Figura2
PuedenfijarseenlaFigura2comoelCabezaldeLecturarecorrelaLneade
Tiempodeizquierdaaderecha.
CuntostiposdeFotogramasexisten?
CristinParraoparrao@mapmultimedia.cl 26
6.TiposdeFotogramas
CristinParraoparrao@mapmultimedia.cl 27
6.1FotogramaSimple(oFotograma,asasecas):
Flashlointerpretacomonopasanadanuevoenelescenario,slomantiene
loquehabaanteriormente.Yanossonarmscuerdaestdefinicin.Los
puedesdistinguirporquesonrectngulosgrisescompletos.
Paracrearfotogramas:AbreunnuevodocumentodeFlashydibujacualquier
cosaenelescenario.Luegohazclicenlacapa1,perobajoelnmero10.Andaa
Insertar>LneadeTiempo>Fotograma.
Figura3
Aspectodelalneadetiempocon1Fotograma
AspectodelaLneadeTiempocon10Fotogramas
Qufueloquehiciste?Agrandastelalneadetiempoa10fotogramasy
puedesprobarlopresionandolateclaEnterparaquenotescmosedesplazael
CabezaldeLectura.Prubalotodaslasvecesqueseanecesarioyporsupuesto
sigueexperimentando....esdecir,ahoraalrgaloa20fotogramas,45,60,etc.
6.2FotogramaClave:
Esunfotogramaespecial.EnelFotogramaClavepasaalgo,aslointerpreta
flash.YesepasaralgopuedeserquesehizoundibujoenelprimerFotogramao
CristinParraoparrao@mapmultimedia.cl 28
seprodujouncambioenotrolado.Sepuedendistinguirporquepresentanun
crculonegro.
ParacrearFotogramasClaves:CuandotienestuLneadeTiempoquedura10
fotogramas(figura3)hazclicenlacapa1,bajoelnmero10.MenInsertar>
LneadeTiempo>FotogramaClave.
Figura4
AspectodelFotogramaClaveen10.
Esdecir,ahoratenemos2FotogramasClaves(eldel1yeldel10)
ylosdems(del2al9)sonsloFotogramas
6.3FotogramasVacos:
Sontodoslosqueporalgunaraznnoqueremosqueaparezcan,peroque
iguallosleaelCabezaldeLectura.Quenoaparezcannuncamsoqueluegose
puedanver.
6.4reasinFotogramas:
Estodoloquevemosaladerechadeloltimoquehemosanimado.El
CabezaldeLecturanololee,peroigualFlashlosmuestraparasaberque
disponemossiempredemstiempo.
Figura5
Enestafigurasepuedeobservarlosiguiente:
HayFotogramasClavesdesdeelfotograma1al4
Del5al10,hayslofotogramas(as,asecas)
Del11al14hayFotogramasClaves
Del15al20,hayslofotogramas
Del21enadelantevieneunreasinfotogramasquenoserleda
CristinParraoparrao@mapmultimedia.cl 29
Resumen
CristinParraoparrao@mapmultimedia.cl 30
TodonovatointeresadoenaprenderFlashaunqueconozcapocoelprograma,
sabelainmensacapacidadquetieneparadesarrollaranimaciones.Nosontan
difcilesdelograr,peroexigequeelusuariotengaclaroculessonloslmitesde
autonomapropiosdelsoftware.
Dndeestelbotnparaconvertirunacasaenunelefante?Probablemente
noexistatalcomando(porlomenosnolohepodidoencontrarhastaahora)pero
haymanerasdesimularloyquetengaunefectoparecido.
Aquestnlos3tiposdeanimacionesquesepuedenlograrconFlasheneste
curso:FotogramaaFotograma,porFormayporMovimiento.
7.AnimacinFotogramaaFotograma
CristinParraoparrao@mapmultimedia.cl 31
Algunavezenelcolegiohicisteentucuadernodibujosanimados?Undibujo
enlaprimerahoja,enlasiguienteeraelmismo,peroconalgomodificado.Enla
tercera,otramodificacinyassucesivamente.Despuspasabasrpidolashojas
ywow!Tuprimercartoon!!
Bien,esaantiguatcnicaestambinposible
lograrlaconFlash.CadaFotogramaClave
equivaleaunahojadetucuadernoyluegoFlash
consuCabezaldeLecturaleetusdibujosyah
tendrstuanimacin.
Recomendablepara:Animacionesmuy
exigentes,lascualesloscomandosdeflashnotepuedenayudarmucho.
AvecesnohayformadelograranimacionesenFlashquenoseanFotograma
aFotogramayevidentementeesmstrabajo,peroclaro,susresultadospueden
sermejores.Podramosdecirquehayartesanaentrabajosdeestetipoyque
lograrunbuenresultadorequieremuchatcnica.
Anaspodemoshaceralgunaspruebassencillas.AbreunNuevoDocumento
enFlash.Enelescenariodibujaunacaraperomuyseria.
Figura1
CristinParraoparrao@mapmultimedia.cl 32
Luegohazclicenelfotograma2ycreaunnuevoFotogramaClave.Loque
haceelprogramaescrearteunacopiaexactadelprimerdibujo.
Aesenuevodibujo,hazleunavariacinensuboca.Unpocomssonriente.
Figura2
Bien,elrestodelejerciciolopuedesintuir.Hazlomismoconelfotograma3,4,
5yhastadondedeseesestiraresasonrisa!!
Figura3
CristinParraoparrao@mapmultimedia.cl 33
Unavezlistoqueteparezcasuficienteelnmerodefotogramas(enmicasolo
hicede10),probamoslapelcula.(MenControl>Probarpelcula).Tambin
puedesintentarconslolateclaEnter.
Felicitacionesportuprimeraanimacin!!!!
Hayotroselementosqueteacompaarntambinenlasanimacionesen
Flash.Vemoslos.
7.1.Capas:
LasCapassonunaherramientaquenoesoriginaldeFlashyyalahemos
encontradoenmuchosotrossoftwarestipoPhotoshopoDirector.Suobjetivoes
ordenartodosloselementosqueparticipanenelEscenarioyvandesde1(por
defecto)hastaelnmeroqueteaguantelaRAMdetuPC.Evitanquese
superponganloselementosysonesencialesparadesarrollaranimaciones.
CadaCapaactacomounadiapositivatransparentequecontieneelementos.
Figura4
ContenidoCapa1:Monodenieve
ContenidoCapa2:Sueloconnieve
ContenidoCapa3:Cielo
PerosilaanimacinenFotogramaaFotograma,paraqunecesitomsde
unacapa?Podraserqueenestetipodeanimacinseanecesariaslounacapa,
peroclaro,sihayms,podranahorrartemuchotrabajo.
CristinParraoparrao@mapmultimedia.cl 34
Figura5
Aseslavisinde3dibujosdistribuidosen3capas
7.1.1ParaCrearunanuevaCapa:
PuedescrearelnmerodeCapasquequierasynormalmenteseseparanlos
dibujosdelfondoyloselementosquedesees.CrearCapasesmuyfcil.Debes
hacerclicen oMenInsertar>LneadeTiempo>Capas.Pordefecto
apareceunacapavaca(puedesnotarloporsurectnguloycrculoenblanco).
Paracolocarleelnombrequedesees,hazledobleclicyFlashtepermitir
escribirleloquequieras.Yaconesoestlistaparaquepuedasdibujarenella.
7.1.2.ParaBorrarunaCapa:
Debesseleccionarlacapa(hacerclicenella)yluegohacerclicen ,el
iconodebasurero.
7.1.3.ParaMoverunaCapa:
PuedeserquenecesitascambiarelordendelasCapas.Muyfcil,hacesclic
enlaquequierasmoverysinsoltarelbotndelratn,laarrastrashaciaellugar
quenecesites.
CristinParraoparrao@mapmultimedia.cl 35
7.1.4.PropiedadesdelaCapa:
Figura6
Ojo:SiseactivanoseveelcontenidodelaCapaenelEscenario(ejemplo,Capa
cielo)
Candado:Siseactiva,elcontenidodelaCapaenelEscenarioseve,peronose
puedemanipular(ejemplo,Capacieloynievefondo)
LneadeContorno:ElcontenidodelaCapasevesloconsusLneasdeContorno.
(Ejemplo,Capanieve).Puedesdistinguirsuselementosmsfcilyesunmodode
vistamslivianoparaFlash.
7.2.PapelCebolla:
ElPapelCebollapermitevertusfotogramasanterioresyposteriores.Aveces
esmuytil,paracontrolartusanimacionessaberqufueloquepasantesoqu
pasar.
AdemstraeunosmanejadoresparaqueleindiquesaFlashcuntos
fotogramasparaadelanteoatrsdeseasver.
CristinParraoparrao@mapmultimedia.cl 36
CristinParraoparrao@mapmultimedia.cl 37
8.AnimacinporInterpolacin
CristinParraoparrao@mapmultimedia.cl 38
EslamsconocidaypopulardeFlash.Siestsbuscandohacerunsitioweb,
porejemplo,esmuydifcilquenovayasaocuparla.
Bsicamentecuentaconunobjetoalprincipiodelaanimacinyotroalfinal.
Flashhaceelresto.
Podemosencontrarde2tipos:DeFormaydeMovimiento.Ladeformaes
muyespectacularalprincipio,peropocousadaporocuparhartaRAMymuchos
dicenqueesunaanimacinfea.LadeMovimientoeslamscomndetodaslos
tiposdeanimaciones.
EstaseralavisinquetendrasentuLneadeTiempo.
Interpolacindeforma:
Ntesequehayunaflechayunreaverdeentre2fotogramas
Interpolacindemovimiento:
Ntesequehayunaflechayunreamoradaentre2fotogramas
ErrorenlaAnimacin:
Nteselalneasegmentada.Esosignificaquehubounerrorylaanimacinpodrano
funcionar.
CristinParraoparrao@mapmultimedia.cl 39
9.Animacinporforma(Morphing):
CristinParraoparrao@mapmultimedia.cl 40
staeslapreferidaporlosnovatosdeFlash,peronomuyqueridaporlosms
experimentados.
EnunnuevoDocumento,enelprimerFotogramadibujacualquiercosa,por
ejemplounrectngulo.
Luegodeeso,hazclicenelFotograma20delamismaCapaypidesinsertar
unnuevoFotogramaClave.Tecopiexactamentetuprimerdibujo.Estesegundo
dibujodelFotograma20,transfrmaloaloquequieras.Aalgoparecido,oauna
cosaabsolutamentenuevaosiquieresbrraloyhazotro.
Notarsyaqueelprimerdibujo(delFotograma1alFotograma19)esmuy
diferentealqueacabasdeconstruirenelFotograma20.
HazunclicencualquierFotogramaentreel1yel19(dalomismoencual)y
enelPanelPropiedadesdondediceAnimarabreesemendesplegableyelige
Forma.Unavezhechoesto,loquedebierasver,es:
Pruebatupelcula.
CristinParraoparrao@mapmultimedia.cl 41
9.1.ConsejosdeForma:
Unadelascrticasqueselehacenaestetipodeanimacin,esqueaparte
delaRAMqueconsumeFlashseinventalaanimacin.Esdecir,elprograma
decidequmanerahacelatransformacin.
GraciasalosConsejosdeForma,puedesaconsejaraFlashcmoquieres
quehagatuanimacin.Noesunaherramientaperfecta,avecesnoresultatan
buena,peroporlomenosayuda.
Laideaesbienfcil:leindicasalprogramaunpuntoeneldibujodetuprimer
Fotograma.LuegoeneldibujodetultimoFotograma,Flashtepresentaelmismo
puntoydebesindicarledondetegustaraquellegara.
ParacrearunConsejodeFormaestandoentuprimerFotogramadebesira
MenModificar>Forma>AadirConsejodeForma.Apareceunaadentrode
uncrculoquedebesanclarlaenalgunapartedetudibujo.Andaalltimo
Fotogramayversquehayotraaesperandoquelaanclesaotropunto.Puedes
hacerlomsveces.
9.2.Aceleracin/Desaceleracin
AlhacerunaAnimacinporForma(yparalasdemovimientotambin),Flash
tedalaposibilidaddeAcelerarlaoDesacelerarla.Esteefectoesmuybueno
cuandoqueremossimular,porejemplo,unapelotadetenisquerebota.Sabemos
CristinParraoparrao@mapmultimedia.cl 42
queelrebotenoesuniforme.Cuandolapelotaestarriba,sedesaceleray
cuandobaja,seacelera.Enfin,puedenhabermuchosmsejemplosparaeste
efecto.
HazunaanimacinporForma.Unavezlista,seleccionaelprimerFotograma.
AbajoenelPaneldePropiedades,mueveagustolaopcinAceleraciny
pruebasuscambios.
CristinParraoparrao@mapmultimedia.cl 43
10.AnimacinporMovimiento
CristinParraoparrao@mapmultimedia.cl 44
Eseltipodeanimacinmsocupado,yaqueFlashtedalasherramientas
paracambiaralgunaspropiedadesdelosobjetosqueestsanimando.
Repitamosalgofundamental.TledicesaFlashcmounobjetocomienzay
cmoterminayelprogramahacetodolointermedio.
Partamosconalgunosconceptosantes
10.1.CreacindeSmbolosGrficos:
Hayvecesendondetienesqueanimar,porejemplo,unvalomuchasveces.
ParaesoFlashtedalaposibilidaddetransformaresevaloenunSmboloyque
quedeguardadoenunabibliotecaparaocuparlolasvecesquequieras.Las
ventajasdeestoesquelodibujasunavezyslodespusloreutilizas,sintener
quedibujarlodenuevo.Tambinayudaenelgastodememoriaenelmomentode
correrlapelcula.
ParaAnimarporMovimiento,loselementosDEBENserconvertidosen
smbolosgrficos.Estoesunaregla.
AbresunNuevoDocumento,yenelprimerFotogramadetunicaCapahaces
undibujo.Enestecasoocuparsunvalo.
CristinParraoparrao@mapmultimedia.cl 45
EstevaloloSeleccionasyhacesclicenMenInsertar>Convertiren
Smbolo.Apareceunaventana,debeselegirelcomportamiento.Enestecaso
eligeGrfico,losdemslosveremosdespus.Colcaleunnombre.Aceptar.
Notarsquehacambiadosuaspecto.Tieneunafiguraqueindicasucentroy
parecieraestaragrupado.
CristinParraoparrao@mapmultimedia.cl 46
10.2.Biblioteca:
Justamente,laBibliotecanossirveparaguardarnuestroselementosde
trabajo.
MenVentana>Biblioteca.LaBibliotecayahaguardadosuprimersmbolo.
AligualqueenlaAnimacinporForma,haremoselmismoproceso.Hazclic
enelFotograma20(enestecasosemeocurriel20,puedeselegircualquiera),
creasunFotogramaClave.EsteFotogramaClavehaceunarplicaexactadetu
primerFotogramaClave.
EstarplicavasaTransformarlaycambiarladelugar.
CristinParraoparrao@mapmultimedia.cl 47
Antesdecontinuar,hayunpuntointeresantequecomentar.Hastaahora,
tenemos3elementosparticipando:UnoqueestenelFotograma1,otroenel
Fotograma20yfinalmenteelqueestenlaBiblioteca.Alparecereselmismo,
perono.Los2queseencuentranenelEscenario,sonInstanciasdelSmboloque
seencuentraenlaBiblioteca,esdecir,hay2Instanciasde1Smbolo.Sieres
novatoenFlash,estotrminospuedenparecerteunpocointiles,peroyaenel
futurotesernmsfamiliaresyaplicablesenotrotipodecosas.
10.3.LaInterpolacin:
HazclicencualquierFotogramaintermedioyenelPanelPropiedades>
Animar>Movimiento.
PruebalaEscena.
NotarsqueFlashcretodoslosFotogramasintermediosentrelaprimeray
ltimainstanciaysearmunaanimacinfluida.
Enestecasolainstanciafinalfuecambiadadelugar.Tambinselepueden
hacercambiosdeotrostiposalaltimainstancia(oalaprimera,sideseas)
CristinParraoparrao@mapmultimedia.cl 48
Cambiardeposicin
Rotar,Deformar,Alargar/Acortar,Ensanchar/Angostar
Teirladeuncolor
ColocarlemsomenosBrillo
Cambiarlelaopacidad(alpha)
Todaslasanteriores.
Finalmente,debestenerpresentequelosejerciciospresentados,slo
consideran2instanciasdeunmismosmbolo.Puedeshacerunagran
coreografaconmuchasmsinstanciasymuchosmssmbolos!Ejemplosy
combinacioneshayinfinitas,tdebesdescubrirlas.
10.4.CapaGua:
AhoraqueyasabesanimarporMovimiento,tesurgirnalgunasdudasotu
mismotrabajoconFlashtepedirtenermsconocimientosobreefectos.Unode
elloseslaCapaGua.
LaCapaGuaesunaCapaquehascreadoentulneadetiempo(comotodas)
yquesercomobiendicesunombreunaguadelaanimacin.Esdecir,la
CapaGuapresentauntrazadoelcuallosobjetosdebendeslizarseporlyas
tomarunmovimientodiferente.
AbreunNuevoDocumentoycrearsunaAnimacinporMovimientodeuna
moscaquevadesdelaesquinasuperiorizquierdadelescenarioalaesquina
CristinParraoparrao@mapmultimedia.cl 49
inferiorderechadelmismo.Enestecasonecesitamosquelamoscavueleen
diagonalrecto,nadams.
Unavezhechoesto,hazcliceneliconoparaAgregarunaCapaGua.
InmediatamenteFlashcreaunaCapaconunaaparienciadiferentealresto,arriba
dedondetenemosladelaanimacin.
EnestaCapaGua(vacaporahora)sedibujarunatrayectoriaconelLpiz
(opcinCurva).Porsupuestounatrayectoriasinuosa,sincortes,diferenteala
diagonalquepordefectosecre.
Unavezhechoesto,asegratequelaherramientaImnestactivaday
arrastralaprimerainstanciadelamoscaalpuntoqueconsideresiniciodelalnea.
Alsoltarlainstancia,sentirsqueest"imantada"aliniciodelalnea.
CristinParraoparrao@mapmultimedia.cl 50
Debeshacerlomismoconlainstanciafinaldelamosca.
PruebalaPelcula.
SeleccionandotuprimerFotograma,enelPanelPropiedadesactivalaopcin
"Orientaraltrazado"yobservaloscambiosentuanimacin.
10.5.Mscara:
LaMscaraesotroefectointeresantealahoradehacertusanimaciones.
Comobiensunombreloindica,enmascara,esdecir,temuestra"unpedazo"de
algunaanimacinodibujoesttico.
CristinParraoparrao@mapmultimedia.cl 51
AbreunDocumentoNuevoyenelprimerFotograma,dibujaunrostro.
Luegohazcliceneliconode"InsertarunaCapa".Ahdibujarsunvalo,pero
asegratequeestsobretudibujoyqueademsseamschico.
AesanuevaCapa(queyolallamvalo),hazclicsobreella,peroconel
botnderechodeturatn.EneseMenContextual,elige"Mscara".
Yapuedesnotarquealgohapasado.Elvalohaenmascaradotudibujo
original.SipruebaslaEscena,tedarscuentaqueseconservaelmismoefecto.
CristinParraoparrao@mapmultimedia.cl 52
LasMscaraspuedenseranimadas(ysuefectoesmsinteresante).Se
animancomocualquierAnimacinporMovimiento,FormaoFotogramaa
Fotograma.
Tambinpuedenhaberotrascombinacionescomoqueeldibujoenmascarado
seaanimado.
ParaquelaMscarafuncioneenelEscenarioypuedasmodificarla,debes
desactivarlelaopcindeBloqueoalaCapaquequierasmodificar.
CristinParraoparrao@mapmultimedia.cl 53
11.Botones
CristinParraoparrao@mapmultimedia.cl 54
LosbotonessonobjetosqueFlashpermitenconstruiryquenosdanla
posibilidaddenavegaraantojoportodalaanimacinconstruida.Esdecir,le
damosunacuotadeinteractividadalapelcula,yaquehastaahoraslohemos
construidoanimacionesendondesedetienealfinaldelosfotogramasynada
ms.
UnBotnloreconoceremosporquealcolocarnossobrel,elpuntero(quees
unaflechapordefecto)cambiaaunamanito.
Paraconstruirunbotn,primerosedebetenerencuentalosestadosdeun
botn.Estossonbiensencillos.Cuandounbotnestsinaccionarse(esdecir,sin
elpunteroencima)decimosqueestenelestadodeReposo.Cuandoelpuntero
delmouseestsobrel,ycambiadeaspecto(seagranda,cambiadecolor,se
achica,etc.)decimosqueestenelestadode:Sobre.Ycuandohacemosclic
sobrel,decimosqueestenelestado:Presionado.
Yasabesquepodemostener3estadodeunbotn.Claro,quepodemostener
slounoysinningnefecto,perolaideaeshacerlogrficamentemsinteresante.
Entuescenario,creaunvalo.LuegoloconvertiremosenSmboloBotn.La
formadehacerloesbienparecidaalSmboloGrfico.SeleccionatufiguraMen
Modificar>ConvertirenSmboloyestavezeligeBotn.Colcaleunnombre
recordableyAceptar.
YaverscomohatomadolaaparienciadeunsmboloylaBibliotecayaloha
registrado.HazdobleclicenelbotndelEscenarioymiralaLneadeTiempo.
EstaLneadeTiempoesmuydiferentealoquehemosvisto.Susfotogramasson
msanchosytienennombres:Reposo,Sobre,PresionadoyZonaActiva.
CristinParraoparrao@mapmultimedia.cl 55
Yasupondrsloquehapasado.Nuestrovalosehaconvertidoenelestado
Reposodelbotnyesperaquecomencemosaconstruirlossiguientesestados.
HazclicenelestadoPresionadoycreaunnuevoFotogramaClave(Men
Insertar>LneadeTiempo>FotogramaClave).Yavesquehaceunacopia
exactadelprimerFotograma.Aesacopia,hazlealgunasmodificaciones(cmbiale
elcolor,laformauotracosa).
Luego,creaunnuevoFotogramaClaveenelestadoPresionadoycambiasu
forma.
ElestadoZonaActiva,noesunestadopropiamentetaldelbotnque
CristinParraoparrao@mapmultimedia.cl 56
podamosver.AcenrealidadledecimosaFlashdesdedondeelpunterose
convierteenmanito.Esunindicadorderea,asquenoimportansuscolores
(nuncalosveremos).Paraesteejemplodalomismo,porqueconelvalonohay
problemas,perodebestenermuchocuidadoenbotonesquehagasconslotexto
ofigurasmuyirregulares.Paraestaocasin,slodejaunfotogramaclaveeneste
ltimoestadoynolehagasningunatransformacin.
AhoraesmomentodesalirdenuestroSmboloBotn.Hazclicenlapestaa
quediceEscena1paravolveralEscenariodelprincipio.
Esmomentodeprobartupelcula!!!
CristinParraoparrao@mapmultimedia.cl 57
12.Accionesbsicas
CristinParraoparrao@mapmultimedia.cl 58
Bien,acdaremosnuestrosprimerospasosconActionscript,queesel
lenguajedeprogramacindeFlash.Noesdifcil,yalovern.
AcloimportanteesquerecuerdenqueFlashnosabehablarEspaol,ycomo
nosotrosqueremosdarleinstrucciones(detenteac,avanza,detentedenuevo,
etc.)tendremosqueaprendernossusinstrucciones(Acciones)Bsicas.
Partamosconunpequeoejercicio.Loprimeroquedebemoshacerescrear
unaAnimacinporForma,oMovimiento.Paraestecasodalomismo,lo
importantequeporlomenostenga30fotogramasdeduracin.
Pruebalaanimacinyverificaquecorrasinproblemas.
Unavezhechoesto,llamaaunanuevaCapa(MenInsertar>Lneade
Tiempo>Capa)yllmalaacc.Comosabemos,estacapapordefectoaparece
vaca.AndaalFotograma15einsertaunFotogramaClave(quetambin
aparecervaco).SeleccinaloconunclicyabreelPaneldeAcciones(F9).Fjate
queenelPaneldiceAccionesFotograma,loquesignificaqueestamos
aplicandounaaccinalFotograma(luegoveremosquehayaccionesquese
aplicanaotrascosas).
EnelPanel,escribelosiguienteysinerrores:
CristinParraoparrao@mapmultimedia.cl 59
stop()
CierraelPanelyfjatequeenelFotogramaescogidosehamarcadounaa.
EsoindicaqueeseFotogramacontieneunaaccin.
Pruebalapelculayversquelaanimacinnoseejecutacompletamente,
puessedetieneenelfotogramaalcualleagregamoslaAccin.
Felicitaciones,tuprimerpasoenActionscript!!!
Evidentementenolodejaremosas.Sisedetienelaanimacin,algotendr
quevolverlaaejecutarla.AcentranuestroamigoelSmboloBotn.
PideunanuevaCapayllmalaBotn.Enellacreaunbotncontodossus
estados.Cuandoestlisto,seleccionaelBotn(ojo,yasalimosdesusestados)y
llamaalPaneldeAcciones.AsegratequeenelpaneldiceAccionesBotn,si
diceotracosa(comoFotogramas),seleccionanuevamenteelBotn.
EnelPaneldeAccionesescribelosiguiente:
on(release){
play()
}
CristinParraoparrao@mapmultimedia.cl 60
PruebalaPelcula.
Yanotarsqueapesardedetenerselaanimacin,elbotnpermitequepueda
seguirejecutndose.
Resumen
LogramosnuestraprimerainteractividadconFlash.Creamosunaanimacin
simpleyledijimosaltiempoquesedetuviera(enrealidadselodijimosaun
fotograma,perorecuerdenqueacFotogramaesunaunidaddetiempo,loqueda
igual).Nuestrobotnnossalvdeesadetencinyfuecapazdevolveraejecutar
laanimacin.EsdecirprimeroStopyluegoPlay(detngaseyluegocontine)
12.1.Accionesdeunbotn:
Comosedieroncuenta,alcolocarleunaAccinalBotn,noslolepedimosel
play(),sinoqueademsagregamosotrascosas(adiferenciadelaaccinal
fotograma):
CristinParraoparrao@mapmultimedia.cl 61
on(release){
play()
}
Siestofueraunatraduccinliteral,seraalgocomo:
on:Cuandoelusuario...
(release):...suelteelclicdelmouse...
{play()}:...ejecutelaLneadeTiempo
LosdosprimerostrminosselesllamaEventoyelterceroeslaAccin.Es
decirCuandoelusuariosuelteelclicdelmouseEjecutelaLneadeTiempo
(algocomoCausayEfecto).
Comosupondrn,lasAccionessiemprepuedencambiarylosEventos
tambin.VeamoslalistadeEventosparaelBotn:
on(release):Alsoltarelbotndelmousesobrelainstanciadespusde
haberpulsado(esdecir,liberar).Lamscomndetodas.
on(press):Alapretarelbotnizquierdodelmousesobrelainstancia.Sin
soltarlo,yaejecutlaaccin.
on(releaseOutside):Alsoltarfueradelainstancia
on(rollOver):AlentrarelcursorenelreaActivadelainstancia
on(rollOut):AlsalirdelreaActiva
on(dragOver):Alarrastrarelcursorconelbotnizquierdodelratn
apretadodesdefueradelreaActiva,haciadentro(botnconpropiedad
seguimientodemenPaneldePropiedades)
on(dragOut):Alarrastrarelcursorconelbotnizquierdodelratnapretado
fueradelreaActiva
on(keyPressA):Enestecasosetratadeuneventoquenadatieneque
verconelbotn,yaqueseproducealpulsarunatecla(delteclado)
indicadapornosotros(enestecaso,coloqulaA).
CristinParraoparrao@mapmultimedia.cl 62
Loseventossepuedencombinar,comoporejemplo:on(press,release)
Ysideaccionessetrata,nopodremosdarellistadocompleto:Sonmuchas,
demasiadas.Peroexplicaremosacalgunasquenospermitanhacerotrascosas
bsicas.
YaconocemoselEjecutarplay(),elDetenersestop().Ahoraconoceremos
dosms.
CristinParraoparrao@mapmultimedia.cl 63
13.Navegacin
CristinParraoparrao@mapmultimedia.cl 64
Hagamoselmismoejercicioanterior.Ahoraunaanimacinmuysimplede60
fotogramasyenelFotogramaClave30,colocasunstop()
Enotracapahacesunbotnyenvezdeplay()escrbelegotoAndStop(60)
on(release){
gotoAndStop(60)
}
Yasupondrsloquesucede.LaaccingotoAndStop(60)significaVayay
detngaseenelfotograma60.Sipruebastupelculaesjustamenteesoloque
sucede.
Intentaotracosa.AhoraeselturnodegotoAndPlay(50)
on(release){
gotoAndPlay(50)
}
Lamismalgica.gotoAndPlay(50)significaVayayejectesedesdeel
fotograma50.
Porsupuestoquelosvaloresqueheocupado(50y60)sonslodeejemplo.
Tpuedesydebescolocarlosqueteacomodenatusnecesidadesde
interactividad.
Peronoslovaloresnumricosselepuededar.
Sigamosconelmismoejemplo.Enlacapaacc,andaycreaunFotograma
Claveenelfotograma40.Unavezhechoeso,asegratequeestseleccionadoy
andaalabarradePropiedades,dondediceFotogramaeinvntaleunnombre
prueba.
CristinParraoparrao@mapmultimedia.cl 65
AhoraandaalBotnycmbialeelgotoAndPlay(50)por:
on(release){
gotoAndPlay(prueba)
}
PruebatupelculaypodrsnotarquelaNavegacinpuedesertambin
colocndolenombresalosFotogramas.Porsupuesto,puedesnombrartodoslos
fotogramasquedeseesyhacermsricatunavegacin.
CristinParraoparrao@mapmultimedia.cl 66
14.Escenas
CristinParraoparrao@mapmultimedia.cl 67
Quesunaescena?Podemoshacerunaanalogaconelcineoelteatro.En
unaEscenasecuentaalgo.Porejemplo,elencuentrodedosamigosenlacalle.
Cuandoqueremosdejardecontar,parapasaraotracosa,cambiamosde
escena.Ahoraqueremosmostraralosamigosenunafiesta...esoyaesotra
Escena.
FlashtambinpermitetenermsEscenas.Todoloquehemoshechohasta
ahorahasidoenlaEscena1,laquepordefectovieneconFlash.
MiralosPanelesatuderecha.SinoencuentraselPanelEscena,scalode
MenVentana>PanelesdeDiseo>Escena
PordefectosellamaEscena1.
Puedescambiarleelnombre
haciendodobleclicenl.
Supongamosquetienesuna
animacindecualquiertipoentu
primeraEscena.Alprobarlapelcula
notarsquesehaceunarepeticin
continua(loop)delamisma
animacin.Esdecir,llegaalfinaly
vuelvealprincipio.
AndaalPanelEscenayhazclic
eneliconoparacrearunaNueva
Escena .Notarsque
efectivamentesehaincorporadounnuevonombreEscena2(quepuedes
cambirselo,porsupuesto)yahoramiraatuescenario.Nohaynada!!!
Nosehaborradolaanimacin.Loquepasaesqueestamosenotraescena,
laquecontieneunanuevalneadetiempo.Hazacotranuevaanimaciny
pruebatupelcula(MenControl>ProbarPelcula).Notarsquecuandotermine
tuprimeraanimacin,comenzarlasiguiente.
CristinParraoparrao@mapmultimedia.cl 68
Tambin,puedesprobarslolaEscenaconMenControl>ProbarEscena.
14.1.NavegacinentreEscenas:
Porsupuestoqueademssepuedenavegarentreescenasyprobablemente
muchosdelossitioswebsimplesconstruidosenFlash,estnarmadoscon
Escenas.
Quieroquecrees3Escenasyencadauna,unaanimacindiferente.Adems
alfinalizarcadaanimacin,debehaberunaCapaquecontengaenelFotograma
finalunstop()yunbotn.Esdecir,3Escenas,3Animaciones,3stop()y3
botones.
LaEscena1lallamaremosinicio,lasegundaintermedioylatercerafinal.
Sipruebastupelcula,notarsquecomienzalaprimeraanimacin,sefrena
conelstop()yhastaahnomsllega.
Alprimerbotnlecolocaremoslasiguienteaccin:
on(release){
gotoAndPlay(intermedio,1)
}
Comosupondrs,estetellevaralaescenaintermedio,alfotograma1.
EnlaterceraEscena,creaunaEtiquetadondegustesconelnombrejuan.
CristinParraoparrao@mapmultimedia.cl 69
Enelsegundobotn(delasegundaEscena),agrgalelasiguienteaccin:
on(release){
gotoAndPlay(final,juan)
}
Tambinyapodrssuponerquhaceestaaccin.Escapazdeenviarteala
escenaqueleindicasyademsalaetiquetaquedesees.
Ahoraaltercerbotnquieroqueleagregues:
on(release){
prevScene()
}
Pruebalapelcula.
PodrshabertedadocuentaqueloquehaceprevScene()esdevolverteala
Escenaanterior(previousscene),peroesequivalentealgotoAndStop(),esdecir,
vaadondeledices,perosinejecutarlaLneadeTiempo.Tambinexisteel
nextScene()quecomobiensospechas,tellevaalasiguienteescena(nextscene)
14.2.NavegacinExterna:
FlashtambinpermitesaliraInternet.AtravsdelaaccingetURL,
podemosteneraccesoalawebyalcorreoelectrnico.
HazunBotnycolcalelasiguienteaccin:
on(release){
getURL(http://www.mapmultimedia.cl,_blank)
}
EstanuevaaccinnospermiteabrirunapginawebconunaURLespecfica.
CristinParraoparrao@mapmultimedia.cl 70
EvidentementelaURLpuedecambiaralaquenecesites,peronoolvides
colocarleelhttp://antes.
Laopcin_blanksignificaquelapginaaabrirseejecutarenunaventana
diferentealaquecontieneelFlash.Unaalternativaes_self,queabreenla
mismaventana.Paramsdetallessobrenombresdeventana,recomiendoleer
informacinsobreFrames(marcos)deHTML.
LaotraopcindelgetURLes:
on(release){
getURL(mailto:parrao@mapmultimedia.cl)
}
Comosupondrselmailto:permiteabrirunaventanadecorreoelectrnicoy
poderenviarunmail.Atencinconesto:Sielcomputadornotieneinstaladoun
softwaredecorreoelectrnico(comoOutlook),estaopcinnofuncionar.
CristinParraoparrao@mapmultimedia.cl 71
15.ClipdePelcula
CristinParraoparrao@mapmultimedia.cl 72
Eseltercersmboloquenosquedaporexplicar.Conesteltimo,yapuedes
comenzararealizartuspropiasanimaciones,einclusotusprimerospasosparala
creacindetusitioweb.
ElClipdePelculaesunobjetomuypoderosoalahoradeprogramaren
Actionscriptsinembargo,enestaocasinveremossufaseinicial,quetiene
relacinsloconlaanimacin.
ElsmboloClipdePelcula,esuna"subpelcula"dentrodelEscenario.Posee
supropiotiempo,independientedeloquepasefueradel.Porejemplo,si
tenemosunaEscenaconunaanimacinsimpleyunstop()alfinal,lonormalsera
quecuandoelCabezaldelecturalleguealfotogramafinaltodosedetendr,pero
qupasarasinecesitamosque ademsdelaanimacinprincipalquedeuna
pequeaanimacinquenosedetenganunca(unlogotipochicoenunesquina
quenoparedegirar,porejemplo)?Paraeso,nuestrofielClipdePelculanos
sacardelapuro.
EnunaEscena,enlazonaizquierda,dibujauncorazn.Convirteloa
Smbolo,yestavezelige"ClipdePelcula"ycolcaledenombre"palpita".
Anmalocomosiemprelohazhecho.Queavancehacialaderechahastael
Fotograma20yquedesdeahbajehastaelfinaldelEscenario(Fotograma40).
EnunaNuevaCapa,llamada"acc",colocaunfotogramaclaveenel
Fotograma20ylaaccinstop().EnotraCapa,construyeunbotn,conlaaccin:
on(release){
play()
}
Hastaahorallevamosalgoparecidoaejerciciosanteriores.Pruebalapelcula
CristinParraoparrao@mapmultimedia.cl 73
yasegratequetodofuncioneenorden.
Ahoravienelonovedoso.Hazclicconelbotnderechodemouseen
cualquieradeloscorazones(eldelFotograma1,2040)yenelMenContextual
eligelaopcin"EditarenContexto".
Quhapasado?NoshemosintroducidoenelClipdePelculayahvemosa
nuestrocorazncomooriginalmentefueconstruido,sinningunaagrupacin.
PuedesnotarlaetiquetaquenosindicaqueestamosdentrodelClipdePelcula.
RecuerdaqueparavolveralaEscenaoriginal,slodebeshacerclicdondedice
"Escena1"oelnombrequelehayasdejado(aligualquelosotrosdossmbolos
anteriores:elGrficoyelBotn).Bien,tambinnotarsquecomoestamosdentro
delClip,FlashnosdejadisponibleunanuevaLneadeTiempo.
Loqueharemosacdentroesquenuestrocoraznpalpite.Nadams,nonos
preocuparemosque"avanceypalpite",sloquepalpite.Paraello,debemos
animarloconlospasostpicosqueyaconocemos.Seleccionastudibujo,lo
conviertesenSmboloGrfico,lecolocasunnuevonombreylohacesagrandarse
hastaelFotograma10.
CristinParraoparrao@mapmultimedia.cl 74
RevisacmolaBibliotecaharegistradoordenadamentelosdossmbolos
Yalistoconeso,"salgamos"alaLneadeTiempoprincipalypruebatu
pelcula(MenControl>ProbarPelcula).Debierasverlosiguiente:Uncorazn
palpitantecomienzaaavanzaraladerecha,sedetienesuavance,peronosu
palpitar.Finalmenteunbotnhacequepuedaseguiravanzando,peroestavez
haciaabajo.
15.1.BotnAnimado:
YaconociendoelClipdePelcula,podemosanimarbotonesesdecir,lograr
queelestado"Sobre"y/o"Presionado",contenganunaanimacin.
Estoesmuysencillo.EnunsloFotograma,creaunbotnconsus3estados,
mselestado"ZonaActiva".Andaalestado"Sobre",seleccionaloqueaparece
enelEscenarioyconvirteloenSmboloClipdePelcula.Unavezhechoesto,
seleccionaestenuevosmbolo,botnderechodelmouseyeligeEditaren
Contexto(condobleclictambinsirve).Dentrodel,seleccionanuevamenteel
objeto,convirteloaSmboloGrficoyconstruyecualquieranimacin.
CristinParraoparrao@mapmultimedia.cl 75
VuelvealaEscenaprincipalypruebatupelcula.Sitodofunciona
correctamente,tedarscuentaqueelestado"Sobre"delbotn(cuandoelpuntero
delmouseestsobrel),produceunaanimacin.Sisacaselpuntero,la
animacincesar.Esunbonitobotnanimado!!!
Enresumen,loquehicimossellama"Anidacindesmbolos".Esdecir,dentro
deunestadodeunBotn,tenemosunClipdePelculaydentrodel,tenemos
unaanimacindeunSmboloGrfico.
15.2.ControldeunClipdePelcula:
YatenemosclarocmounBotnescapazdeafectaralaLneadeTiempo
constop()oplay()ypodernavegardentrodeellacongotoAndPlay(1)o
gotoAndStop(1),einclusonavegarhaciaotrasescenas
gotoAndPlay("nombredeEscena",1)ogotoAndStop("nombredeEscena",1)o
nextScene()oprevScene().InclusopodersaliraInternetcon
getURL("http://www.mapmultimedia.cl","_blank")o
getURL("mailto:parrao@mapmultimedia.cl","_blank")
Todoesoestbien,peroCmocontrolamosunClipdePelculasiestees
independientedelaLneadeTiempoprincipal?Muyfcil:conlasInstancias.
CristinParraoparrao@mapmultimedia.cl 76
15.2.1.Instancias:
UnaInstanciaesuna"representacindeunSmboloenelEscenario".Cuando
creamosunSmboloyesteesregistradoenlaBiblioteca,enrealidadloque
apareceenelEscenario,esunaInstanciadelSmbolo.Esoesfcilmente
comprobable,yaquesiagarraselSmbolodesdelaBibliotecaylolanzasal
Escenario,yatendrs2Instanciasdelmismosmbolo.Inclusoesasegunda
instanciapuedesdeformarlaobajarlelatransparencia.Serndiferentes,pero
tendrnunmismoorigen:elSmboloenlaBiblioteca.
Puedequeestonosuenemuytilporahora,perodespustendrtodo
sentido.
Enunnuevodocumento,creaunSmboloClipdePelculallamadocaritafeliz
(queseajustamenteeso,unacaraconojosybocasonriendo)ydentrodel,
harsquelabocatengaunaanimacin.Labocalacolocasenotracapa,ya
travsdeunaanimacinporformaharsquedejedesonrer.
CristinParraoparrao@mapmultimedia.cl 77
EnelEscenario,debeestarnuestraInstancia1yenlaBiblioteca,nuestro
Smbolo.AgarraelSmbolodelaBibliotecayarrstraloalEscenario.Ahora
tenemos2instancias.ConlaHerramientaTransformacin,ensanchatu
Instancia2.PruebalaPelcula.
CristinParraoparrao@mapmultimedia.cl 78
Sitodoestenorden,versquelasdosInstanciastienenlamismaanimacin,
sloqueunaestaconelanchooriginalylaotramuyensanchada.
VuelvealEscenario,seleccionalaInstancia1yenPaneldePropiedades,y
sobre<NombredeInstancia>escribe"flaco".HazlomismoconlaInstancia2y
colcale"gordo".
AhoracreaunBotnconsus3Estados,mslaZonaActiva,yhazlomismo
quehicimosconelClipdePelcula,dejadosinstanciasdelmismobotnenel
Escenario.Enelcasodelosbotones,nolecolocaremosnombre.
ParalaInstancia1delBotn,agrgalelaaccin:
CristinParraoparrao@mapmultimedia.cl 79
on(release){
flaco.stop()
}
YparalaInstacia2delBotn,agrgalelaaccin:
on(release){
gordo.stop()
}
PruebatupelculayversquehasidomuysencillocontrolarunaInstanciade
unClipdePelcula.Elprimerbotncontrolaa"flaco"yelsegundoa"gordo".
Tambinpuedeshacermscombinaciones,porejemploqueunodetengaa
"flaco"yelotroloejecuteconplay().Oqueunbotnhagaun
flaco.gotoAndStop(5).Enfin,secomienzanaabrirlasposibilidadesparalograr
animacionescadavezmsinteractivas.
CristinParraoparrao@mapmultimedia.cl 80
16.Importacindeobjetos
CristinParraoparrao@mapmultimedia.cl 81
Flash,permitequeimportemosobjetosdesdeotroslados.Esohacemsrica
lacreacindemultimediaynospermiteexplorartodoelpoderdelsoftware.
16.1.ImgenesVectoriales:
Comoyaexplicamosalprincipiodeestemanual,lasimgenesvectorialesson
dibujosqueelsoftwareentiendematemticamente(aunqueunocomousuario,no
coloqueningnnmero).CuandodibujamosunaestrellaenelEscenario,es
estrellaesvectorial.Podemosacercarnosaellaconlalupaynosepixelar.
Otros3softwaresqueimportanvectores(dejarfueraenestaocasinaCorel
eIllustrator)esFireworks,FreehandyPowerPoint.
Suimportacinessumamentesencilla:CopiaryPegar
FireworksMX
SitienesundocumentoenFireworksMXqueincluyeobjetosvectoriales,lo
selecciona,locopias,luegovasaFlashyenelMenEdicin>Pegar(Control+
V)lopegas.FlashloconvierteinmediatamenteenunSmboloClipdePelcula,el
cualsideseas,puedesquitarleesacondicinconMenModificar>Separar.
Tambinpuedesconvertirinmediatamentelocopiadoenunmapadebits,con
MenEdicin>PegadoEspecial...>MapadeBitsindependientededispositivos.
UndocumentodeFireworksMXyaguardadoenPNG,tambinpuedeser
CristinParraoparrao@mapmultimedia.cl 82
abiertodesdeFlashconelMenArchivo>Importar>ImportaraEscenario.En
esecasoFlashpediralgunasconfiguraciones,quedebesingresar.
Freehand
EsbsicamenteigualaFireworks.
MicrosoftPowerPoint
Estesoftwaremehasidodemuchautilidad,alahoradeimportarsuImgenes
Prediseadas,quesirvencomoClipArtvectorialesparaFlash.
Suformadeimportaresmuyfcil.SeleccionastuImagenPrediseadaotu
Autoforma(engeneralcasitodasfuncionan,peropresentanproblemascuandose
lescolocanrellenosdetramaoimagen),lacopiasconMenEdicin>Copiar
(Control+V).LuegovasaFlashconMenEdicin>PegadoEspecial...>Imagen
(Metaarchivo),tepegalaimagencomovector.Normalmentellegaagrupada,pero
desgrupndolaometindotedentrodeella,puedesmodificarla.
16.2.ImgenesdeMapadeBits
LasimgenesdeMapadeBitssonenrealidadespeciesdemosaicode
pxeles,dondecadapxeltieneuncoloryunaposicin.Silaagrandamosonos
acercamosconlalupa,comienzanaversemsgrandeslospxelesya
desmejorarlaimagen.
ApesardequeFlashpermiteimportarvariosformatosdeimagen,losms
CristinParraoparrao@mapmultimedia.cl 83
ocupadossonJPG,GIFyPNG.AlimportarunaimagenMenArchivo>Importar
>ImportaraEscenario,FlashregistralaimagenimportadaenlaBiblioteca.
Lasimgenesdemapadebitsimportadaspuedenserunbuenmediopara
agregarleriquezagrficaaunproyectodeFlash,peropesanbastantemsqueun
dibujovectorialyademsalagrandarlasoachicarlas,pierdendefinicinporlo
quesedebetenerprecaucinyoptimizarbienlasimgenes.
Mirecomendacinesquelaimagenseoptimicehastaelpuntomsaceptable,
quesedejedeltamaorealenelcualsevaaocuparenFlashyluegoseimporta.
Hayquetratardeevitar,enloposible,elreescalamientodelasimgenesdemapa
debitsdesdeFlash.
Suanimacinesigualacualquieraotroobjetoypuedetransformarsea
cualquierotrotipodesmbolo.
16.2.1.VectorizarImgenesdeMapadeBits
Estaesunaherramientaquizsinteresantedesdeelpuntodevistagrfico,
peropuedeserunpocotraicioneraenelpesofinaldelapelculaosufluidezde
CristinParraoparrao@mapmultimedia.cl 84
animacin,sinosesabemanejarbien.
Importatuimagendemapadebits,seleccinalayvectorzalaenMen
Modificar>MapadeBits>TrazarMapadeBits.Lasopcionesquesedeben
configurarnospermiteajustarlavectorizacinyenrealidadlomejoresir
probandolasdiferentescombinaciones,hastabuscarmsomenosexactitudcon
laimagenoriginal,dependiendodenuestrosobjetivos.
Estaherramientalaocupamosmuchoenmiempresa,cuandohacamosWeb
CartoonanimadosdesdeFlash.Elilustradordibujabayseescaneabaa300dpi,
peroenBlancoyNegro(niescaladegrises,nicolor).Luegoesaimagense
importabaaFlashysevectorizabaconlasopcionesquevienenpordefecto(esa
combinacinresultababastantebien)yluegoseoptimizabanlascurvasconMen
Modificar>Forma>Optimizar,ysebuscabaunaoptimizacincercanaalMximo.
FinalmentesepintabaconlasherramientasdeFlashyluegoseanimaba.
16.3.ImportacindeSonidos
Elsonidoesunelementoquetambinenriquecenuestrotrabajomultimedial.
Flashpermiteimportarformatosdesonidos,talescomoMP3,AIFF,WAVy
CristinParraoparrao@mapmultimedia.cl 85
AU.Suimportacinparteigualquelasdelasimgenes,esdecirMenArchivo>
Importar>ImportaraEscenario.AlmirarelEscenario,aparentementenoha
sucedidonada,perolaBibliotecayaharegistradoelsonidoimportado.
ElSonidolollevasalEscenario,arrastrandoysoltando.Unavezhechoesto,
laLneadeTiempoharegistradotusonido(puedesvereldibujodelaondaenel
Fotograma),loquesignificaquedesdeahcomenzaraescucharsetusonido.
Apesardeserunamanerabastantesencilla,debestenerencuentalas
manerasqueFlashejecutaunSonidoentupelcula,quebsicamenteylasms
usadasson2:EventoyFlujo.
CristinParraoparrao@mapmultimedia.cl 86
AlseleccionartuFotograma,elPaneldePropiedadesregistraelsonido
escogido.DondediceSinc,esdondeconfiguraslamaneradeejecutarelsonido.
FlujosignificaquetusonidocomienzaeneseFotogramayseadaptaalas
rdenesdelaLneadeTiempoesdecir,siellargodelsonidoesde50
fotogramas,peroelFotograma30tieneprogramadounstop()elsonidose
detendrenesemomento.
Porotrolado,Eventosignificaquetusonidosibiencomienzaenelfotograma
indicado,notieneningunacoordinacinconlalneadetiempo.ElEvento
contribuyeenmuchodeloscasosenunabajadelpesodelapelcula.
Eventoesrecomendableparaloopsycualquiercosaquenodebacoordinarse
conotra.Flujo,alcontrarioesespecialparasonidosquedebancoincidircon
elementosgrficos(algocae,unabocahabla,etc.)
Enundocumentonuevo,importa2sonidosdiferentesdeunlargoentiempo
similar(porejemplodoscancionescortas).HazquetuLneadeTiempo(vacapor
ahora)durehastaelfotograma60,peroenel30,colocaunFotogramaClavey
djaloconstop()(asumoquelossonidossonmslargosque30fotogramas,si
noelejercicionoresulta)
Agrega2CapasyllevahastaelEscenariolosdossonidosimportados,unoen
cadaCapadiferente,peroquecomiencendesdeelFotograma1.Elprimero
configraloconFlujoyelsegundoconEvento.
CristinParraoparrao@mapmultimedia.cl 87
Pruebatupelculaycompruebalosresultados.
Ademspuedesconfigurarsielsonidodeberepetirseindefinidamenteoun
nmerodeveces.
FinalmenteFlashdaunaseriedeopcionesdeefectosprehechosotambin
sepuedenpersonalizar.HazclicenelbotnEditardelPaneldePropiedadesyse
tepresentarunaventanalacualcontieneeldibujodelaondadelsonidoyteda
laposibilidaddemover(comounecualizadorgrfico)lospuntosendonde
controlaselvolumendelsonido.
Notarsademsquepresenta2canales,loscualespuedeshacerefectos
interesantesconlosparlantes.Estaventanapuedeservistaconlossegundos
CristinParraoparrao@mapmultimedia.cl 88
transcurridosenelsonidooelnmerodefotogramasquerecorre.Tambinen
casodesonidosmuylargosomuycortos,tedaunalupaparamoverteconms
comodidad.
Finalmenteparaprobarelefecto,incluyedosbotones,unodeReproducir
SonidoyDetenerSonido.
16.4.ImportacindeVideo
Flashtambinpermitelaimportacindevideos,enlosproyectos
multimediales.AltenerinstaladoQuicktime4enelcomputador,permiteimportar
formatoscomo:AVI,DV,MPG,MPEG,MOV.ConDirectX7osuperiorinstalado
sloparaWindows,tambinademspermiteformatosWMV,ASF.
AbreunNuevoDocumento.MenArchivo>Importar>ImportaraEscenario,y
escogesalgnformatodevideo.
PuedeselegireditarelVideooImportarlocompleto.Enelcasodeeditarlo,
Flashtedalaposibilidaddeseleccionarpartesdelapelculayllevarlasal
documento.Ademspermitequeseleccioneslacompresindeseada,segn
velocidaddeconexindelosusuariosyunaedicinmsavanzadaquecontrolael
color,lasdimensionesyotrasopcionesdepista.
CristinParraoparrao@mapmultimedia.cl 89
Encasodeimportarlocompleto,lasopcionesfinalessonlasmismas,sin
evidentementelaedicin.
ElvideoesllevadoalaBibliotecaysepuedeutilizarcomounelementoms.
CristinParraoparrao@mapmultimedia.cl 90
17.PublicacinyExportacin
CristinParraoparrao@mapmultimedia.cl 91
DespusdetodoestoCmosalemipelculaparaquepuedaservistapor
otraspersonas?
Situtrabajofinaleslaweb,debesexportartutrabajoenunformatoswf
(ShockwaveFlash).Elarchivoswf,esunarchivoquecomprimetodotutrabajo
realizadoenelflayquedadeuntamaolivianoparaservistoporlaweb.Esteswf
normalmentedebeirsostenidoporunarchivoHTML,elcualFlashlopuede
generartambin.
Cuandohayasterminadotodatuanimacin,conbotonesprogramados,
instancias,videos,sonidosytodolodems,andaaMenArchivo>Configuracin
dePublicacin.
Estaventanateofrecelosformatosmsocupados(peronotodos)para
exportar.PordefectoapareceseleccionadoFlash(.swf)yHTML(.html)ysus
nombres,quequedanigualalnombredeltuFLA(queporsupuestopuedes
cambiar).Tambinpordefecto,estosarchivosexportadosseguardanenlamisma
carpetadelFLA,perolopuedesmodificareneliconodeSeleccionardestinode
CristinParraoparrao@mapmultimedia.cl 92
lapublicacin,aladerechaenformadecarpeta.
Ademsestasopcionesgeneran2lengetasconunaseriedeconfiguraciones
interesantesparapublicacin.Aniveldenovato,lasqueterecomiendoquedebas
tenersiemprepresenteson:
LengetaFlash:
Versin:Estemanual
correspondeaFlashMX2004y
correspondealaversin7.Sila
exportasenesaversin,losusuarios
delawebquenosehanactualizadoy
tienenversionesmenores,nopodrn
vertupelcula(porejemplo,siincluiste
video,alguienquetengalaversin5,
nuncapodrverlo,yaquedesdela6
Flashintegrelvideo).Enesesentido,
sitienesdudas,mejorpregntaleaun
usuariomsavanzadodeFlash,qu
versinrecomienda.Tododependera
quinvadirigido.
CalidaddelJPG:LeindicasaFlashcuntoquieresdesmejorartus
imgenes.Normalmentedjaloen80,peropuedesprobarconmenos(menos
pesofinaladems).Conmscalidad,nolorecomiendo,yaquelohacems
pesadoyenrealidadnuncavaamejorarlaimagen.
CompresinparalossonidosdeFlujoyEvento:Aplicandoelmismo
principioanterior,lossonidospuedesmantenerlosparecidosaloriginalo
desmejorarlosparahacermslivianalapelcula.Estohaciendoclicenelbotn
Establecer.Parasonidoslargos,convienedejarloenMP3,paracortosADPCMy
paravocesenVoz.
CristinParraoparrao@mapmultimedia.cl 93
LengetaHTML
Dimensiones:Puedesvariarel
tamaodelapelcula
Escala:Modificalamanerade
comportarsedelapelculaconel
HTMLcuandoesteesmodificadode
tamao(segenerascroll,sedeforma,
semantiene,etc.)
OtrosarchivosexportadosinteresantesquenospermiteFlashsonformatosde
imgenesGIF,JPG,oPNG,consusrespectivasconfiguracionessimilaresa
cualquiersoftwaredeedicindeimgenes.
TambintenemoslaposibilidaddesacarpelculasQuicktime.Estetipode
videorespetaralgunasaccionesdelosbotonesylosClipdePelculas.
ParaotrotipodeformatodeexportacincomoAVIuotros,debesiraMen
Archivo>Exportar>ExportarPelcula.Alelegirotrosformatos,Flashtedarla
posibilidaddeconfigurarlos.
AtencinconengaarseconelbotnAceptar.Esebotnindicaque
aceptastelasconfiguracionesdelosformatosescogidos,peronohaspublicado
nadaan.ParapublicarypodersubirloaInternetdebeshacerclicenelbotn
Publicar.
CristinParraoparrao@mapmultimedia.cl 94
18.Ejecutables
CristinParraoparrao@mapmultimedia.cl 95
Enlosformatosdeexportacin,senoshanquedado2eneltintero:Proyecto
Windows(.exe)yProyectorMacintosh.
Losdostienenelmismoobjetivo:podergenerarunarchivoquenovayaala
webyquepuedaserledoporcomputadoresPC(conWindows)yMacintosh,sin
tenerquebajarniinstalarningntipodeprograma.Yaqusedebeesto?
Porqueconesteformato,elprogramadelecturayavieneincluido.
EstoesespecialparapelculasquedebenserdistribuidasenunCD.Nosirven
paraweb.
Hayalgunasaccionesquenospermitenhacerpequeostrucosconlos
Ejecutables:losFSCommands.
fscommand(fullscreen,true):Independientedeltamaodelapelcula,la
transformaapantallacompletaytapaventanasabiertasdeotrosprogramas.
PuededeshabilitarseconlateclaESC.El"false",retornaalapelculaasu
dimensinoriginal.
fscommand(allowscale,true):El"true"permiteescalarloselementosdela
CristinParraoparrao@mapmultimedia.cl 96
pelculaenelespaciodisponible.El"false",mantieneeltamaodeloselementos
delapelcula,aunquesteseagrandegraciasafullscreen.
fscommand(showmenu,false):El"false",ocultaelmen"Archivo,Ver,
ControlyAyuda",yslodeja2opcionesenelmencontextualqueaparece
cuandoapretamoselbotnderechodelmouse,sobrelapelcula.Pordefectoes
"true".
fscommand("quit"):Idealparabotones"cerrar",quejustamentecierranla
aplicacin.
fscommand("exec","archivo.exe"):Abreaplicaciones.exe,quehansido
guardadasenunasubcarpetallamada"fscommand".
CristinParraoparrao@mapmultimedia.cl 97