no olvides revisar los temas anteriores practica 1 ya q son nesesarios para seguir con esta practica
para continuar nuestro curso hay q agarrar practica en lo poco q ya sabemos un consejo q te doy es q vayas experimentando con flash los tipos de efectos (acontinuacion los veremos) mmm debes de ser creativo y probar por tu cuenta
lo q haremos n esta practica sera un peqeño sistema solar
bueno para empezar abrimos nuestro programa flash
para crear nuetro fondo q sera negro hay dos opciones
1)crear un rectangulo del tamaño de nuestra area de trabajo con un fondo negro.
2)vamos a nuestro panel de propiedades en a parte q dice fonndo elegimos el color negro *este fondo sera para toda nuestra pelicula si existe + esenas tambien en ellas el fondo sera negro*
una ves q ya cambiamos nuestro fondo crearemos nuestro sol
para esto crearemos un circulo con contorno anaranjado y lo recortamos por la mitad una vez hecho esto ocuparemos la herramienta de tranformacion libre o Q para su acceso directo, que se encuentra debajo de la herramienta de seleccion .
Esta herramienta nos permite transformar(agrandar o achicar) nuestras elementos de flash, instacias,botones ,simbolos tambien nos permite darle un rotacion cambio de posicion entre otras ***te recomiendo q experimentes con esta herramienta ya q es muy util***
una vez q tenemos la mitad de nuestro circulo la tranformaremos en un clip de pelicula con nombre de sol ok
ahora con nuestra herramienta de transformacion a grandaremos nuestro sol cuando tenemos nuestra herrramienta de sellecion ocupada en nuestro elemento se puede ver a las orillas los puntos q puedes agrandar y en el centro existe un circulo el cual nos da la opcion de moverlo y partir de hay sera el punto d referencia desde donde se modificara nuestro elemento ***te recomiendo explorar todas la opciones de esta herramienta ***
intentemos colocar nuestro sol en un lado de nuestra area del trabajo
una vez hecho esto vamos a nuestro panel de propiedades y aun lado de la palabra propiedades estan nuestros filtros aqui es donde estan los efectos q flash puede dar a los simbolos bisel,iluminado entre otros para poder abrilos damo click en el simbolo de “+”
***si no sale habilitada esta opcion es poq no tienes seleccionado ningun elemento***
ahora escogemos iluminado en esta parte del lado derecho elegimos un color anaranjado y en intensidad arriba del 200 en desenfocar x y y los cambiamos a 100***si realmente quieres aprender hacer cosas interesantes con flash debes de jugar con los filtros intentando convinarlos cambiando caracteristicas .. y te daras cuenta q con esto puedes crear mas efectos**
ya q tenemos sta parte vamos ahora a la linea del tiempo y a nuestra capa le cambiamos el nombre dando doble click donde dice capa1 y le ponemos sol
ahora crearemos una nueva capa para esto en este mismo lado de la linea del tiempo da click derecho y seleccionamos la opcion de insertar capa
ahora presta ATENCION*** las capas van a tener sus propios fotogramas y en cada fotograma puede haber uno o varios elementos por el momento solo manejaremos un elemento por capa ok asi q checa muy bien lo q sigue…***
colocate sobre el primer fotgrama de la capa q acabas de crear y hay empieza a dibujar con la herramienta linea (N) una line y dale la forma curva recuerda elegir color blanco el contorno esta herramienta funciona como la de elipse y rectangulo solo q aqui solamente escojemos contorno
una ves q dibujamos nuestra linea cambiamo el nombre a la capa y le ponemos orbita “sto nos servira pra no confundirnos”, cuando la linea ya esta dibujada observa q el fotograma de a capa orbita pasa de un fotograma vacio a un fotograma ocupado
ahora si nosotros queremos seleccina un elemento apartir de una area de seleccion con el mouse observa q tambien tomas elementos indeseables
en el ejemplo de abajo cuando seleccione mi circulo tambien sellecione parte de la orbita
para q esto no pase en la parte superior hay una opcion para bloqear yesa es el candado q esta le damos click y nuestras capas estaran bloqueadas y asi sus elementos no puedan ser seleccinados,borrados entre otras cosas
bueno ahora hagamos nuesto criculo un simbolo con nombre de planeta y cuando ya es un simbolo vamos a la parte de filtros escojemos la de bisel
ahora solo trata de hacer una buena combinacion entre las opciones q hay ..***lo mejor q puedes hacer ahorita es probar y probar las convinaciones entre el desenfocado en x y y intensidad colores en sombra y resaltar desbloquea el candadito q ves en desefocar te permitira mas convinaciones
un consejo con este filtro se da un retoq de 3d por asi decirlo usandolo adecuadamente tambien puedes hacer degradados en tus simbolos pero los veremos mas tarde
ahora una vez q terminaste de probar y ya viste cual s la convinacion q mas te gusto solo hay q darle una peqña animacion…
colocaremos nuestro planeta arriba donde empieza nuestra orbita
ahora nos vamos al fotograma 10 y creamos un fotograma clave f6 y ahora q ha pasado nuestro planeta ha qdado solo en nuestra area de trabajo
ahora en las dos capas q faltan coloquemos fotogramas de relleno con f5
ahora regresamos a nuestro fotograma clave cambiamos de posicion nuestro planeta y creamos una interpolacion y si vas a filtros bisel y le cambias en la parte q dice angulo veras q opciones hay para hacer esta animacion…..
disculpen por el momento le dejare aqui q hay mas cosas por acer
hola!! por fin entramos a la practica yeah!!! mmm bueno para ver esta unidad se hara por decirlo 3 Practicas asi q comencemos ok
En las practicas se abarcaran lo siguientes temas talvez no todos al mismo tiempo pero entres las 3 veremos todo
-Capas
-Fotogramas y fotogramas clave
-Creación de Símbolos
-Propiedades
-Manipulación de objetos y símbolos
-Solapamiento de imágenes
-Interpolación de Movimiento
-Acción stop
-Publicación
COMENZEMOS!!!!!!! antes de comnzar si no tienes los elementos nesesarios para empezar te recomiendo visitar esta pagina aqui podras encontrar lo nesesario para este curso con la version de prueba tienes “para empezar”
y por favor revisa la unidad 2 para q sepas q onda esta muy sencilla pero desde ahorita ya empezaremos a manejor lo enseñado en esa unidad asi q tomate unos minutitos para revisarla ok
PRACTICA 1 PELOTA BOTANDO
Empezemos …
Entremos a nuestro programa flash si lo instalaste con las opciones por default inicio>todos los programas>macromedia>Macromedia flash 8 si lo acas de instalar te saldra una ventana con dos opciones elige la q dice flash profesional 8.
despues entraras a flash y te saldra la hoja de inicio
escogemos la opcion de nuevo documento .
ya q estemos dentro ahora si ya viene lo bueno …
Basicamente crearemos una instancia q sera nuestra base para nuestro simbolo pelora y le daremos animacion por medio de fotogramas y fotogramas clave e interpolacion de movimiento…
asi hacen referencia los tutoriales en sus ejercicios mmm no te precupes sno le entendiste al final de la practica te reto a q leas de nuevo ese parrafo y veas la diferencia…
bueno mucha charla y nada de accion prosigamos
en flash existen varios tipos de elementos, simbolos, instancias, btones y aqui as describiremos una x una como las vayamos ocupando
en nuestra barra de herramientas vermos dos herramientas el ovalo y el rectangulo (presionando o y r en el teclado es su acceso directo)con ellos podemos dibujar dichas figuras , por el momento solo ocuparemos el circulo, escogemos la herramienta ovalo y en la parte de abajo dice colores y aqui estan nuestras herremientas de relleno y contorno con ellas damos color a nuestra instancia elejimos de relleno azul y contorno rojo(los colores son lo de menos).
una vez elegido esto pasamos a nuestra area de trabajo (el rectangulo blanco) y vemos q nuestro cursor a cambia de forma ahora sin soltar el boton derecho del mouse dibujamos nuestra instancia circulo….
una vez hecho esto nos qd un circulo esta es nuestra instancia …llegado a esta punto explicare q es una instancia
INSTANCIA en flash los dibujos q creamos con sus herramientas son instancias estas pueden ser modifcadas,recortadas entre otras opciones prueba inenta cortar tu circulo a la mitad como???
primero en la barra de herramientas escije la herramienta seleccion (la flechita negra) o sencillamente teclea v para su acceso directo una ves q ya tengas esta herramienta con el mouse solo presionando elboton derecho veras q sale un recuadro bueno este recuadro es el area de seleccion mmm intenta selecionar solo la mitad del circulo y una ves seleccionada muevela para donde quieras … experimenta modifica el circulo ve su contorno se puede moldear, q el contorno y el relleno son dos cosas difentes y una vez hecho esto borralo por q etsamos haciendo una pelota jaja mmm para borrar todo solo crea un area de seleccion del tamaño del area de trabajo y presiona supr y vuelve a crear tu ovalo.
Prosigamos perdon por la minipractica de arriba pero ya les dije aqui aprenderemos conforme a la marcha ok asi q continuemos
una vez q tengamos nuestro circulo los selecionamos y preionamos f8 se nos deplegara una ventana en la cual ns dara la opcion de convertir nuestra instancia en algun tipo de simbolo clip de pelicula,boton,grafico.
(hay otra manera de crear simbolos pero mas adelante las explicaremos no desesperes )
borramos el nombre de simbolo1 y ponemos pelota en tipo elegimos clip de pelicula ok.
Un clip de pelicula es un simbolo q puede tener filtros bisel,transparencia entre otros aparte nuestr clip de pelicula ya no puede ser dividido tan facilmente cuando lo seleccionemo ya selecionaremos todo mmm por el momento con esto basta mas adelante explotaremos todas las caracteristicas q tiene este tipo de simbolo ok.
ya q tenemos nuestro simbolo lo colocamos en la parte superio del area de trabajo y pasamos a nuestra linea del tiempo …yeah ya viene lo bueno
en la linea del tiempo veras en el lado derecho las cpas y el lado izquierdo nuestros fotogramas.
bueno empezemos….
Fotograma el fotograma es la parte de la linea del tiempo en donde estarran nuestros sombolos e instancias en ellas .
Fotograma clave esdonde se lleva acabo algun cambio dentro de nuestra animacion, los simbolos e instancias son cambiados de poscion o simplemente borrados.
Capa.- una capa es donde staran nuestros fotogramas y donde se llevara acabo nuestra animacion.en ella estaran solo los simbolos q se encuntren en los fotogramas clave… tienes q tener cuidado n esto mas adelante vermos el porq …
bueno en nuestra linea del tiempo vamos al fotograma 10 y apretamos f6 al hacer esto crearemos un fotograma clave .
ten en cuenta los fotogramas clave tienen un puntito por asi decirlo mientras del fotograma 2 al 8 son normales no estan vacios por q contienen nuestro simbolo.
mmm prosigamos en nuestro fotograma clave movemos nuestro simbolo a la parte de abajo una ves hecho esto aplicamos una interpolacion de movimiento.
Una interpolacion de movimiento es cuando nosotros movemos nuestros simbolos de lugar loq va a suceder al crear esta interpolacion es q uestro simbolo se overa desde la psicion 1 donde tenemo nuestro prime fotograma clave (no siempre el primero debe ser clave) hasta donde exista otro fotograma clave.
Ten encuenta q este tipo de interpolacion solo funciona con simbolos no con instancias ok
para crear esta interpolacion hay diversas formas expliqemos la primera en nuestra linea de tiempo seleccionamos un fotograma anterio al ultimo fotograma clave y este damo click izq y elegimos la opcion crear interpolacion de mvimiento una vez creado esto nuestro fotogramas pasaran del gris a morado
bueno ahora recorre la linea del tiempo y ve q pasa (para recorrela solo selecciona el primer fotograma y sin soltarlo pasa hasta el ultimo)
bueno ahora crea otro fotograma clave en el 20 y vuelve aponer la “pelota” en su lugar ok para q de el efecto de estar botando
ahora ve a archivo y guarda tu trabajo con la opcion de guardar como seleccionas done lo quires guardar ok
para ver tu trabajo presiona f12 y wuala listo
mmm por el momento sera una pelota q se la pasa bote y bote …
ahora un poquito action script ve al ultmo fotrgama selecionalo y presiona f9 se abrira panel de acciones en la parte de blanco scribe stop(); observa q una vez q hiciste esto el fotograma tiene una a esta a nos dice q ese fotograma tiene action script
y en miminmiza el panel donde esta la flechita y panel de acciones da click y se minimizara ahos si apriets ctrl+s se guardara tu trabajo mm para fializar esto presiona f12 y ve …
Los conceptos basicos como fotograma ,fotograma clave ,capa y demas los abrodare en la siguiente unidad , creo sera mas practioc ver estos conceptos aplicados. No desesperen esta ya es la ultima parte teorica ya de aquí en adelante veremos practica que es lo emocionante
Escenario aquí es donde elaboraremos nuestro proyecto , es aquí donde estaran nuestros, simbolos,clip de pelicula, botones ,instancia y demas (si no conoces ninunguno de etsos terminos no te preocupes mas tarde sabras q es)
Línea de tiempo.la linea del tiempo es la que controlara nuestro fotogrmas(mas adelnate explicaremos esto)basicamente en esta parte es la encargada de darle forma a nuestra animacion.
Barra de herramientas aquí es donde estan la mayor parte de las herramientas de flash ,(esta barra es muy semejante a la de paint), he visto que en muchos tutoriales que existen en internet ocupan muchas ojas en describir esta barra, nosotros veremos la utilidad de cada herramienta mi entras la ocupamos ok.
Panel de Propiedades este panel como su nombre lo dice es aquí donde se veran y asignaran las diferentes propiedades existentes a nuestros elementos , son muy pocas pero una vez q sabes como convinarlas creeme que veras todo lo que se púede hacer.
Panel De Acciones este panel es donde estara nuestro codigo fuente en este caso el action script. -Biblioteca aquí es donde se guardan nuestros elemenetos (botones clips de pelicula entre otros)
Bueno mmm al parecer wordpress no soporta archivos SWF pero ando viendo como resolver esto mientras les dejo esto:
antes por el momento esta pagina no le puse muchas cosas solo hay un swf referente a esta unidad apartir de la unidad 3 espero q los SWF esten mejorcitos una disculpa si lo ven muy sencillo pero lo hago asi para seguir avanzandole con el curso (no espretexto jaja)
bueno antes de empzar con esto les dire q este curso esta dedicado auna amiga muy querida Paola y atodos mis compañeros de ESIME-CULHUACAN y en especial a la profesora Maryel se Los debia compañeros y todo el publico q desee aprender a ocupar este fabuloso software .
pasemos a los temas esta parte la resumire y asi podre ocupar mejor el tiempo en pasar ya con lo bueno ok
Descripción de Flash
Flash es una herramienta de edición con la que los diseñadores y desarrolladores pueden crear presentaciones,aplicaciones y otro tipo de contenido que permite la interacción del usuario. Los proyectos de Flash pueden abarcar desde simples animaciones hasta contenido de vídeo, presentaciones complejas, aplicaciones y cualquier otra utilidad relacionada. En general, los fragmentos independientes de contenido creados con Flash se denominan aplicaciones, aunque se trate solamente de una animación básica. Se pueden crear aplicaciones de Flash con una amplia variedad de contenido multimedia que incluye imágenes, sonido,vídeo y efectos especiales.
Aplicaciones que se pueden crear con Flash
Animaciones Incluyen anuncios publicitarios, tarjetas de felicitación en línea, dibujos animados, etc. Muchos otros tipos de aplicaciones de Flash también incluyen elementos de animación.
Juegos Numerosos juegos se crean con Flash. Los juegos normalmente combinan las capacidades de animación de Flash con las capacidades lógicas de ActionScript.
Interfaces de usuario Un gran número de diseñadores de sitios Web utilizan Flash para diseñar interfaces de usuario. Estas interfaces incluyen tanto sencillas barras de navegación como diseños mucho más complejos.
Áreas de mensajes flexibles Se trata de áreas de las páginas Web que utilizan los diseñadores para mostrar información que puede variar con el tiempo.
Aplicaciones dinámicas de Internet Incluyen un amplio abanico de aplicaciones que proporcionan una elaborada interfaz de usuario para mostrar y manipular datos almacenados de forma remota a través de Internet. Una aplicación dinámica de Internet podría ser una aplicación de calendario, una aplicación de búsqueda de precios, un catálogo de compra,una aplicación de educación y pruebas, o bien cualquier otra aplicación que presente datos remotos con una completa interfaz desde el punto de vista gráfico.
IMPORTANTE: EN ESTE CURSO SOLO VEREMOS POR EL MOMENTO PRINCIPIOS BASICOS DE ANIMACION INTERFACES DE USUARIO (BOTONES ,BARRAS , ETCPARA PAGINAS WEB)
Creación de un sencillo documento de Flash
Cuando abrimos flash profesional 8 nos sale la siguiente ventana en la parte q nos dice Crear Nuevo le dare clic a documento de flash ya q asi podremos ya sea crear solo botones,paginas,presentaciones es mas practico esta opcion
Flash Player
Flash Player 8, que ejecuta las aplicaciones creadas, se instala de forma predeterminada junto con Flash. Esta aplicación garantiza que todos los archivos SWF de Flash puedan visualizarse y estén disponibles en las mismas condiciones en todas las plataformas, navegadores y dispositivos,incluidos teléfonos móviles.Flash Player se distribuye con los productos de los principalescolaboradores de software, entre los que cabe destacar Microsoft, Apple,Netscape, AOL y Opera, para ofrecer contenido y aplicaciones multimediaa más de 516 millones de personas de todo el mundo. Se distribuyegratuitamente a cualquier persona que desee utilizarlo. La última versiónde Flash Player puede obtenerse en el Centro de descargas de Macromedia
yeah!!! mmm bueno para ver esta unidad se hara por decirlo 3 Practicas asi q comencemos ok
(hay otra manera de crear simbolos pero mas adelante las explicaremos no desesperes )
bueno ahora recorre la linea del tiempo y ve q pasa (para recorrela solo selecciona el primer fotograma y sin soltarlo pasa hasta el ultimo)
pero ando viendo como resolver esto mientras les dejo esto:
