Macro-media flash
 |
| El Popular logo de Flash |
Flash fue originalmente publicado porMacromedia en 1996. Comenzó como una herramienta de animación y un plug-in opcional para los navegadores Web. Durante la siguiente década, Flash se hizo más popular gracias al aumento de sus características y se convirtió en un plugin estándar incluido en casi todos los navegadores Web. En 2005, Adobe adquirió Macromedia y se hizo cargo del desarrollo de la tecnología Flash.
Anteriormente, esta exitosa aplicación no se llamaba "flash" como lo conocemos ahora si no que...
Con el pasar del tiempo apareció internet y varios quisieron poner animaciones, FutureWave hasta empezó a desarrollar plugins para Netscape, pero eran lentos, entonces paso a llamarse Future Splash Animator. La compañía se había dado cuenta de que el software tendría un buen impacto y acudieron a Adobe, pero solo se interesaron en SmartSketch y de Future Splash Animator dijeron que era muy obsoleto.
Fue en noviembre de 1996 cuando Macromedia invitó a FutureWave a trabajar juntos, y posteriormente realizar la compra de ésta, con lo que para diciembre de ese mismo año Future Splash Animator se convirtió en Macromedia Flash 1.0.
Con esto permitió a los diseñadores y realizadores de páginas web crear entornos gráficos de páginas webs vectoriales e interactivos como por ejemplo: botones, paneles de navegación, dibujos técnicos, banners de anuncios y todo lo que sabemos que se puede hacer con flash.
Una de las desventajas en sus primeras versiones, es que eran pocos los que desarrollaban en flash, y una de las principales razones es que no le tenían confianza. Pues no era muy conocido, y tal fue el caso de Adobe que al principio no le vio futuro, no así el caso de Macromedia que inicio con su primera versión y dejó de ser de Macromedia hasta FlashMX.
En la actualidad sabemos que Adobe compró Macromedia y entonces flash es más poderoso que nunca, son inmensas las posibilidades con flash, pero hasta ahora nada más esta la limitante que tiene que usar otros lenguajes para poder utilizarla con bases de datos.
ANTECEDENTES DEL FLASH
La historia del Flash es importante para entender que hay detrás del mismo, porque el funcionamiento de un programa complejo, de un Authoring como el Flash, es el resultado de un desarrollo que se unirá en un solo programa y la evolución debida al curso del tiempo.
El Flash es un producto de Macromedia y es por eso que necesitamos
saber algo acerca de ellos.
Macromedia empezó siendo un tipo de inteligencia llamada Macromind, fue la que comprendió la potencialidad del desarrollo del Vectorial en Internet.
Macromind fue fundada por Marc Cantor, en 1984 en Chicago y ahora se encuentra su sede en San Francisco, California.
Marc Cantor era un músico que trabajaba en el campo de los video juegos, haciendo música para éstos.
La computación gráfica en los años 80's era rudimentaria, no estaba muy desarrollada, pero la Macromind introdujo en el mercado un Authoring multimedia (siempre con música, imágenes y otras aplicaciones) que se llamaba VIDEOWORKS. Este agredió el mercado contrastando los programas más difundidos como aquellos del Apple, llamado HyperCard.
La Macromind cambió de propietario y así mismo de nombre, adquiriendo el nombre que ahora conocemos como Macromedia.
Posteriormente empezó la evolución de Videoworks con el programa Director, que fue el papá de todas las versiones sucesivas del Flash.
Lo mejor de Director, junto a un programa adquirido de un software house llamado Future Splash, nace el FLASH 2.0, que fue la primera versión de Flash Macromedia.
El gran desarrollo del Flash no es solamente importante por su capacidad en las aplicaciones multimedia, sino sobre todo por su utilización en Internet.
¿QUE DIFERENCIA HAY ENTRE FLASH Y HTML?
El Html significa Hyper Text Markup Language, o sea que está construido como tipo de lenguaje en grado de operar para la Hipertextualidad, que es la característica principal de Internet : saltar de una página a otra.
El Flash, en vez, es un Editor o Authoring, un programa que a su vez se basa en un Script de programación, que utiliza otro tipo de lenguaje.
Entre otras características que diferencian el Flash con el HTML, están:
Una página construida en Flash, por ser Multimedia, se convierte de una Página Web a un Sitio Web. O bien permite de superar el formato o corte de periódico que tenían las páginas Web y finalmente acercarlas al mundo de Internet, a la capacidad de la televisión con sonidos imágenes en movimiento efectos especiales, etc.
Con HTML, no es que no sea posible insertar este tipo de cosas, como sonidos o imágenes, pero deben apoyarse en otros programas, por ejemplo: para visualizar una película se debe bajar o cargar (download) en la computadora y después verlo sucesivamente con un video player.
La música también se puede insertar, pero el Html tiene sus limites, sobretodo en la espectacularidad del sitio, por esto inventaron otro lenguaje, que se llama Dhlm dónde la d caracteriza el Dinamismo y Movimiento con el que logra crear algunos efectos.
A pesar de que también existen editores de Html, que pueden desarrollar un sitio sin conocer el programa, y lo logran de una forma dinámica, no consiguen alcanzar la multimedialidad que Flash proporciona.
¿QUÉ ES EL FLASH Y CÓMO TRABAJA?
¿QUE ES?
El nombre técnico para Flash es Authoring, o sea una plataforma de desarrollo para otros Software y para Multimedia.
En práctica el Flash es un programa que permite desarrollar objetos Multimediales, visibles no sólo en Internet.
En los Browsers más conocidos que son el Netscape y el Explorer, gracias a un acuerdo entre compañías, ya se implementa, en sus nuevas versiones un instalador automático, que es un lector de Flash y Shockwave que permite al usuario ver el trabajo realizado.
¿CÓMO TRABAJA?
Inicialmente Macromedia había dejado de trabajar con los proyectores de Director, que estaban adaptados (adecuados) a la red por medio del Extra Afterburner, el cuál es legible a través de un programa llamado Shockwave. O sea que para poder ver algún trabajo realizado en Flash, éste se graba como proyector legible con Shockwave, el cual es: .swf. Este proyector de Flash fue inicialmente el proyector de Director.
El Shockwave y Director utilizan un lenguaje de Scripting llamado Lingo, que es un lenguaje (de programación), que era muy complejo y parecía que no debía desarrollarse. Pero con la difusión del Flash y el apoyo que tienen sus proyectores de Shockwave, lograron poner al día el obstáculo que hacía difícil su utilización, gracias a la expansión del Flash, el cual de todos modos se convertiría en uno de los estándares del Web.
El Shockwave utiliza un Steaming para bajar datos, que permite que se vean similares a un programa o spot de Televisión. El Flash viejo no podía realizar este tipo de cosas, entonces se auxiliaba con el Shockwave.
Las diferencias entre Shockwave y Flash son:
Que ambos son formatos (programas) compatibles pero que tienen un papá diferente. Nacieron de dos Authoring diferentes y al mismo tiempo símiles.
El Shockwave, se basa en un lenguaje de Scripting (el Lingo), que es muy complejo pero potentísimo y convierte a este formato en muy potente en la Web, capaz de administrar database y media, aún siendo complejos.
También Shockwave, es un formato que se adaptó al Internet, por esto es más complejo.
El Flash es mucho más fácil de aprender.
El Shockwave por el contrario nació como programa potente para aplicaciones Multimedia (música, juegos, imágenes, voces, sonidos, caricaturas, etc.).
El Flash estuvo proyectado para la WEB, por esto es más fácil utilizarlo.
Las películas del Flash pueden leerse por medio de los proyectores del Shockwave (.SWF) estos proyectores son buenos porque resultan ser más ligeros y utilizan la tecnología Streaming.
Por último, vemos que Flash se apoya en Shockwave para tener una
mejor proyección, o sea que en conclusión trabajan juntos, porque a pesar de estas diferencias, Flash y Shockwave tienen características y usos similares, porque son productos creados por la Macromedia.
CUALIDADES TÉCNICAS FUNDAMENTALES DE ESTE PROGRAMA
Las computadoras despliegan gráficos ya sea en Vectores o en Formatos Bitmap. Es importante entender las diferencias entre ambos formatos para aclarar este programa llamado Flash, que nos permite crear y animar gráficos Vectoriales compactos. También nos permite importar y manipular Vectores y gráficos Bitmap que hayan sido creados en otras aplicaciones, o sea cualquier tipo de gráficos.
VECTORES
Este describe imagines utilizando líneas y curvas, llamadas Vectores, que también incluyen propiedades de color y posición. En este ejemplo, la imagen de esta hoja está compuesta por puntos por los cuales las líneas pasan, creando la forma del contorno de la hoja. El color de la hoja es determinado por el color de la línea del contorno y el color del área interna por el color del contorno.
Cuando se edita una gráfica en vector, se modifican las propiedades de las líneas y las curves para describir su forma. Se puede mover, reajustar tamaño, forma, cambiar color, etc. de un vector, sin cambiar la calidad de su apariencia inicial. Los gráficos de Vector tienen una resolución independiente, o sea que se pueden desplegar en todo tipo de programas y equipos, con variedad de resoluciones sin perder su calidad.
Para tener una idea precisa de que significa Vectorial, recordemos o pensemos en las coordinadas Cartesianas:
El diseño Vectorial está basado en una fórmula puramente matemática, se ocupa el mismo espacio aún queriéndolo agrandar. Y si se agranda miles de veces siempre se verá bien porque no es un diseño, sino una aplicación matemática.
En las gráficas vectoriales, se ve aún la parte más pequeña, que equivale a la unión de coordenadas como en el ejemplo de arriba “X” y “Y”. Así que una vez se quiera agrandar, la computadora no hará un “zoom”, sino lo diseñará de nuevo calculando las coordinadas justas para hacerlo verse más grande y bien sin perder resolución. Entonces, una gráfica vectorial tiene una fórmula matemática que la computadora calcula para representar el diseño en la pantalla.
GRAFICOS BITMAP
Las imágenes Bitmap, son las imágenes que siempre se han utilizado en la computadora. La pantalla está llena de píxel.
Entonces, recordemos que el Bit, es la unidad de medida principal de la computadora y a cada cuadrito colorado (píxel) corresponde un Bit.
Los file o archivos JPEG y GIF, son las imágenes Bitmap comprimidas, pero más ligeras con el mismo principio.
Es decir que los gráficos Bitmap, realizan imágenes utilizando puntos de colores, o Píxel, compuesto dentro de una celda. Por ejemplo, la imagen de esta hoja contiene una locación específica y valores de color de cada píxel en la celda, creando una imagen muy similar a la de un Mosaico.
Cuando se edita este tipo de gráficos Bitmap, se deben modificar píxel, en vez de líneas y curvas. Estos gráficos Bitmap son de resolución dependiente, porque los datos que componen las imágenes están mezclados dentro de una celda de un tamaño en particular. Editar uno de estos gráficos puede cambiar la calidad de su apariencia inicial. En particular, reajustar el tamaño de un gráfico Bitmap puede hacer que los bordes de la imagen desalineada como píxel sean redistribuidos dentro de la rejilla. Desplegar una gráfica de Bitmap en cualquier equipo o programa que tenga baja resolución, menos que la de la imagen misma, degrada la calidad de su apariencia.
EN CONCLUSIÓN, ¿PORQUE ES MEJOR EL VECTOR O VECTORIAL QUE EL BITMAP?
Por que al manipular o modificar el tamaño de una imagen Bitmap, la calidad ya no es la misma, puesto que se distorsiona la gráfica y no reconoce su forma original, a diferencia del Vector que mantiene su color y forma.
Y por último, que una imagen Bitmap pesa mucho, mientras que una Vectorial no.
CARACTERÍSTICAS FUNDAMENTALES DEL FLASH
Flash es un programa que contiene muchas herramientas de trabajo similares y en algunos casos igual a las de la mayoría de programas de diseño gráfico, o al menos de los más conocidos y mejores en el mercado.
Entre algunas de las herramientas y funciones diferentes que este programa contiene están:
- El Publish, que es un visualizador de nuestro trabajo ya sea en Html o en Flash. Y dependiendo de la orden que le demos, en este formato lo veremos, previo a nuestra edición final. Este se encuentra en Archivo. Otra forma de visualizar nuestro trabajo es por medio de Test Movie que se encuentra en Controles.
- Luego en Edit, tenemos varias opciones de Frames o Marcos, que son los fotogramas en dónde se organizan los objetos y movimientos en manera temporal.
- También en Edit, encontramos una opción de Edit Symbols,
que sirve para transformar en Vectorial los objetos, nombrándolos de una forma diferente, que se guardan automáticamente en una librería de símbolos. En Insert, encontramos también esta opción.
- En Insert la mayoría de opciones son diferentes porque son especiales para este programa, entre ellas tenemos la de Layer. Que es la “página en blanco” en dónde se trabaja. Esta opción permite agregar o eliminar hojas de trabajo.
- Siempre en Insert, encontramos Motion Guide, que es una guía de la trayectoria que debe realizar un objeto al que se le pretende dar un movimiento.
- Otra es Scene o Escena, que es en dónde se trabaja. Aquí podemos agregar o eliminar escenas, las cuales se pueden unir formando una animación, como una película.
- Los Controles son los cuales ayudan a revisar la edición de un trabajo, como lo hacen las video caseteras. A diferencia de este hay un comando llamado Debugging que sirve para eliminar los errores que puedan tener tanto el diseño como la programación del mismo.
- En Window se pueden abrir todas las ventanillas donde se manejan los colores, se selecciona, efectos especiales y variables en las acciones que se realizan.
- Por último en la barra de tareas encontramos Snap to Object, que es importante porque ayuda a mejorar el diseño realizado, redondeándolo en algunos casos y en otros haciéndolo más estilizado.
UN PEQUEÑO EJEMPLO DE CÓMO REALIZAR UNA ANIMACIÓN EN FLASH
TIMELINE:
Que es la línea temporal o de tiempo, o bien la secuencia en el tiempo. Esta consta de niveles. Los niveles son como si fueran páginas transparentes, sobrepuestas.
Por ejemplo:
NIVEL 1:
Es todo azul (se pone la escena azul).
NIVEL 2:
Sobre se diseñan nubes.
NIVEL 3:
Sobre este tercero se dibuja un avión.
En el primer nivel el fondo del cielo no cambia, se mantiene al menos que se desee que el cielo se obscurezca hasta ser de noche.
En el segundo, que es el de la nube, se puede diseñar nubes y quitarlas para dar un efecto de viento.
Y sobre el tercero en vez se diseña un avión que pasa entre las nubes y que atraviesa la pantalla.
Naturalmente a cada nivel corresponde un STAGE (o página transparente de trabajo dónde se diseña).
Si se desea que el avión atraviese las nubes, se diseña este avión, y se coloca en el extremo de la pagina de trabajo por ejemplo todo sobre la derecha para que se vea solo la cola. Para realizar este movimiento se deberá grabar en la Timeline que vaya de el Fotograma 1 al Fotograma 20 por ejemplo.
Se va grabando sobre el primer fotograma (la cola del avión), después en el último fotograma la cola del avión de la parte opuesta.
Se le dice al programa de hacer una película de esto y se tendrá un avión que pasa.
Por ultimo la Multimedialidad del flash permite que se pueda insertar música o ruidos a las animaciones.
A este ejemplo del avión que pasa, se le puede poner un sonido en la Timeline, en dónde se diga de realizar este sonido del fotograma 1 al 9.
Para insertar un archivo musical o de sonido, se puede importar de otro lugar, pero debe de ser un archivo .WAW, que posteriormente se introduzca en la escena que se necesite.
Este ejemplo está contenido en el file proyector: aereo.swf, que se puede ver si se posee un lector de Flash o un Browser que sea una versión reciente.
LA ESTRUCTURA DEL PROGRAMA
Esta es la pantalla principal cuando se abre el flash se pueden ver claramente 4 partes distintas.
La PARTE 1 Es el MENU clásico de todas las aplicaciones de Windows.
La PARTE 2 Es el TIMELINE o sea la línea de tiempo o temporalidad, donde podemos realizar diseños, movimientos con tiempo, como en una película para el cine.
La PARTE 3 Es la que contiene los instrumentos colores, lápices, texto, borradores, diseño de formas, etc…
La PARTE 4 Es el STAGE o area de trabajo dónde se realizan los diseños.
|
A la izquierda encontramos la TIMELINE, en donde se encuentran pequeñas líneas, que son FOTOGRAMAS, o sea fracciones de segundo en dónde se pueden grabar objetos y sus movimientos, construyendo así una película.
Esta es la línea de tiempo o TIMELINE, en la cual se puede iniciar realizando un diseño en el fotograma 15 (por ejemplo), luego se va al fotograma 40 y se verá este diseño que se mueve dentro la página (en la pantalla). Entonces se utiliza el comando de “Motion Picture” que el flash contiene entre el fotograma 15 y el 40 y la acción de movimiento se realizará.
30 Debe representar también los movimientos intermedios entre los dos puntos para representar el movimiento en la pantalla (o página).
CONCLUSION
La historia del Flash es el resultado de una evolución de Authoring o sea de programas que ayudan a programar y a realizar aplicaciones Multimedia (música con video, video juegos, etc.). Los más importantes fueron: Director, Video Works y Future Splash. Estos programas se basan en lenguajes de Script (el Lingo para Shockwave y el flash tiene un Script más manejable). del resultado de la evolución de estos programas y sobre todo mejorándolos para su utilización en el web nació el flash.
Tecnológicamente el Flash es un Authoring en continua evolución,
su otro nombre es: Editor de Gráficos Vectoriales.
Por otro lado podemos concluir con algunas diferencias:
El Vectorial que corresponde al Flash y el Bitmap que se utiliza en la mayoría de programas para diseño gráfico.
La diferencia entre Flash y Html, es evidente, el flash es un editor gráfico y un Authoring, mientras que el Html es propiamente un lenguaje, utilizable para realizar paginas de Internet.
La importancia principal del Flash, está en haber sido realizado para su desarrollo en la red.
No se sabe si el Flash sustituirá al Html dentro del Internet, porque de todas formas Internet es una realidad en continua evolución y tarde o temprano aparecerá algún programa nuevo que podrá mejorar las funciones del Flash, mientras que el Html de cualquier forma vendrá utilizada porque es la base de la tecnología utilizada para el Web.
GLOSARIO
- AFTERBURNER: Programa gráfico.
- APLICACIONES: Programas, ejemplo: Word es una aplicación de Word Processor.
- AUTHORING: Son todos aquellos programas que sirven y ayudan a programar, o que se utilizan para desarrollar aplicaciones Multimedia, por ejemplo: música, videos, sonidos, etc..
- FUTURE SPLASH: Programa base del Flash de gráfica (tipo Freehand)
- HYPERCARD: Es un programa gráfico.
- LINGO: Es un lenguaje de programación.
- MULTIMEDIA: Usan imágenes, sonidos, etc.
- SOFTWARE HOUSE: Es dónde hacen software, por ejemplo Microsoft o Macromedia.
- TECNOLOGÍA STREAMING: Es con la cual se pueden ver las imágenes mientras el proyector carga (baja) las imágenes sucesivamente en modo tal que no se dejan puntos muertos en la visualización de la página web.
HERRAMIENTAS
Barra de Herramientas
Para revisar las herramientas de la barra de Herramientas, dibuje un rectángulo con la herramienta Rectángulo 
Herramienta Flecha: sirve para seleccionar elementos. Macromedia Flash separa el borde del relleno de los elementos, por lo tanto si hago click sobre el relleno del rectángulo dibujado sólo se seleccionará el relleno. En cambio si se hace click sobre el borde del rectangulo tomaremos alguna de las aristas del rectángulo. En el caso de de figuras poligonales, para seleccionar todo el borde hay que hacer doble click sobre él.La Herramienta Flecha también sirve para deformar objetos compuestos de líneas. Si se lleva la herramienta flecha a un vértice de una figura aparecerá un ángulo y podremos mover el vértice de la figura. En cambio si llevamos la Herramienta Flecha sobre una línea, aparecerá una curva y podramos curvar la línea.
Herramienta Subselección: Permite seleccionar nodos de un polígono, ademá permite mover las directrices de las civas permitiendo hacerla concavas o convexas. Sir por lo tanto para ajustar la curvatura de las figuras. Si seleccionamos uno de los nodos de un figura podremos moverlos usando las teclas con forma de flecha del teclado y que se usan habitualmente para juegos.
Herramienta Línea: Sirve para dibujar líneas. Podemos con esta herramienta dibujar polígonos. Si en el menú Ver está activada la opcion Ajustar a objetos, cada vez que dibujemos una nueva línea los vertices se irán pegando.
Herramienta Lazo: Sirve para sellecionar porciones de las figuras.
Herramienta Pluma: Sirve para editar nodos...
Herramienta Texto: Sirve para crear textos. Simplemente se hace click sobre el escenario y se escribe. A medida que se escribe el texto se va extendiendo horizontalmente. Si se desea delimitar el ancho del texto, antes de escribir se dibuja con la herramienta de texto un rectángulo del ancho requerido. Si se selecciona algún texto con la herramienta Flecha se pueden cambiar sus propiedades a través del panel Propiedades.
Herramienta Ovalo: Sirve para dibujar elipses. Si se mantiene presionada la tecla shif el ancho y alto de la elipse se vuelven idénticos y podemos dibujar círculos. Herramienta Rectángulo: Sirve para dibujar rectángulos. Si se mantiene presionada la tecla shif se pueden dibujar cuadrados. Si se desea dibujar un rectángulo con esquinas redondeadas, se puede hacer doble click sobre la herramienta rectángulo y seleccionar el radio de la esquina. También se puede ajustar esto en las opciones de la herramienta rectángulo 
Herramienta Lápiz: Sirve para dibujar curvas. Sus opciones permiten enderezar, suavizar o dejar totalmente libre la ejecución de las curvas.
Herramienta Pincel: Sirve para pintar. Sus opciones permiten entre otras pintar dentro, detrá, fuera, etc. de las curvas cerradas.
Herrramienta Transformación Libre: Sirve para deformar y mover objetos, si se toma una de las exquinas de un objeto mientras se mantiene presionada la tecla SHIF, se mantiene la proporcionancho-alto del objeto. Si se presiona la combinación de teclas ALT + SHIFy se toma de una esquina el objeto se mantiene la proporción ancho-alto y el centro del objeto.
Herramienta Transformación de Relleno: Sirve para modificar los rellenos degradados ya sean radiales o líneales y también los rellenos de mapas de bits.
Herramienta Bote de Tinta: sirve para cambiar (o agregrar) los bordes de los objetos.
Herramienta Cubo de Pintura: Sirve para cambiar el relleno (o rellenar) de los objetos. Revisar las opciones de esta herramienta.
Herramienta Cuentagotas: Captura el color (y propiedades) del borde o del relleno dependiendo de si hacemos click en el borde o el relleno de un objeto. También captura las propiedades de texto. Si tenemos seleccionado un objeto y con el cuentagotas hacemos click sobre un segundo capturará aplicará el relleno, el borde o las propiedades de texto aplicándolas sobre el primero.
Herramienta Borrador: Permite borrar objetos constituidos por curvas. Revisar las opciones...
Herramienta Mano: Sirve para mover el escenario.
Herramienta Zoom: Sirve para cambiar la escala de visualización del escenario y los objetos. Al hacer click se aumenta el zoom y si se mantiene presionada la tecla ALT, al hacer click se disminuye el zoom. Se puede además dibujar un rectángulo con la herramienta Zoom sombre determinada zona del escenario, lo que provocará un zoom siobre una determinada zona.
Las herramientas o tools de Flash nos permitirán manipular y hacer cambios a nuestros objetos dentro del escenario.
Podemos encontrarlo en la barra de menú:
Ventana / Herramientas
Window / Tools
Con las teclas rápidas [Ctrl+F2] podemos visualizar u ocultar las herramientas.
Las Herramientas o Tools se dividen en cuatro partes:
1. Herramientas (Tools)
Con las herramientas podremos seleccionar objetos, dibujarlos, cambiar sus colores, borrarlos e insertar textos.
2. Vista (View)
Movemos el escenario con el cursor, o incrementamos la vista al escenario.
3. Colores (Colors)
Cambiamos los colores del relleno o borde de los gráficos.
4. Opciones (Options)
Cada Herramienta tiene opciones de modificaciones.
Descripción de las Herramientas o Tools con sus Teclas rápidas
Para acceder a cualquiera de las herramientas se puede presionar las teclas rápidas. Por ejemplo, para comenzar a dibujar una línea presionamos la tecla N. Para seleccionar la línea presionamos la tecla V y seleccionamos haciendo clic sobre él.
Herramienta Selección
Ubicamos en la caja de Herramientas (Tools) la herramienta Selección 
con el mouse o presionamos la letra (V).
con el mouse o presionamos la letra (V).
Podemos seleccionar un objeto de varias formas, la siguiente es una de ellas:
Nos ubicamos sobre uno de los extremos del objeto, tecleamos (V) y presionando el clic izquierdo del mouse (1) comenzamos a arrastrar (2) basta el extremo diametralmente opuesto (3) y soltamos el clic del mouse (4).
Para agrupar el gráfico:
• Seleccionamos el gráfico, luego presionamos las teclas Ctrl + G, entonces se agrupará la línea de borde del objeto y el relleno del mismo.
Para desagrupar el objeto:
• Seleccionamos el gráfico, luego presionamos las teclas Ctrl + Shift + G, de esta forma se desagruparán la línea de borde y el relleno del objeto.
Al dibujar cualquier gráfico como un rectángulo, éste tiene línea de borde y relleno. Y si queremos moverlo tenemos que agruparlo antes. De lo contrario, resultaría de esta forma:
Se separan la línea de borde con el relleno, haciendo tal vez lo que no deseábamos.
Y si movemos una vez mas después de seleccionar resulta otro gráfico que tal vez no queríamos que se produzca.
Seleccionando un gráfico con líneas conectadas o el borde de un objeto.
Presionamos la tecla (V) y luego doble clic sobre el borde del gráfico.
Seleccionando un gráfico, relleno y borde.
Presionamos la tecla (V) y luego doble clic sobre el relleno.
Nota: Si estamos trabajando con otra herramienta, y deseamos utilizar de forma temporal la herramienta de selección, entonces presionamos la tecla Ctrl.
Herramienta Lazo
Seleccionamos en la caja de Herramientas (Tools) la herramienta Lazo o Lasso Tool 
con el mouse o presionamos la letra (L).
con el mouse o presionamos la letra (L).
Podemos seleccionar un sector del objeto en forma de mano alzada y realizamos por ejemplo el cambio de color, podemos borrar ese sector, girarlo, desplazarlo, etc.
Trazar Líneas
Seleccionamos en la caja de Herramientas (Tools) la herramienta Línea
con el mouse o tecleamos la letra (N).
con el mouse o tecleamos la letra (N).
Aparecerán en el panel de propiedades (Properties) opciones para modificar la forma, el grosor y el color.
Automáticamente al seleccionar la Herramienta Línea, aparece el Inspector Propiedades:
Al dibujar la línea el Inspector de propiedades cambia a esta forma:
Nota: Presionando la tecla [Shift] y arrastrando el cursor del mouse podemos hacer líneas rectas o 45º:
Nota: Al presionar la tecla [Alt] y arrastrando el cursor del mouse, se alargará la línea simétricamente:
Podemos hacer gráficos de acuerdo a nuestros requerimientos. Por ejemplo si queremos hacer un triángulo de forma rápida:
1. Presionamos la tecla (N). Escogemos de la barra de herramientas
.
.
2. Manteniendo presionada la tecla [Shift] dibujamos la primera y segunda línea.
3. Dejamos de presionar la tecla [Shift], y cerramos el triángulo.
Para cambiar de forma a una línea tenemos dos formas:
Sin seleccionar la línea, pasamos el cursor junto a la línea, hasta que nos muestre lo siguiente:
Y podemos darle curva:
Sin seleccionar la línea alsamos el cursor por ésta y aparece:
Movemos el extremo de la línea.
Soltamos el botón del mouse.
Dibujar con la pluma
Seleccionamos en la caja de Herramientas (Tools) la Herramienta Pluma o
Pen Tool con el mouse o tecleamos la letra (P).
Pen Tool con el mouse o tecleamos la letra (P).
Nos permitirá dibujar punto por punto, haciendo click en el escenario, también podemos darle curva a nuestro dibujo. En la barra de propiedades podemos modificar las esquinas, el color de la línea que dibujemos con esta herramienta. La línea puede tener un grosor máximo de 200 puntos.
El color de la línea puede ser fijo o degradado. Al estar dibujando podemos cambiar las propiedades según nuestro parecer.
Podemos dibujar libremente. La diferencia de la Herramienta Pluma con la Herramienta Línea es que tendremos puntos de conducción, que nos permitirá hacer curvas más pronunciadas, además de añadir más puntos de anclaje o nodos.
Dibujando objetos gráficos o símbolo gráfico.
Al seleccionar el ícono que ven a la derecha, lo que se dibuje en el escenario se convierte automáticamente en objeto gráfico. (Ver abajo)
Dibujar círculos y óvalos
Seleccionamos en la caja de Herramientas (Tools) la herramienta Círculo o
Circle con el mouse o tecleamos la letra (O).
Circle con el mouse o tecleamos la letra (O).
Dibujamos la figura.
Al pasar el cursor cerca de la circunferencia se puede modificar la forma del círculo.
Aparecerá el Inspector de Propiedades (Properties) en el cual podemos modificar el grosor del círculo, la forma de la línea y el color.
Nota: Manteniendo presionada la tecla Shift podemos hacer círculos, además presionando la tecla Alt, podremos hacer óvalos alargando por un extremo. Manteniendo pulsadas las teclas Shift+Alt podremos hacerlos con el centro en donde esté situado el puntero en ese instante.
Creamos una circunferencia, pero utilizamos la opción Objeto Gráfico.
Y con esto ya no tendremos problemas de afectar a las demás figuras al desplazarlos.
Herramienta texto, filtros y efectos de texto
Seleccionamos en la caja de Herramientas (Tools) la Herramienta Texto
con el mouse o presionamos la letra (T).
con el mouse o presionamos la letra (T).
Aparecerá la Caja de Propiedades (Properties), en el cual podemos agregar características del texto que necesitamos.
Existen tres tipos de texto:
• Static Text (Texto estático):
Este tipo de dato es tradicional, se le asigna cualquier tipo de formato. Al ser seleccionado el texto estático se ve rodeado por un contorno azul.
• Dynamic Text (texto dinámico):
Este tipo de dato cambia conforme se le asignen nuevos valores a su variable. Al no ser seleccionado el texto dinámico se nota un contorno punteado.
• Input Text (Introducción de texto):
Se les conoce como cajas de texto, se introducen datos en él para que sean procesados después.
A los textos dinámicos e introducción de texto se les permite agregar nombres de instancia.
El panel Inspector de Propiedades de la Herramienta Texto.
Texto Estático o Static Text
Tipografía:
Cambiamos el Tipo de Fuente. Por jemplo:
Times New Roman.
Tamaño de Fuente:
Por ejemplo: 8 puntos
Color de Fuente:
Formato de Fuente:
B (Bold) Negrita e I (italic) Cursiva.
Cuando están desactivados es Formato Normal o Plain.
Teclas rápidas:
• [Ctrl + Shift + P] Plain, plano o normal.
• [Ctrl + Shift + B] Bold o negrita.
• [Ctrl + Shift + I] Italic o cursiva.
Alineación:
Hay cuatro opciones: Alineación a la izquierda por defecto,
centro, derecha y justificado.
Opciones de formato:
- Indent (sangría) – Line spacing (Espacio entre líneas).
Ejemplo:
Separación de caracteres:
Posición del carácter:
Posición del carácter: – Normal. – Superscript o superíndice. – Subscript o subíndice.
Método de Renderización de Fuente:
Sobre FlashType:
FlashType es un nuevo texto renderizado que proporciona texto claro, de calidad superior queda en la composición de Flash y en los archivos de SWF publicados. FlashType mejora la legibilidad de texto grandemente, particularmente cuando se da a los tamaños de la fuente más pequeños. El anti-aliasing personalizado le permite especificar el espesor y agudeza de fuentes usadas en los campos del texto individuales.
Usando FlashType pueden causar un retraso ligero cuando Flash carga los archivos de SWF. Usted notará este retraso sobre todo si está usando varios carácteres diferentes por ejemplo si pone (cuatro o cinco) dentro del primer fotograma de un documento de Flash. Hay que estar seguros del número de fuentes que usamos con este método. Las fuentes FlashType también pueden causar un aumento en el uso de memoria del Player de Flash. Por ejemplo, usando cuatro o cinco fuentes pueden aumentar el uso de memoria por aproximadamente 4 MB.
Use Device Fonts:
Usando las fuentes de dispositivo.
Bit Map (No Anti-alias):
El Texto de Bitmap o mapa de bits apaga el Anti-Alias y no proporciona ningún alisamiento al texto. El texto que usa los bordes afilados se despliega, y los SWF resultantes aumenta de tamaño porque los contornos de la fuente son incluidos en el SWF.
Anti-Alias:
Anti-aliasing es permitido para el Texto Estático, Texto Dinámico y Texto de Entrada, si el usuario tiene Flash Player 7 ó superior. Sólo se permite para el Texto estático si el usuario tiene una versión más actual de Flash Player.
Anti-alias para la Animación o Anti-Alias for Animation crea una animación de texto más lisa. Esto es en parte posible porque Flash ignora alineación e información del ajuste de espacio. Especificando Anti-alias para la Animación crea un archivo SWF más grande, porque los contornos de la fuente son incluidos.
Fuentes dadas usando Anti-alias para la Animación están menos legibles en los tamaños de la fuente más pequeños. por esta razón, se recomienda que usted use 10 punto o el tipo más grande al especificar Anti-alias para la Animación.
Anti-alias para la Legibilidad o Anti-Alias for Readability usa un nuevo artefacto del antialiasing que mejora la legibilidad de fuentes, particularmente a los tamaños pequeños. Especificando Anti-alias para la Legibilidad crea un archivo SWF más grande, porque los contornos de la fuente son incluidos. Para usar el Anti-alias para la Legibilidad se debe publicar para Flash Player 8.
Anti-alias para la Legibilidad crea fuentes muy legibles para los tamaños pequeños. Sin embargo, anima pobremente, y puede causar problemas de actuación. Si usted piensa animar el texto, use Anti-alias para la Animación.
Personalizado Anti-alias o Custom Anti-Aliasing (Sólo desde Flash Professional 8) nos permite modificar las propiedades de la fuente. Las propiedades del anti-alias personalizadas son como sigue:
• La Agudeza o Sharpness determina la suavidad de la transición entre las esquinas del texto y el fondo.
• El espesor o Thickness determina cuan grueso es la fuente anti-aliasing que aparece. Los valores más grandes de los caracteres hará parecer más gruesos.
Especificando Personalizado Anti-alias o Custum Anti-Alias crea un archivo SWF más grande, porque los contornos de la fuente son incluidos.
Tamaño del objeto y coordenadas del texto en el escenario.
• W: Ancho
• H: Altura
• X: Posición con respecto a x en el escenario.
• Y: Posición con respecto a y en el escenario.
Hipervínculo:
En esta casilla
escribimos un hipervínculo o URL. Es decir vincula el texto hacia una URL.
Además nos muestra opciones Destino o Target:
• _blank: Se muestra en una nueva página HTML.
• _parent: Se muestra la página principal HTML.
• _self: Se muestra en la misma página HTML.
• _root: Se muestra en la raíz de todo el HTML.
Seleccionable o Selectable:
Se puede seleccionar el texto estático en la película SWF o en
Internet Explorer.
Filtros y efectos de texto
Estando en la Herramienta Texto, seleccionamos Texto Estático. Y vemos que existen los Paneles: Inspector Propiedades, Filtros y Parámetros.
Estando seleccionado el texto “Macromedia”. En el Panel Filtros o Filters
hacemos clic sobre el icono , y nos aparece un menú contextual con varias opciones.
hacemos clic sobre el icono , y nos aparece un menú contextual con varias opciones.
Drop Shadow
Automáticamente nos muestra propiedades del filtro que podemos cambiar.
• Blur X, Y: Desvanecimiento de la sombra.
• Strength: Porcentaje de la sombra.
• Quality: Baja, Media y Alta.
• Color: Color de la sombra.
• Angle: Ángulo de la proyección de la sombra.
• Distance: Distancia de la sombra.
• Knockout: Nos muestra el texto en blanco con la sombra.
• Inner shadow: Sombra interior.
• Hide Object: Escondemos el objeto texto, sólo muestra la sombra.
Para dejar de ver el filtro por un momento podemos hacer clic sobre el símbolo de visto bueno. Aparecerá al lado del filtro el signo de X.
Para agregar un filtro:
Para eliminar un filtro:
Blur
Al hacer clic sobre la casilla de Knockout, aparece el texto en blanco.
Al hacer clic sobre la casilla de Inner glow, aparece el borde en el interior del texto.
Al hacer clic sobre la casilla de Knockout e inner glow, aparece el texto en blanco pero la sombra es interior.
Bevel
Este efecto es muy bueno. Con las anteriores versiones de Flash teníamos que hacer este efecto con otros programas como (PhotoShop, Corel, etc.).
• Type: El efecto se verá en Inner o interior, Outer o exterior y Full o completo.
• Shadow: Color de sombra
• Highlight: Color de brillo.
Gradient Glow
Gradient Bevel
Adjust Color
O Ajuste de Color:
• Brightness: Brillo
• Contrast: Contraste
• Saturation: Saturación
• Hue: Color
• Reset: Reinicia
Texto Dinámico o Dynamic Text
Un texto dinámico cambia conforme se le asignen nuevos valores a su variable. Al ser seleccionado el texto dinámico se nota un cotorno punteado.
Marco:
Al seleccionar el ícono Marco se forma un marco alrededor del texto.
Var:
Ingresamos una variable a un texto dinámico cuando realizamos un Script o programa para identificarlo y cambiar su valor.
Nombre de Instancia:
Al crear un campo de texto, puede asignarle un nombre de instancia en el inspector de propiedades. Puede utilizar el nombre de instancia en sentencias de ActionScript para establecer, modificar y dar formato al campo de texto y a su contenido mediante los objetos TextField y TextFormat.
Line Type o tipo de línea:
Puede ser Línea simple, Multilínea y Multilínea sin ajuste. Seleccione Multilínea para ver el texto en varias líneas, Línea única para verlo en una sola línea, o Multilínea sin ajuste para que el texto se distribuya en varias líneas sólo si el último carácter es un carácter de cambio de reglón como Enter (Windows).
Haga clic en el botón Generar texto como HTML para conservar el formato de texto enriquecido, como fuentes e hipervínculos, con las etiquetas HTML adecuadas.
Botón Embed, opciones de carácter:
Podemos seleccionar un grupo de caracteres que deseamos restringir en nuestra película.
También podemos incluir un grupo de caracteres que sólo utilizará nuestro texto dinámico en la película, es decir, podemos ver en el escenario otros caracteres pero no en el SWF, excepto los caracteres que hemos restringido.
Ejemplo: Escribimos en Include these characters, el siguiente texto “Números reales”; y en el escenario la frase “Texto dinámico con la opción Restringir”.
El resultado al presionar las teclas rápidas [Ctrl + Enter] que nos lleva a la película SWF sería:
Nota: Los filtros de Texto estático son iguales al del Texto dinámico. Revisar las páginas anteriores para ver la similitud.
Texto de entrada o Input Text (Introducción de texto)
Son cajas de textos, donde se introducen datos en él para que sean procesados después. A los Textos Dinámicos e Introducción de Texto se les permite agregar nombres de instancia.
En el Inspector de Propiedades aumenta una casilla Maximum characters o Máximo de caracteres a ingresar. Y no se encuentra la casilla Vínculo URL.
Veremos más adelante como se utiliza cada unp de estos tipos de textos.
Nota: Los filtros de Texto estático, Texto Dinámico son iguales al de la Introducción de Texto. Revisar las páginas anteriores para ver la similitud.
Dibujar cuadros rectángulos y polígonos. Crear símbolos.
Seleccionamos en la caja de Herramientas (Tools) la herramienta Rectángulo
o polígono con el mouse o tecleamos la letra (R).
o polígono con el mouse o tecleamos la letra (R).
Aparecerá el Inspector de Propiedades (Properties) en el cual podemos modificar el grosor del cuadrado, rectángulo o polígono, la forma de la línea y los colores.
Cap:
Usamos para definir las esquinas del gráfico.
Join:
La unión de los extremos del gráfico.
Al seleccionarlo podremos darle un radio (en puntos) a las esquinas del rectángulo
Ejemplo:
Con el botón Opciones (Options) se puede agregar el número de lados que necesitamos para nuestro polígono.
Ejemplo:
Convertir vectores a símbolos
Al convertir un gráfico a Botón o Clip de Película, podemos realizar maravillas.
1. Dibujamos una estrella.
2. Presionamos [F8] para convertir el gráfico a Botón.
3. Nos dirigimos hacia el panel Filters o Filtros.
4. Añadimos el efecto Bevel o ángulo oblículo.
5. Añadimos una luz degradada o Gradient Glow
El resultado:
El futuro
Flash ha tenido una historia ilustre, comenzando como un paquete de vectores simples y terminar como una plataforma compleja, muy capaz y versátil. Para algunos, su transición de la animación pura a RIA y juegos ha sido abrumadora, pero las posibilidades de Flash permite un sinnúmero de artistas, animadores, programadores y diseñadores para explorar han más que compensado por la complejidad en el camino. El futuro de Flash como una herramienta de animación se ve incierto, como SVG, JavaScript y CSS 3 pulgadas cada vez más a sustituir la necesidad de un paquete de vectores de animación especial.Sin embargo, es una de las mejores opciones hoy para el desarrollo de RIA y el juego y espera que sigan siéndolo en los próximos años
aquí les dejamos unos tutoriales para su ayuda
macro-media flash by MAURICIO is licensed under a Creative Commons Reconocimiento-NoComercial-SinObraDerivada 4.0 Internacional License.
No hay comentarios:
Publicar un comentario