SlideShare uma empresa Scribd logo
1 de 13
Diseño multimedia 
Flash 
g.frances
Diseño multimedia 
Flash 
¿Qué flash? 
Macromedia Flash MX es una herramienta poderosa que 
permite crear contenido multimedia para la Internet. Su 
capacidad de trabajo y distintas herramientas para la 
manipulación de objetos la han convertido, en poco tiempo, en 
la aplicación favorita de los diseñadotes web. 
Más de 497 millones de usuarios del Internet tienen instalado 
en su navegador alguna versión de Flash Player.
Diseño multimedia 
Flash 
Flash es la tecnología más comúnmente utilizada en el Web que permite 
la creación de animaciones vectoriales. El interés en el uso de gráficos 
vectoriales es que éstos permiten llevar a cabo animaciones de poco 
peso, es decir, que tardan poco tiempo en ser cargadas por el navegador. 
Existen dos tipos de gráficos: 
•Los gráficos vectoriales, en los cuales una imagen es representada a 
partir de líneas (o vectores) que poseen determinadas propiedades (color, 
grosor...). La calidad de este tipo de gráficos no depende del zoom o del 
tipo de resolución con el cual se esté mirando el gráfico. Por mucho que 
nos acerquemos, el gráfico no se pixeliza, ya que el ordenador traza 
automáticamente las líneas para ese nivel de acercamiento. 
•Las imágenes en mapa de bits. Este tipo de gráficos se asemejan a 
una especie de cuadrícula en la cual cada uno de los cuadrados (píxeles) 
muestra un color determinado. La información de estos gráficos es 
guardada individualmente para cada píxel y es definida por las 
coordenadas y color de dicho píxel. Este tipo de gráficos son 
dependientes de la variación del tamaño y resolución, pudiendo perder 
calidad al modificar sucesivamente sus dimensiones.
Diseño multimedia 
Flash 
Así, Flash se sirve de las posibilidades que ofrece el trabajar con gráficos 
vectoriales, fácilmente redimensionables y alterables por medio de funciones, 
así que de un almacenamiento inteligente de las imágenes y sonidos 
empleados en sus animaciones por medio de bibliotecas, para optimizar el 
tamaño de los archivos que contienen las animaciones. 
Esta optimización del espacio que ocupan las animaciones, combinada con 
la posibilidad de cargar la animación al mismo tiempo que ésta se muestra en 
el navegador (técnica denominada streaming), permite aportar elementos 
visuales que dan vida a una Web sin que para ello el tiempo de carga de la 
página se prolongue hasta límites insoportables por el visitante. 
Además de este aspecto meramente estético, Flash introduce en su entorno 
la posibilidad de interaccionar con el usuario. Para ello, Flash invoca un 
lenguaje de programación llamado Action Script. Orientado a objetos, este 
lenguaje tiene claras influencias del Javascript y permite, entre otras muchas 
cosas, gestionar el relleno de formularios, ejecutar distintas partes de una 
animación en función de eventos producidos por el usuario, saltar a otras 
páginas, etc. 
De este modo, Macromedia pone a nuestra disposición una tecnología 
pensada para aportar vistosidad a nuestra Web al mismo tiempo que nos 
permite interaccionar con nuestro visitante. Por supuesto, no se trata de la 
única alternativa de diseño vectorial aplicada al Web pero, sin duda, se trata 
de la más popular y más completa de ellas.
g.frances 
Diseño multimedia 
Flash 
¿Qué permite flash mx? 
Sus características permiten: 
• desarrollar aplicaciones con gran dinamismo en las 
interfaces de usuario 
• usar potentes videos multimedia 
• crear fantásticas animaciones con poco peso de descarga 
• hacer publicidad en línea 
• diseñar cursos de aprendizaje electrónico 
• crear ilustraciones animadas para ser utilizadas en otras 
aplicaciones o proyectos multimedia (Dreamweaver, 
Director) 
• construir aplicaciones para dispositivos móviles
g.frances 
Diseño multimedia 
Flash 
Consejos... 
• Trate de trabajar con la mayor cantidad de gráficos 
vectoriales posibles, otro tipo de imágenes (BMP, GIF, JPEG) 
no ofrecen la calidad y facilidad de manipulación 
• Si le es posible evite crear el proyector del archivo FLA (a 
SWF) en una versión inferior a la que dispone 
• Si su trabajo es muy pesado trate de picarlo en varios 
archivos 
• Evalué bien el proyecto antes de tomar la decisión de utilizar 
flash para el desarrollo, flash no es bueno para todo.
Diseño multimedia 
Flash 
Describimos la interface de la aplicación Flash MX
Diseño multimedia 
Flash 
Dentro de esta interface, podemos distinguir tres partes principales: 
• El escenario Se trata del espacio en el cual llevaremos a cabo todas 
las tareas de edición de gráficos. En cierto modo es como el papel en 
el cual dibujaremos lo que haga falta. 
• La línea de tiempo Esta sección es donde podremos organizar en el 
tiempo cada una de las imágenes diseñadas en el escenario. 
Podemos subdividirla en dos partes: La parte izquierda, donde 
podremos organizar las capas y la parte de la derecha que queda 
reservada a la gestión de los fotogramás. Ambos elementos, capas y 
fotogramás serán tratados más adelante. 
• La caja de herramientas Aquí encontraremos las herramientas de 
edición grafica que Flash pone a nuestra disposición. Como puede 
observarse, éstas son muy parecidas a las que podemos encontrar en 
otros programás de edición grafica que ya sea vectorial o no.
Diseño multimedia 
Flash 
Como hemos dicho, la línea de tiempo es donde podremos organizar la 
sucesión de imágenes que dan lugar a una animación. En este capítulo 
introduciremos los conceptos de capa y fotograma, vitales para una 
compresión del funcionamiento de Flash. 
En cierta medida, Flash trabaja como si fuese una película. Una animación 
es una sucesión de imágenes fijas que, al pasar rápidamente unas detrás 
de otras, dan la impresión de un movimiento. Cada una de estas imágenes 
fijas es llamada también fotograma. Los fotogramas son representados 
bajo forma de rectángulos en la parte derecha del escenario. 
En estos rectángulos podemos alojar tres tipos diferentes de imágenes: 
•Imágenes clave Se trata de las imágenes que nosotros mismos dibujaremos 
•Imágenes fijas Son las imágenes claves copiadas en los fotogramas siguientes al 
de la primera imagen clave de manera a producir un efecto de objeto estático. 
•Imágenes de interpolación Se trata de imágenes calculadas por Flash que 
permiten la transición gradual entre dos imágenes claves. Este tipo de imágenes 
muy útiles ya que se generan automáticamente y proporcionan un efecto suave de 
movimiento o transformación.
Diseño multimedia 
Flash 
Por otra parte, una animación esta generalmente constituida de una variedad 
de objetos diferentes, cada uno de los cuales se introduce en un momento 
diferente y presenta un comportamiento independiente al resto de los objetos. 
De manera a organizar y editar todos estos elementos Flash permite el uso de 
capas o calcos. 
Así, una animación Flash esta compuesta de una superposición de capas en 
cada una de las cuales introduciremos un objeto que tendrá su propia línea de 
fotogramas. Estas capas nos permiten trabajar la animación en distintos planos 
independientes. 
Por defecto, al comenzar una nueva escena encontraremos en nuestra línea 
de tiempo una sola capa. Progresivamente iremos introduciendo más capas 
que nos permitan separar cada uno de los elementos de la animación: objetos, 
fondo, sonidos o trayectorias. 
Un uso inteligente de las capas es la base para crear animaciones de calidad
g.frances 
Algunos ejemplos 
Diseño multimedia 
Flash 
de integración de aplicaciones > 
creación de animaciones > 
diseño de interfaz > 
aplicaciones interactivas >

Mais conteúdo relacionado

Mais procurados

ComparacióN De Flash Vs Swish
ComparacióN De Flash Vs SwishComparacióN De Flash Vs Swish
ComparacióN De Flash Vs Swish
185nayeli
 
Introducción a flash professional cs5 karen
Introducción a flash professional cs5 karenIntroducción a flash professional cs5 karen
Introducción a flash professional cs5 karen
krencitah
 
Introduccion a flash cs5
Introduccion a flash cs5Introduccion a flash cs5
Introduccion a flash cs5
maangeliica
 
Introduccion a Flash
Introduccion a FlashIntroduccion a Flash
Introduccion a Flash
marocad
 
cuestionario-de-grafico
cuestionario-de-graficocuestionario-de-grafico
cuestionario-de-grafico
Cesar Diaz
 
Programas para crear animacion vectorial
Programas para crear animacion vectorialProgramas para crear animacion vectorial
Programas para crear animacion vectorial
IEJGCC
 
Crossmedia 06: animaciones en flash
Crossmedia 06: animaciones en flashCrossmedia 06: animaciones en flash
Crossmedia 06: animaciones en flash
Jorge Cantú López
 

Mais procurados (20)

Flash professional cs5
Flash professional cs5Flash professional cs5
Flash professional cs5
 
Características de adobe flash
Características de adobe flashCaracterísticas de adobe flash
Características de adobe flash
 
ComparacióN De Flash Vs Swish
ComparacióN De Flash Vs SwishComparacióN De Flash Vs Swish
ComparacióN De Flash Vs Swish
 
Qué es flash
Qué es flashQué es flash
Qué es flash
 
Jeison bello trabajo n° 1
Jeison bello trabajo  n° 1Jeison bello trabajo  n° 1
Jeison bello trabajo n° 1
 
Introducción a flash professional cs5 karen
Introducción a flash professional cs5 karenIntroducción a flash professional cs5 karen
Introducción a flash professional cs5 karen
 
Historia de flash
Historia  de  flashHistoria  de  flash
Historia de flash
 
Introduccion a flash cs5
Introduccion a flash cs5Introduccion a flash cs5
Introduccion a flash cs5
 
Colegio venecia i
Colegio venecia iColegio venecia i
Colegio venecia i
 
Flash cs5
Flash cs5Flash cs5
Flash cs5
 
Introduccion a Flash
Introduccion a FlashIntroduccion a Flash
Introduccion a Flash
 
Exposicion equipo 6 adobe flash cs ecec
Exposicion equipo 6 adobe flash cs ececExposicion equipo 6 adobe flash cs ecec
Exposicion equipo 6 adobe flash cs ecec
 
Adobe flash
Adobe flash Adobe flash
Adobe flash
 
Adobe flash garcia
Adobe flash garciaAdobe flash garcia
Adobe flash garcia
 
cuestionario-de-grafico
cuestionario-de-graficocuestionario-de-grafico
cuestionario-de-grafico
 
Programas para crear animacion vectorial
Programas para crear animacion vectorialProgramas para crear animacion vectorial
Programas para crear animacion vectorial
 
Flash professional cs5
Flash professional cs5Flash professional cs5
Flash professional cs5
 
Crossmedia 06: animaciones en flash
Crossmedia 06: animaciones en flashCrossmedia 06: animaciones en flash
Crossmedia 06: animaciones en flash
 
Retículas Para Pantalla
Retículas Para PantallaRetículas Para Pantalla
Retículas Para Pantalla
 
Composicion de paginas web
Composicion de paginas webComposicion de paginas web
Composicion de paginas web
 

Semelhante a Flash (20)

Flash
FlashFlash
Flash
 
Flash interfaz
Flash  interfazFlash  interfaz
Flash interfaz
 
Flash
FlashFlash
Flash
 
Flash8 tutorial
Flash8 tutorialFlash8 tutorial
Flash8 tutorial
 
MaríaPérez_A2
MaríaPérez_A2MaríaPérez_A2
MaríaPérez_A2
 
Flash tercer periodo
Flash tercer periodoFlash tercer periodo
Flash tercer periodo
 
Trabajo resumen flash anyi amaya
Trabajo resumen flash anyi amayaTrabajo resumen flash anyi amaya
Trabajo resumen flash anyi amaya
 
Flash
FlashFlash
Flash
 
Ana maria morales 11 01 flash
Ana maria morales 11 01 flashAna maria morales 11 01 flash
Ana maria morales 11 01 flash
 
Ana maria morales 11 01 flash i.E.D VENECIA
Ana maria morales 11 01 flash i.E.D VENECIAAna maria morales 11 01 flash i.E.D VENECIA
Ana maria morales 11 01 flash i.E.D VENECIA
 
Manual Básico de flash 8
Manual Básico de flash 8Manual Básico de flash 8
Manual Básico de flash 8
 
Adobe flash
Adobe flashAdobe flash
Adobe flash
 
Xavier patricio
Xavier patricioXavier patricio
Xavier patricio
 
Introduccion a flash mx
Introduccion a flash mxIntroduccion a flash mx
Introduccion a flash mx
 
Flashcs5 130226092943-phpapp01
Flashcs5 130226092943-phpapp01Flashcs5 130226092943-phpapp01
Flashcs5 130226092943-phpapp01
 
T. multimedia giovanny lombana
T. multimedia giovanny lombanaT. multimedia giovanny lombana
T. multimedia giovanny lombana
 
Flash Macromedia
Flash MacromediaFlash Macromedia
Flash Macromedia
 
El Formato Flash
El Formato  FlashEl Formato  Flash
El Formato Flash
 
Flash Mx Clase 1
Flash Mx Clase 1Flash Mx Clase 1
Flash Mx Clase 1
 
FlASH Macro
FlASH MacroFlASH Macro
FlASH Macro
 

Mais de Claudia Poza

Seres vivospincence astoreca-ruffini
Seres vivospincence astoreca-ruffiniSeres vivospincence astoreca-ruffini
Seres vivospincence astoreca-ruffini
Claudia Poza
 
Relaciones entre los seres vivos zuazo fiorotto-alejo
Relaciones entre los seres vivos  zuazo fiorotto-alejoRelaciones entre los seres vivos  zuazo fiorotto-alejo
Relaciones entre los seres vivos zuazo fiorotto-alejo
Claudia Poza
 
Relacion de los seres vivos m artin capasso berro paternosto
Relacion de los seres vivos  m artin capasso berro paternostoRelacion de los seres vivos  m artin capasso berro paternosto
Relacion de los seres vivos m artin capasso berro paternosto
Claudia Poza
 
Mati crispo y amaro baldino
Mati crispo y amaro baldinoMati crispo y amaro baldino
Mati crispo y amaro baldino
Claudia Poza
 
Los seres vivos y sus relaciones terminado charo fortuna
Los seres vivos y sus relaciones terminado charo fortunaLos seres vivos y sus relaciones terminado charo fortuna
Los seres vivos y sus relaciones terminado charo fortuna
Claudia Poza
 
Los seres vivos pancho y mili
Los seres vivos   pancho y miliLos seres vivos   pancho y mili
Los seres vivos pancho y mili
Claudia Poza
 

Mais de Claudia Poza (20)

Tutorialpseint parte 2
Tutorialpseint parte 2Tutorialpseint parte 2
Tutorialpseint parte 2
 
Ejerciciospseintparte3
Ejerciciospseintparte3Ejerciciospseintparte3
Ejerciciospseintparte3
 
Lenguaje natural pseudocodigo diagramacion y programacion
Lenguaje natural pseudocodigo diagramacion y programacionLenguaje natural pseudocodigo diagramacion y programacion
Lenguaje natural pseudocodigo diagramacion y programacion
 
Lenguaje natural pseudocodigo diagramacion y programacion
Lenguaje natural pseudocodigo diagramacion y programacionLenguaje natural pseudocodigo diagramacion y programacion
Lenguaje natural pseudocodigo diagramacion y programacion
 
Sistema informatico
Sistema informaticoSistema informatico
Sistema informatico
 
Power point jimenez
Power point jimenezPower point jimenez
Power point jimenez
 
Power point jimenez
Power point jimenezPower point jimenez
Power point jimenez
 
Power point jimenez
Power point jimenezPower point jimenez
Power point jimenez
 
Sistema informático 2
Sistema informático 2Sistema informático 2
Sistema informático 2
 
Power
PowerPower
Power
 
El sistema informático
El sistema informáticoEl sistema informático
El sistema informático
 
Las relaciones de los seres vivos Gonzalez y Fiorotto
Las relaciones de los seres vivos  Gonzalez y FiorottoLas relaciones de los seres vivos  Gonzalez y Fiorotto
Las relaciones de los seres vivos Gonzalez y Fiorotto
 
2536656 635712171518400000
2536656 6357121715184000002536656 635712171518400000
2536656 635712171518400000
 
Seres vivospincence astoreca-ruffini
Seres vivospincence astoreca-ruffiniSeres vivospincence astoreca-ruffini
Seres vivospincence astoreca-ruffini
 
Relaciones entre los seres vivos zuazo fiorotto-alejo
Relaciones entre los seres vivos  zuazo fiorotto-alejoRelaciones entre los seres vivos  zuazo fiorotto-alejo
Relaciones entre los seres vivos zuazo fiorotto-alejo
 
Relacion de los seres vivos m artin capasso berro paternosto
Relacion de los seres vivos  m artin capasso berro paternostoRelacion de los seres vivos  m artin capasso berro paternosto
Relacion de los seres vivos m artin capasso berro paternosto
 
Mati crispo y amaro baldino
Mati crispo y amaro baldinoMati crispo y amaro baldino
Mati crispo y amaro baldino
 
Los seres vivos y sus relaciones terminado charo fortuna
Los seres vivos y sus relaciones terminado charo fortunaLos seres vivos y sus relaciones terminado charo fortuna
Los seres vivos y sus relaciones terminado charo fortuna
 
Los seres vivos pancho y mili
Los seres vivos   pancho y miliLos seres vivos   pancho y mili
Los seres vivos pancho y mili
 
Ledesma sandoval
Ledesma sandovalLedesma sandoval
Ledesma sandoval
 

Último

6°_GRADO_-_MAYO_06 para sexto grado de primaria
6°_GRADO_-_MAYO_06 para sexto grado de primaria6°_GRADO_-_MAYO_06 para sexto grado de primaria
6°_GRADO_-_MAYO_06 para sexto grado de primaria
Wilian24
 
TEMA 14.DERIVACIONES ECONÓMICAS, SOCIALES Y POLÍTICAS DEL PROCESO DE INTEGRAC...
TEMA 14.DERIVACIONES ECONÓMICAS, SOCIALES Y POLÍTICAS DEL PROCESO DE INTEGRAC...TEMA 14.DERIVACIONES ECONÓMICAS, SOCIALES Y POLÍTICAS DEL PROCESO DE INTEGRAC...
TEMA 14.DERIVACIONES ECONÓMICAS, SOCIALES Y POLÍTICAS DEL PROCESO DE INTEGRAC...
jlorentemartos
 

Último (20)

Supuestos_prácticos_funciones.docx
Supuestos_prácticos_funciones.docxSupuestos_prácticos_funciones.docx
Supuestos_prácticos_funciones.docx
 
ACRÓNIMO DE PARÍS PARA SU OLIMPIADA 2024. Por JAVIER SOLIS NOYOLA
ACRÓNIMO DE PARÍS PARA SU OLIMPIADA 2024. Por JAVIER SOLIS NOYOLAACRÓNIMO DE PARÍS PARA SU OLIMPIADA 2024. Por JAVIER SOLIS NOYOLA
ACRÓNIMO DE PARÍS PARA SU OLIMPIADA 2024. Por JAVIER SOLIS NOYOLA
 
CONCURSO NACIONAL JOSE MARIA ARGUEDAS.pptx
CONCURSO NACIONAL JOSE MARIA ARGUEDAS.pptxCONCURSO NACIONAL JOSE MARIA ARGUEDAS.pptx
CONCURSO NACIONAL JOSE MARIA ARGUEDAS.pptx
 
Interpretación de cortes geológicos 2024
Interpretación de cortes geológicos 2024Interpretación de cortes geológicos 2024
Interpretación de cortes geológicos 2024
 
Prueba libre de Geografía para obtención título Bachillerato - 2024
Prueba libre de Geografía para obtención título Bachillerato - 2024Prueba libre de Geografía para obtención título Bachillerato - 2024
Prueba libre de Geografía para obtención título Bachillerato - 2024
 
prostitución en España: una mirada integral!
prostitución en España: una mirada integral!prostitución en España: una mirada integral!
prostitución en España: una mirada integral!
 
La Sostenibilidad Corporativa. Administración Ambiental
La Sostenibilidad Corporativa. Administración AmbientalLa Sostenibilidad Corporativa. Administración Ambiental
La Sostenibilidad Corporativa. Administración Ambiental
 
Tema 17. Biología de los microorganismos 2024
Tema 17. Biología de los microorganismos 2024Tema 17. Biología de los microorganismos 2024
Tema 17. Biología de los microorganismos 2024
 
Louis Jean François Lagrenée. Erotismo y sensualidad. El erotismo en la Hist...
Louis Jean François Lagrenée.  Erotismo y sensualidad. El erotismo en la Hist...Louis Jean François Lagrenée.  Erotismo y sensualidad. El erotismo en la Hist...
Louis Jean François Lagrenée. Erotismo y sensualidad. El erotismo en la Hist...
 
TIENDAS MASS MINIMARKET ESTUDIO DE MERCADO
TIENDAS MASS MINIMARKET ESTUDIO DE MERCADOTIENDAS MASS MINIMARKET ESTUDIO DE MERCADO
TIENDAS MASS MINIMARKET ESTUDIO DE MERCADO
 
1ro Programación Anual D.P.C.C planificación anual del área para el desarroll...
1ro Programación Anual D.P.C.C planificación anual del área para el desarroll...1ro Programación Anual D.P.C.C planificación anual del área para el desarroll...
1ro Programación Anual D.P.C.C planificación anual del área para el desarroll...
 
Tema 10. Dinámica y funciones de la Atmosfera 2024
Tema 10. Dinámica y funciones de la Atmosfera 2024Tema 10. Dinámica y funciones de la Atmosfera 2024
Tema 10. Dinámica y funciones de la Atmosfera 2024
 
Linea del tiempo - Filosofos Cristianos.docx
Linea del tiempo - Filosofos Cristianos.docxLinea del tiempo - Filosofos Cristianos.docx
Linea del tiempo - Filosofos Cristianos.docx
 
LA LITERATURA DEL BARROCO 2023-2024pptx.pptx
LA LITERATURA DEL BARROCO 2023-2024pptx.pptxLA LITERATURA DEL BARROCO 2023-2024pptx.pptx
LA LITERATURA DEL BARROCO 2023-2024pptx.pptx
 
6°_GRADO_-_MAYO_06 para sexto grado de primaria
6°_GRADO_-_MAYO_06 para sexto grado de primaria6°_GRADO_-_MAYO_06 para sexto grado de primaria
6°_GRADO_-_MAYO_06 para sexto grado de primaria
 
Sesión de clase APC: Los dos testigos.pdf
Sesión de clase APC: Los dos testigos.pdfSesión de clase APC: Los dos testigos.pdf
Sesión de clase APC: Los dos testigos.pdf
 
Plan-de-la-Patria-2019-2025- TERCER PLAN SOCIALISTA DE LA NACIÓN.pdf
Plan-de-la-Patria-2019-2025- TERCER PLAN SOCIALISTA DE LA NACIÓN.pdfPlan-de-la-Patria-2019-2025- TERCER PLAN SOCIALISTA DE LA NACIÓN.pdf
Plan-de-la-Patria-2019-2025- TERCER PLAN SOCIALISTA DE LA NACIÓN.pdf
 
TEMA 14.DERIVACIONES ECONÓMICAS, SOCIALES Y POLÍTICAS DEL PROCESO DE INTEGRAC...
TEMA 14.DERIVACIONES ECONÓMICAS, SOCIALES Y POLÍTICAS DEL PROCESO DE INTEGRAC...TEMA 14.DERIVACIONES ECONÓMICAS, SOCIALES Y POLÍTICAS DEL PROCESO DE INTEGRAC...
TEMA 14.DERIVACIONES ECONÓMICAS, SOCIALES Y POLÍTICAS DEL PROCESO DE INTEGRAC...
 
Procedimientos para la planificación en los Centros Educativos tipo V ( multi...
Procedimientos para la planificación en los Centros Educativos tipo V ( multi...Procedimientos para la planificación en los Centros Educativos tipo V ( multi...
Procedimientos para la planificación en los Centros Educativos tipo V ( multi...
 
PLAN DE REFUERZO ESCOLAR MERC 2024-2.docx
PLAN DE REFUERZO ESCOLAR MERC 2024-2.docxPLAN DE REFUERZO ESCOLAR MERC 2024-2.docx
PLAN DE REFUERZO ESCOLAR MERC 2024-2.docx
 

Flash

  • 2. Diseño multimedia Flash ¿Qué flash? Macromedia Flash MX es una herramienta poderosa que permite crear contenido multimedia para la Internet. Su capacidad de trabajo y distintas herramientas para la manipulación de objetos la han convertido, en poco tiempo, en la aplicación favorita de los diseñadotes web. Más de 497 millones de usuarios del Internet tienen instalado en su navegador alguna versión de Flash Player.
  • 3. Diseño multimedia Flash Flash es la tecnología más comúnmente utilizada en el Web que permite la creación de animaciones vectoriales. El interés en el uso de gráficos vectoriales es que éstos permiten llevar a cabo animaciones de poco peso, es decir, que tardan poco tiempo en ser cargadas por el navegador. Existen dos tipos de gráficos: •Los gráficos vectoriales, en los cuales una imagen es representada a partir de líneas (o vectores) que poseen determinadas propiedades (color, grosor...). La calidad de este tipo de gráficos no depende del zoom o del tipo de resolución con el cual se esté mirando el gráfico. Por mucho que nos acerquemos, el gráfico no se pixeliza, ya que el ordenador traza automáticamente las líneas para ese nivel de acercamiento. •Las imágenes en mapa de bits. Este tipo de gráficos se asemejan a una especie de cuadrícula en la cual cada uno de los cuadrados (píxeles) muestra un color determinado. La información de estos gráficos es guardada individualmente para cada píxel y es definida por las coordenadas y color de dicho píxel. Este tipo de gráficos son dependientes de la variación del tamaño y resolución, pudiendo perder calidad al modificar sucesivamente sus dimensiones.
  • 4. Diseño multimedia Flash Así, Flash se sirve de las posibilidades que ofrece el trabajar con gráficos vectoriales, fácilmente redimensionables y alterables por medio de funciones, así que de un almacenamiento inteligente de las imágenes y sonidos empleados en sus animaciones por medio de bibliotecas, para optimizar el tamaño de los archivos que contienen las animaciones. Esta optimización del espacio que ocupan las animaciones, combinada con la posibilidad de cargar la animación al mismo tiempo que ésta se muestra en el navegador (técnica denominada streaming), permite aportar elementos visuales que dan vida a una Web sin que para ello el tiempo de carga de la página se prolongue hasta límites insoportables por el visitante. Además de este aspecto meramente estético, Flash introduce en su entorno la posibilidad de interaccionar con el usuario. Para ello, Flash invoca un lenguaje de programación llamado Action Script. Orientado a objetos, este lenguaje tiene claras influencias del Javascript y permite, entre otras muchas cosas, gestionar el relleno de formularios, ejecutar distintas partes de una animación en función de eventos producidos por el usuario, saltar a otras páginas, etc. De este modo, Macromedia pone a nuestra disposición una tecnología pensada para aportar vistosidad a nuestra Web al mismo tiempo que nos permite interaccionar con nuestro visitante. Por supuesto, no se trata de la única alternativa de diseño vectorial aplicada al Web pero, sin duda, se trata de la más popular y más completa de ellas.
  • 5. g.frances Diseño multimedia Flash ¿Qué permite flash mx? Sus características permiten: • desarrollar aplicaciones con gran dinamismo en las interfaces de usuario • usar potentes videos multimedia • crear fantásticas animaciones con poco peso de descarga • hacer publicidad en línea • diseñar cursos de aprendizaje electrónico • crear ilustraciones animadas para ser utilizadas en otras aplicaciones o proyectos multimedia (Dreamweaver, Director) • construir aplicaciones para dispositivos móviles
  • 6. g.frances Diseño multimedia Flash Consejos... • Trate de trabajar con la mayor cantidad de gráficos vectoriales posibles, otro tipo de imágenes (BMP, GIF, JPEG) no ofrecen la calidad y facilidad de manipulación • Si le es posible evite crear el proyector del archivo FLA (a SWF) en una versión inferior a la que dispone • Si su trabajo es muy pesado trate de picarlo en varios archivos • Evalué bien el proyecto antes de tomar la decisión de utilizar flash para el desarrollo, flash no es bueno para todo.
  • 7.
  • 8.
  • 9. Diseño multimedia Flash Describimos la interface de la aplicación Flash MX
  • 10. Diseño multimedia Flash Dentro de esta interface, podemos distinguir tres partes principales: • El escenario Se trata del espacio en el cual llevaremos a cabo todas las tareas de edición de gráficos. En cierto modo es como el papel en el cual dibujaremos lo que haga falta. • La línea de tiempo Esta sección es donde podremos organizar en el tiempo cada una de las imágenes diseñadas en el escenario. Podemos subdividirla en dos partes: La parte izquierda, donde podremos organizar las capas y la parte de la derecha que queda reservada a la gestión de los fotogramás. Ambos elementos, capas y fotogramás serán tratados más adelante. • La caja de herramientas Aquí encontraremos las herramientas de edición grafica que Flash pone a nuestra disposición. Como puede observarse, éstas son muy parecidas a las que podemos encontrar en otros programás de edición grafica que ya sea vectorial o no.
  • 11. Diseño multimedia Flash Como hemos dicho, la línea de tiempo es donde podremos organizar la sucesión de imágenes que dan lugar a una animación. En este capítulo introduciremos los conceptos de capa y fotograma, vitales para una compresión del funcionamiento de Flash. En cierta medida, Flash trabaja como si fuese una película. Una animación es una sucesión de imágenes fijas que, al pasar rápidamente unas detrás de otras, dan la impresión de un movimiento. Cada una de estas imágenes fijas es llamada también fotograma. Los fotogramas son representados bajo forma de rectángulos en la parte derecha del escenario. En estos rectángulos podemos alojar tres tipos diferentes de imágenes: •Imágenes clave Se trata de las imágenes que nosotros mismos dibujaremos •Imágenes fijas Son las imágenes claves copiadas en los fotogramas siguientes al de la primera imagen clave de manera a producir un efecto de objeto estático. •Imágenes de interpolación Se trata de imágenes calculadas por Flash que permiten la transición gradual entre dos imágenes claves. Este tipo de imágenes muy útiles ya que se generan automáticamente y proporcionan un efecto suave de movimiento o transformación.
  • 12. Diseño multimedia Flash Por otra parte, una animación esta generalmente constituida de una variedad de objetos diferentes, cada uno de los cuales se introduce en un momento diferente y presenta un comportamiento independiente al resto de los objetos. De manera a organizar y editar todos estos elementos Flash permite el uso de capas o calcos. Así, una animación Flash esta compuesta de una superposición de capas en cada una de las cuales introduciremos un objeto que tendrá su propia línea de fotogramas. Estas capas nos permiten trabajar la animación en distintos planos independientes. Por defecto, al comenzar una nueva escena encontraremos en nuestra línea de tiempo una sola capa. Progresivamente iremos introduciendo más capas que nos permitan separar cada uno de los elementos de la animación: objetos, fondo, sonidos o trayectorias. Un uso inteligente de las capas es la base para crear animaciones de calidad
  • 13. g.frances Algunos ejemplos Diseño multimedia Flash de integración de aplicaciones > creación de animaciones > diseño de interfaz > aplicaciones interactivas >