BIENVENIDOS AL CURSO

DE ADOBE FLASH

PROFESSIONAL CS5.5

UNIDAD 1.

CONCEPTOS FUNDAMENTALES

1

Unidad 1

En esta unidad se darán a conocer los conceptos básicos de diseño del programa Adobe Flash Professional CS5.5. Se mostrará paso a paso como instalar y ejecutar el programa en el equipo de trabajo; de igual manera se hará una introducción sobre los archivos y el tipo de lenguaje que este software utiliza.

Temas de la Unidad 1 Tiempo de Formacion

Tema 1. Conceptos y

usos de Adobe Flash

Definición y orientación sobre conceptos básicos de Adobe Flash Professional.

2 Horas

Tema 2. Conceptos básicos de

diseño

Se hace una introducción al diseño con recomendaciones y consejos que se deben

tener en cuenta.

2 Horas

Tema 3. Conceptos de

animación

Conceptos básicos de animación y aspectos importantes a la hora de comenzar un

proyecto.

2 Horas

Tema 4. Requerimientos

para trabajar con Adobe

Flash Professional

CS5.5 e instalación del

programa

Se hace una exposición del proceso de descarga del programa Adobe Flash

Professional CS5.5, para así ser instalado y ejecutado en el computador.

2 Horas

Tema 5. Familiarización con el Espacio

de Trabajo

Se presenta la forma ordenada de trabajar al desarrollar un proyecto (flujo de trabajo) y se hace una breve presentación del espacio de

trabajo del programa.

2 Horas

Tabla 1: Temas de formación en la Unidad 1

2

TEMA 1. Conceptos y usos de Adobe Flash

¿Qué es Adobe Flash? Flash es un software cuya función es el desarrollo de contenidos interactivos multimedia, basado en lenguaje script y de vectores, este permite realizar todo tipo de aplicación o contenido animado. En principio fue desarrollado por la empresa Macromedia y en la actualidad Adobe se encarga de su distribución. Plataforma Flash

Flash hace parte de la llamada Plataforma Adobe Flash, esta permite crear aplicaciones enriquecidas para distintos medios como celulares de última tecnología y equipos de cómputo, ya sea en la web o en aplicaciones nativas de escritorio. “La plataforma flash es un conjunto integrado de tecnologías, utilizadas para crear y ofrecer contenido”, se conforma principalmente por clientes, herramientas, servicios y servidores.

Figura 1: Plataforma Adobe Flash

Los elementos con mas relevancia de esta Plataforma son : Flash Player, utilizado en el desarrollo Web y Adobe Air, empleado para aplicaciones de escritorio. i Plataforma Adobe Flash en http://www.adobe.com/es/flashplatform/

3

Otras aplicaciones de gran utilidad en el desarrollo de contenidos son: Flash Builder, Flash catalys y la primordial, en la que se basa este curso, Flash Professional. Los otros elementos de la Plataforma Adobe son servidores y servicios que brindan herramientas para enriquecer distintos temas generados por estos softwares. Aplicaciones y usos de Flash

Flash permite dibujar y animar en dos dimensiones. Este incluye sonido, video y por supuesto la posibilidad de interactuar con una diversidad de contenidos. Flash es útil en muchas aplicaciones como por ejemplo: animaciones para diferentes dispositivos, entornos de elementos para la Web, presentaciones multimedia en CD y juegos; también posee un gran futuro, gracias a su capacidad para crear gráficos de alta calidad y de poco peso. Ademas su nueva caracteristica le permite exportar a la web en formato html5 , algo que planea ser mejorado e implementado en próximas versiones. Cosas que se pueden hacer con FLASH:

Creación de imágenes

Una de las aplicaciones a señalar es la posibilidad de exportar a cualquier parte una animación creada con Flash a una imagen estática. Las extensiones en las que se puede exportar desde Flash son: JPEG, GIF, PNG, PICT [Macintosh] y BMP. Pixeles o vectores El pixel es un elemento muy pequeño que compone las imágenes del mapa de bits, también conocidas como bitmaps. Cada pixel contiene información con respecto al color y a su posición en pantalla. Un mapa de bits es una matriz integrada por la ubicación de pixeles, mediante coordenadas cartesianas [x, y] mas su color. Al agrandar una imagen de este tipo, se ve una cuadricula compuesta por puntos rectangulares de color, éstos son los pixeles. Entre más pixeles haya por unidad de espacio, mayor es la calidad de la imagen y el tamaño del archivo. Documento de Flash El documento creado por Flash está integrado por un documento padre, este permite dibujar y componer una escena de animación. Despues la película que se exporta permite ser reproducida mediante el reproductor de Flash (Flash Player) o un reproductor de video. La extensión del documento padre es .FLA. La película exportada, el trabajo final tiene la extensión .SWF.

4

Algunos formatos de imágenes de mapa de bits son: BMP, PSD, XCF, JPEG, GIF, TIF, PNG. Un vector es un objeto digital definido de manera matemática. Los vectores se reunen al formar líneas y formas individuales. Estos gráficos se caracterizan por ser trabajables, ya que no se ajustan a un número determinado de unidades fijas, sino a fórmulas matemáticas internas de formaciondel gráfico, de esta forma, se puede agrandar una imagen sin que aumente el tamaño del archivo y sin perder definición. Algunos formatos de imágenes de vectores son: CDR [Corel Draw], SWF [película Flash], AI [Illustrator]. Algunos formatos de imágenes con información vectorizada y pixeles son: PICT [Macintosh], WMF [Windows], PSP [Paint Shop Pro], EPS [Encapsulated Postcript], PDF [Adobe Acrobat Reader], FLA [Flash]. Presentaciones multimedia

Son composiciones con imágen, sonido y video que pueden tener animación. Las composiciones multimedia suelen contener scripts o pequeños programas que ejecutan distintos eventos como: conexiones a internet, envio de correos electronicos, chats, etc. Además de Internet, Flash permite crear CDS multimedia, algo muy útil para armar catálogos de productos por ejemplo. Flash es capaz de incluir un reproductor, a fin de poder visualizar el contenido de la animación, sin necesidad de poseer el programa Windows Media Player. Animaciones Una animación es una secuencia integrada por varias imágenes que poseen cambios en un lapso de tiempo determinado. En las animaciones se utiliza línea de tiempo, capas, interpolación, etc. Juegos Gracias al lenguaje Actionscript que viene incluido en el Adobe Flash, el rango de posibilidades a la hora de realizar un juego o una aplicación interactiva es muy alto, ya que lo único necesario es un conocimiento básico de programación. Flash ofrece varias herramientas en el panel de edición Actionscript, así como la incorporación de acciones automatizadas que simplifican notablemente los proyectos desarrollados. Sitios Web

Flash es ampliamente utilizado para desarrollar sitios web completos o partes de ellos. Sin embargo existe controversia por el uso del software web (medida de uso de un

5

determinado producto de forma efectiva, organizada, comoda y de igual manera escalable y compatible para el resto de tecnologías que lo rodean.) Usuarios que solicitan el desarrollo de un sitio web con Flash, ignoran en la mayoria de los casos el concepto de usabilidad, por lo que se puede caer en un abuso de contenidos. Los sitios web, las presentaciones y las animaciones desarrolladas en Flash, son visualmente agradables. Pero en ocaciones son muy pesadas o innecesarias (en el caso de las presentaciones) para determinados usuarios, por eso, si se planea el desarrollo de un sitio web con Flash, se debe tener en cuenta prioritariamente el público al que va dirigido, ya que no todos los usuarios tienen la última versión de Flash Player en su navegador web o la conexión de banda ancha requerida. Una de las ventajas que ofrece Flash a un producto potente, es que los archivos generados para la Web, son más livianos que otros tipos de animaciones, como por ejemplo, GIF.

Figura 2.

6

TEMA 2. Conceptos básicos de diseño

Introducción al diseño Un buen diseño es clave para el éxito de cualquier producto. Cuando se tiene un negocio y se desarrolla una nueva línea de productos para competir contra empresas o sitios reconocidos en la red, tener un sitio web con ubicación física real y con calidad en el diseño es algo crucial para tener éxito. Afortunadamente la Web suele ser justa con personas creativas y dedicadas. Un sitio Web puede competir directamente con los grandes, sin necesidad de gastar más de 50 Millones de pesos. Todo lo que se necesita es ingenio y utilizar las herramientas adecuadas, aquí se desentrañarán los misterios del diseño en flash, lo que impulsará la posible creación de diseños innovadores. Como las aplicaciones de Flash crecen en tamaño y alcance, hay que dominar las técnicas que permiten llamar la atención. ¿Por qué es clave para el éxito un buen diseño? La respuesta es simple, la competencia. Si el proyecto en Flash es sólo uno de los millones en el mercado y lo que se quiere es sobresalir, más vale que este propósito se vea y funcione de manera perfecta. Esta sección cubre los cuatro principios básicos de un buen diseño:

- Sencillez - Facilidad de uso - Flexibilidad - Consistencia

Resulta paradójico pero es más fácil crear un diseño complejo y confuso, que uno simple y utilizable que tenga sentido rápido para el cliente y sea lo suficientemente flexible para crecer con las necesidades del usuario. La coherencia en el diseño del producto creado a través de Adobe Flash, es clave para hacer sentir cómodos a los clientes. Al dominar estos cuatro principios de diseño, el camino de creación para diversos proyectos será glorioso, ya que las personas se sentirán cómodas y querrán volver a contratarle. Sencillez La simplicidad es una muy buena idea. ¿Por qué? Debido a que un diseño complejo puede confundir el mensaje. Flash libera las limitaciones del diseño típicamente asociadas

7

con HTML y CSS. Esto quiere decir que Flash tiene más poder sobre el sitio web y sobre las distintas aplicaciones. Flash no se limita al trabajo con tablas para crear un diseño, se puede utilizar cualquier fuente que desee, mediante la incorporación directa en la película de Flash. Tampoco se tiene que luchar con la ubicación de objetos o estar preocupado porque el sitio se va a ver diferente en un navegador distinto, gracias a Flash Player, sólo es necesario crear un diseño y este funcionará bien en todas partes. Tendrá que practicar para generar un diseño de buen aspecto, estético, armónico y lo más importante, sencillo. Usabilidad De las millones de páginas que habitan en la Web, se decide volver a sitios favoritos, ya que son útiles y siempre tienen lo que se requiere. Para crear un diseño utilizable, es necesario prestar atención especial a la disposición de la pantalla en general, la navegación y la marca. Cuando se observa una película de Flash, la primera impresión se basa en el diseño de conjunto o diseño de pantalla general. ¿Cómo crear un diseño de pantalla general para un tipo de cliente? En Europa Occidental y América, se lee de derecha a izquierda, de arriba abajo, en los países asiáticos, es todo lo contrario. Se trata de una cuestión cultural y se tiene que negociar con el cliente cuando se inicie el trabajo de diseño. A medida que construye el servicio, tenga en cuenta cómo los usuarios encuentran el contenido o cómo "navegan" en la aplicación. Hay muchas maneras de crear sistemas de navegación en un explorador Web. En muchos casos se usa "adelante" y "hacia atrás", para así generar desplazamiento a través de las páginas, sin embargo, una aplicación de software puede utilizar los menús en la parte superior de la pantalla, lo que llevará a distintas partes de la aplicación. En el caso de las aplicaciones pequeñas, se requiere un mínimo de clics para interactuar con el usuario del sistema de navegación, este debe ser visible, coherente y claro.

8

Figura 3.

Una imagen clara de la marca también es importante para la construcción de un buen diseño, para la elaboración de unproyecto viable. Cuando el cliente este usando el ratón y/o teclado de la computadora, se espera que el proyecto interactivo desarrollado en flash tenga aspecto, sensación de uniformidad y comodidad durante todo el trayecto de la experiencia. También se espera ver el logotipo de la marca de aquellos que han desarrollado la aplicación. Construir una marca sólida e incorporarla en aplicaciones desarrolladas en flash, son cosas que se pueden hacer sin ninguna dificultad. Flexibilidad

Los proyectos modulares, las solicitudes acerca de diferentes cambios, están en constante evolución, por lo que se debe tener versatilidad en el cambio de elementos como logotipos y diferentes objetos usados en la aplicación. Los sitios web también necesitan este tipo de flexibilidad. Afortunadamente, las herramientas como componentes de Flash, se pueden cambiar a través de ActionScript; de igual manera es posible vincular elementos de las películas de Flash, a través de "bibliotecas vinculadas". Consistencia

Al mantener un diseño de uniformidad en todo el sitio o aplicación, el cliente debe enfocarse en trabajar el contenido, en lugar de navegar por él. Buenos ejemplos de aplicaciones diseñadas de manera inconsistente son las intranets de algunas compañías. Las grandes empresas tienen a menudo desarrolladores web, otros quieren colocar la marca en la intranet de la empresa del cliente. Esto es ideal para la

9

expresión personal, pero pésimo para los empleados que usan la aplicación, ya que existirán dificultades a la hora de encontrar la información correcta. Plantillas Flash

Una buena manera de empezar es utilizar una plantilla. Existen sitios comerciales que venden plantillas base para crear proyectos de Flash, es necesario profundizar e investigar con otros usuarios, para así saber si en verdad esa plantilla base, va a ser efectiva para el mencionado proyecto. Se puede hacer una búsqueda en Internet con las palabras templates, plantillas web o animación Flash. La línea de base Al crear un diseño para películas de Flash, se debe tener en cuenta; ser simple, útil, flexible y coherente. El objetivo final es ganar nuevos clientes. Flash posee un gran potencial como herramienta de desarrollo en el campo Web para Intranets e Internet, en los próximos textos se mostrarán algunos lineamientos. Rompiendo la pantalla . Al crear un proyecto Web, se debe emplear una estrategia de diseño, donde los elementos de la pantalla, contenido y navegación, se distribuyan de manera lógica. Este proceso se denomina "distribución por bloques". ¿Cómo trabajar en bloques? La distribución por bloques es un concepto que se utiliza para casi cualquier aplicación o sitio Web, esto implica dividir el diseño en bloques específicos, de manera que se reconozcan los contenidos organizados, como navegación, publicidad y marca. En el sitio web del SENA www.sena.edu.co, se puede observar esta distribución en los bloques marcados con rojo.

10

Figura 4.

El Sena reúne una gran cantidad de contenido en la pantalla, así el sitio es fácil de usar. Esto es porque el diseño está dividido en secciones de fácil reconocimiento. Se puede ver las áreas de contenido en rojo en la parte superior, tiene navegación del sitio, el banner con el logo a la izquierda cumple la función de cabecera, debajo de la navegación hay una presentación automática de fotografías, mas abajo en el centro está el contenido principal del sitio que se divide en tres columnas principales: la categoría de navegación, el contenido y la oferta de todos los servicios. Así aunque no se ve, está también el contenido del pie de página del sitio como un bloque de contenido en la parte inferior del sitio web. Regla de oro: Cuando realice la distribución de bloques para un sitio web, mantener el

diseño simple, es la clave, esto permite a los clientes encontrar aquello que buscan lo más pronto posible.

11

TEMA 3. Conceptos de animación Animación

Es el desarrollo de una ilusión que permite usar el movimiento para proyectar una sucesión de imágenes fijas en distintas posiciones, generando así un evento u objeto con apariencia viva. Esto es relativamente sencillo de hacer por medio de una computadora. Anteriormente la animación, se realizaba filmando secuencias dibujadas manualmente sobre materiales como plástico o papel, denominados celuloides; cada fotograma se creaba en una sola hoja de manera independiente.

La animación por computadora también se usa para crear efectos especiales y para simular imágenes complejas, por medio de otras técnicas u herramientas, sería casi imposible. Así mismo la animación electrónica puede ser programada para generar imágenes que arrojen datos estadísticos de diferentes áreas del conocimiento; de esta forma, es posible visualizar datos en el estudio de las interacciones de sistemas complejos, como dinámica de fluidos, colisiones de partículas, estudio de predicciones y análisis meteorológicos. Así estos modelos de cálculos matemáticos, utilizan la animación para analizar relaciones y diferentes clases de investigaciones, como la forense, por ejemplo, la cual reconstruye y soluciona diferentes casos judiciales, todo a través de la animación electrónica.

La animación fotograma a fotograma o la ilusión de movimiento se crea capturando una

secuencia de hojas plásticas llamadas celuloides pintadas a mano, luego estas se

proyectan a una velocidad determinada, alrededor de 10 a 30 celuloides por segundo.

En la animación informática o electrónica, las ilustraciones se crean mediante programas

fotograma a fotograma (hoja por hoja), luego se modifican y se reproducen.

Adobe Flash permite crear fotogramas clave e interpolar los fotogramas intermedios, lo

que automatiza el desarrollo, generando animaciones en menor tiempo con menos

recursos.

Otra técnica es la animación en tiempo real, aquí los fotogramas se crean por medio de

una computadora y se proyectan en la pantalla. Esta técnica elimina la fase intermedia de

digitalización de las imágenes. Esto es posible filmando un evento y digitalizándolo

automáticamente por medio de sensores de movimiento. Sin embargo, la animación en

tiempo real, no produce resultados de alta calidad, por lo tanto, a nivel profesional, solo se

usa para la creación de animaciones simples y juegos de computadora

12

Figura 5.

Aspectos básicos de animaciones

Nota: Como casi todo en Flash, la animación no requiere ActionScript, sin embargo, se pueden crear animaciones con ActionScript, si así se desea. Tipos de animaciones

Adobe Flash Professional CS5 ofrece varias formas para establecer animación y efectos especiales, cada método proporciona distintas posibilidades al crear contenido animado. Flash admite los siguientes tipos de animación: Interpolaciones de movimiento Las interpolaciones de movimiento se utilizan para establecer las propiedades de un objeto, por ejemplo, la posición y la transparencia alfa de un fotograma y de nuevo, de otro fotograma. Flash interpola valores de las propiedades de los fotogramas intermedios y así las interpolaciones de movimiento resultan útiles para animaciones de movimiento continuo o para la transformación de objetos. Las interpolaciones de movimiento aparecen en la línea de tiempo como grupos de fotogramas contiguos y se pueden seleccionar como un solo objeto deforma predeterminada. Las interpolaciones de movimiento son realmente potentes y fáciles de crear. Interpolaciones clásicas Las interpolaciones clásicas son como las interpolaciones de movimiento, aunque más difíciles de crear. Las interpolaciones clásicas permiten agregar efectos de animación específicos que no son posibles en interpolaciones de tamaño.

13

Poses de cinemática inversa Las poses de cinemática inversa permiten estirar y doblar objetos de forma, así como vincular grupos en instancias de símbolos para que se muevan con naturalidad al mismo tiempo. Una vez añadidoslos huesos a una forma o a un grupo de símbolos, puede cambiar la posición de los huesos o símbolos en los distintosfotogramas clave. Flash interpola las posiciones de los fotogramas intermedios. Interpolaciones de forma En la interpolación de forma, se dibuja una forma en un fotograma concreto de la línea detiempo y se modifica o se dibuja otra forma en otro fotograma específico, después Flash interpola las formasintermedias de los fotogramas y crea la animación de una forma cambiante. Animación fotograma a fotograma

Esta técnica de animación permite especificar distintas ilustraciones para cadafotograma de la línea de tiempo. Por lo general se usa esta técnica para crear efectos de fotogramas en una película que sucede rápidamente. Esta técnica resulta útil en animaciones complejas, donde es preciso que los elementos gráficosde cada fotograma sean distintos. Trabajando con Storyboard

Para trabajar con Flash en la producción de animaciones, se debe tener en cuenta la creación de un plan de trabajo, esto para tener un diseño preliminar antes de mover las herramientas del software por medio del mouse y/o teclado. Crear un StoryBoard en el papel antes de comenzar es una buena idea, los StoryBoard son elementos gráficos que permiten pre visualizar secuencialmente una animación o historia que se desee narrar. La realización previa del Storyboard permite planificar un vídeo para garantizar que se van a obtener imágenes de aquellos contenidos sobre los que trata el vídeo. Si no se hace bien un Storyboard, se observará en la película que las imágenes tienen poco que ver con la narración. Componentes de un storyboard:

-Duración: De cinco a siete segundos es el tiempo ideal para que una imagen aparezca

en pantalla; aunque no hay problema si algunas imágenes dominantes se extienden más.

-Narración: Se divide el texto en fragmentos, es importante la brevedad, el vídeo debe

incluir pausas que ayuden a resaltar imágenes o elementos pertenecientes al clip. La

14

Narración no debe contar lo que se ve en la película, sino aportar información sobre lo que

se va a ver, se debe tratar que las imágenes duren más tiempo que el texto.

-Efectos de video, subtítulos: Se añaden títulos, efectos o transiciones dependiendo del

clip a realizar.

- Música: Se especifica la banda sonora o grupo musical del clip.

TEMA 4. Requerimientos para trabajar con Adobe Flash Professional CS5.5 e instalación del programa

Requerimientos para trabajar con Flash

Para poder trabajar con Adobe Flash professional, es necesario cumplir con una serie de requisitos en el equipo de computo, uno de ellos, es contar con un cliente para interpretar el contenido, actualmente los navegadores web como Google Chrome o Mozilla Firefox, cuentan con una versión del cliente de Flash Player integrado, de no contar con esta aplicación en ninguno de los navegadores, dirigirse a la página de Adobe, para descargar el Flash Playeren el siguiente linkhttp://get.adobe.com/es/flashplayer/ y hacer clic en el botón “Descargar Flash Player”, seguir las instrucciones presentes en la página.

Figura 6.

La proxima descarga que debe hacer es la herramienta de trabajo Flash Professional. Es posible conseguir una copia de prueba desde la página del fabricante. Entrar en la sección de descarga, http://www.adobe.com/es/downloads/, allí seleccione el software que necesita descargar, en este caso Adobe Flash Professional CS5.5.

Figura 7.

15

Configuraciones mínimas requeridas por el sistema Para Windows: • Procesador Intel Pentium 4 o AMD Athlon 64 • Sistema Operativo Microsoft Windows XP con Service Pack 2 (Service Pack 3 recomendado); Windows Vista Home Premium, Business, Ultimate o Enterprise con Service Pack 1 o Windows 7. • 1 GB de RAM. • Para instalación 3,5 GB de espacio disponible en disco duro y espacio libre adicional. • Resolución de pantalla 1024 x 768 (recomendado 1280 x 800) con tarjeta de vídeo de 16 bits. • DVD-ROM. • Software QuickTime 7.6.2, necesario para funciones multimedia. Aunque este curso no manejará procedimientos para el sistema operativo de Apple, aquíestán los requerimientos para este sistema: Para Mac OS: • Procesador Intel multinúcleo. • Mac OS X v10.5.7 o v10.6. • 1 GB de RAM. • Para instalación 4 GB de espacio disponible en disco duro y espacio libre adicional. • 1024 x 768 de pantalla (1280 x 800 recomendado) con tarjeta de vídeo de 16 bits. • DVD-ROM • Software QuickTime 7.6.2, necesario para funciones multimedia. Para obtener información actualizada sobre los requisitos del sistema y las instrucciones completas para instalar el software, visitar www.adobe.com/go/flash_systemreqs Instalar Flash de Adobe Flash Professional CS5 desde el DVD que se compre o desde el archivo proporcionado por Adobe en suunidad de disco duro, debe recordar que no se puede ejecutar el programa desde el DVD. Seguir instrucciones en pantalla. Asegurase del número de serie, este debe ser accesible antes de instalar la aplicación. Puede encontrar el número de serie de la tarjeta de registro en la parte posterior de la caja del DVD. Pasos para instalar Adobe Flash

Se debe comprar el software Adobe Flash Professional, ya sea como aplicación independiente o como parte de la Adobe Creative Suite. También es posible descargar una demostración gratuita que podrá utilizar durante 30 días, a través de la siguiente dirección web: http://www.adobe.com/es/downloads/.

16

1. Clic en el botón inicio de Windows. 2. Clic en todos los programas. 3. Clic en Internet Explorer.

Figura 8.

1

2

3

17

4. Digitar en la barra de direcciones esta url: http://www.adobe.com/es/downloads/ 5. Colocar el puntero del Mouse sobre el ícono de Adobe Flash Professional CS5.5 y

dar clic en Probar. 6. En la nueva página, dar clic sobre el botón Descargar ahora.

Figura 9.

7. En la parte inferior aparece una ventana horizontal, dar clic en el triangulo selector pequeño junto a la palabra Save (guardar) y escoger Save and Run (guardar y ejecutar).

4

5

6

18

Figura 10.

8. Aparece una barra de progreso que indica que se está descargando el asistente de

instalación. 9. Posteriormenteaparece la ventana de inicio de asistente de instalación, allí se puede

seleccionar la ubicación en donde se quiere instalar la aplicación. También podrá crear, si así lo desea, un acceso directo en el escritorio, esto con el fin de poder ejecutar la aplicación cuando la instalación finalice. Dejar los valores que están seleccionados y dar clic en Continuar.

Figura 11. 10. Aceptar los términos del contrato para la instalación y uso de Adobe Flash 11. Aceptar los términos y condiciones de uso.

7

8

9

Triangulo

Selector

19

Figura 12.

12. Iniciar sesión con el usuario y contraseña registrado en Adobe. 13. Si no ha registrado usuario en Adobe, dar clic en el botón crear un ID de Adobe,

registrar el usuario y continuar con la instalación. 14. Clic en Iniciar sesión.

Figura 13.

10

11

12

13

14

20

15. Luego de haber entrado en la Instalación con el ID de usuario de Adobe, dar clic en Seleccionar productos.

Figura 14.

16. Escoger Diseño.

Figura 15.

17. Dar clic en el triangulo de la derecha hasta visualizar Adobe Flash Professional CS5.5

15

16

16

21

Figura 16.

18. Seleccionar el idioma, para este caso Español.

Figura 17.

19. Clic en Descargar.

17

18

22

20. Seleccionar la carpeta donde se va a descargar el archivo de instalación, en este caso, el Escritorio.

21. Dar clic en Aceptar.

Figura 18.

22. Esperar a que descargue el archivo. 23. Aguardar hasta que el asistente extraiga los archivos.

20

21

22

19

19

23

Figura 19. 24. Ubicar el archivo de instalación que se guardaráen el escritorio.Entrar a la carpeta

Adobe Flash Professional CS5.5 y dar doble clic en el archivo que tiene como nombre Set-up.

Figura 20.

25. Inicia el asistente del instalador con una barra de progreso. 26. Aceptar el Acuerdo de Licencia de Adobe.

23

24

24

Figura 21.

27. Seleccionar Instale este producto como una prueba; o si ha comprado la licencia de Adobe Flash Professional, seleccionar „Proporcione un numero de Serie‟ y a continuación digitarlo.

28. Clic en Siguiente.

Figura 22.

25

26

27

28

25

29. Digitar el ID de usuario de Adobe y la contraseña. El que haya creado,esto se hizo anteriormente en el asistente de descarga.

30. Clic en Siguiente. 31. También puede dar clic en Omitir este paso.

Figura 23.

32. Verificar que esté marcada la opción ADOBE FLASH PRO CS5.5 33. En Ubicación dejar la ruta que está predefinida por C:\Program Files\Adobe. 34. Clic en Instalar.

Figura 24

29

30 31

32

33

34

26

35. Esperar que el avance de instalación concluya.

Figura 25.

36. Cerrar las aplicaciones que nos solicita el asistente de instalación y dar clic en

CONTINUAR.

Figura 26

36

35

35

27

37. Clic en TERMINADO.

. Figura 27

38. Ahora ya puede dar clic en el botón Inicio de Windows. 39. Dar clic en Todos los programas. 40. Clic en Adobe. 41. Clic en Adobe Flash Professional CS5.5

37

28

Figura 28.

42. Se inicia la aplicación a través de un diseño plegado rojo.

38

39

40

39

41

29

Figura 29.

43. Ahora la herramienta está lista para trabajar.

Figura 30.

30

Extensiones de archivos que maneja Flash Professional.

Flash Professional maneja un conjunto de extensiones para los tipos de archivos soportados.

Figura 31: Tipo de archivos soportados por flash.

Los principales documentos de Flash son los de formatos FLA y SWF. FLA almacena contenido de animaciones y código, es el documento fuente principal de una presentación en Flash, mientras que SWF, es el archivo de película donde se almacena toda la animación final, luego de ser compilada por el software. La presentación final del archivo SWF es interpretada y visualizada a través de Adobe Air o Flash Player. Hay otros tipos de archivo, está AS que almacena código Action Script en archivos externos, está JSFL que almacena código Java Script y está el formato de video FLV para películas que se interpretan a través de herramientas de Flash.

Figura 32 Contenido del formato XFL.

No obstante, la nueva versión de Adobe Flash Professional, incluye un nuevo formato de archivo, el XFL, este no es más que un archivo FLA desempaquetado, conformado por tres carpetas principales en donde se almacena contenido (imágenes, videos, códigos) por separado.

31

TEMA 5. FAMILIARIZACIÓN CON EL ESPACIO DE TRABAJO

Flujo de trabajo general en Flash Para crear una aplicación Flash, se realizan normalmente los siguientes pasos: -Planificar la aplicación

Decidir las tareas básicas que realizará la aplicación. -Añadir elementos multimedia

Creare importar elementos multimedia como imágenes, vídeo, sonido y texto. -Organizar los elementos

Estructurar elementos multimedia en el escenario y la línea de tiempo, para definir cuándo y cómo aparecerán enla aplicación. -Aplicar efectos especiales Aplicar filtros gráficos (desenfoques, iluminados y biseles), mezclas y todo tipo de efectos especiales que se consideren oportunos. Utilizar ActionScript para controlar el comportamiento Cuando se escribe código ActionScript, se puede controlar cómo se comportarán y que respuesta tendrán los elementos multimedia a las interacciones del usuario. Probar y publicar la aplicación Pruebe el archivo FLA desde el menú Control > Probar película, para verificar que la aplicación funciona del modo deseado; así mismo, busque y solucione errores que encuentre. La aplicación se debe probar durante todo el proceso decreación. Publique el archivo FLA Desde el menú Archivo > Publicar como archivo SWF, para así poder mostrar una página Web y reproducirla con Flash Player. Información general sobre el espacio de trabajo

Es posible crear y manipular documentos y archivos al emplear distintos elementos como paneles, barras y ventanas. Cualquier disposición de estos elementos, se denomina espacio de trabajo. Los espacios de trabajo de las distintas aplicaciones deAdobe Creative Suite5, tienen la misma apariencia, para facilitar el cambio de una a otra. Además, si se prefiere, se puede adaptar cada aplicación al modo de trabajar, al seleccionar uno de los varios espacios de trabajo preestablecidos o al crear uno de manera personalizada. Aunque el diseño del espacio de trabajo predeterminado varía en función del producto, los elementos se manipulan de manera muy parecida en todos los casos.

32

Reconociendo el espacio de trabajo en Flash.

Adobe Flash Professional cuenta con un espacio de trabajo compacto y fácil de comprender, en las versiones de Adobe Flash CS4, CS5 y CS5.5, se incluyen espacios de trabajo, estos dan la posibilidad de personalizar la interfaz de la herramienta, con el fin de acomodarla a sus necesidades.

Figura 33.

Los elementos del espacio de trabajo de Flash son:

Escenario

Línea de tiempo.

Panel de propiedades.

Panel de herramienta.

Barra de aplicación.

Barra de documentos.

33

El escenario

Es un rectángulo blanco que representa la zona de visualización del contenido, todos los objetos que se encuentran en esta zona, serán visibles en la presentación final del contenido multimedia. La zona gris conocida como el tablero o cartón de trabajo, oculta los objetos para que no se visualicen en el contenido final. La línea de tiempo Se encarga de controlar el flujo de animaciones en el trascurso del tiempo, utiliza una combinación de capas y fotogramas para controlar las visualizaciones por medio de la cabeza lectora, está es la encargada de indicar en qué posición se encuentra la línea de tiempo y también permite visualizar el contenido disponible en los fotogramas, de acuerdo a la posición. La línea de tiempo se conforma por:

1. Cabeza lectora. 2. Fotogramas. 3. Capas. 4. Botones papel cebolla. 5. Indicador fotograma actual. 6. Indicador velocidad fotograma. 7. Indicador tiempo trascurrido. 8. Crear capa. 9. Crear carpeta. 10. Eliminar. 11. Mostrar u ocultar. 12. Bloquear o desbloquear. 13. Mostrar contornos.

Figura 34.

Entre los tipos de fotograma que usa la línea de tiempo, se encuentra el fotograma clave, este representa elementos principales con características definidas; mientras que el

34

fotograma simple, es una extensión del fotograma clave que permite al elemento ser ubicado en la línea de tiempo. El panel de propiedades También conocido como inspector de propiedades permite acceder a las configuraciones y propiedades de los elementos de Flash Professional de una forma rápida. Las opciones que se encuentran en el panel dependen del elemento que se seleccione, ya sea un objeto de Flash o una herramienta. Para visualizar el panel de propiedades de forma rápida, utilizar el teclado y presionar la combinación de teclas Ctrl más la tecla F3.

El panel de herramientas

Es el panel que contiene las herramientas para el diseño y retoque de los contenidos de Flash Professional. La barra de aplicación Se encarga de almacenar la barra de menús, el menú de selección de área de trabajo, el campo de búsqueda, menú de servicios CS live y botones del sistema (minimizar, maximizar y cerrar). La barra de documentos

Muestra las fichas o pestañas de los documentos que se están trabajando en Flash Professional, junto con la barra de edición de cada documento.

35

REFERENCIAS

i Plataforma Adobe Flash en http://www.adobe.com/es/flashplatform/. Equipo Adobe. Ayuda Flash Professional/Temas de Adobe (Marzo 2012). En http://help.adobe.com/es_ES/flash/cs/using/index.html. Equipo Adobe. Introduction to design (1 de Julio de 2005) en http://www.peachpit.com/guides/content.aspx?g=flash&seqNum=328 Pearson Education, Peachpit Press. Material realizado por el grupo de rediseño del Centro Agroindustrial Regional Quindio SENA (Mayo de 2012).