Portafolio (proceso de construcción)

Portafolios digitales proceso de construcciónPortafolios digitales | Jorge CantúEscuela de Diseño y Multimedia | Instituto Profesional Arcos

Armado en Se genera la interfaz de las pantallas en base a un Photoshop archivo .psd armado por capas identificadas claramente con nombre. Utilizaremos un formato de pantalla completa a 1024 x 768 px. Se separan en capas todos los elementos que luego van a ser independientes, tanto para la animación o movimiento en pantalla, como para la interacción (botones).Portafolios digitales | Jorge CantúEscuela de Diseño y Multimedia | Instituto Profesional Arcos

Armado en Se comienza por definir el tipo de documento y sus Flash dimensiones. Para efecto de este trabajo utilizaremos Actionscript 2.0 y una película compatible con lo desarrollado en Photoshop (1024 x 768 px.).Portafolios digitales | Jorge CantúEscuela de Diseño y Multimedia | Instituto Profesional Arcos

Importación Es posible importar el archivo .psd directamente al flash a Flash conservando la individualización de las capas. Las imágenes importadas pueden ser optimizadas mediante una compresión optimizada (generalmente entre 40 y 60%).Portafolios digitales | Jorge CantúEscuela de Diseño y Multimedia | Instituto Profesional Arcos

Símbolos en Una vez importadas las imágenes a capas individuales deben Flash ser convertidas a símbolo antes de animar o programar. Los elementos que se moverán en la pantalla serán convertidos a “clip de película”, los elementos que funcionarán como botones serán convertidos a símbolo de “botón”. Se debe conservar la individualidad de cada elemento.Portafolios digitales | Jorge CantúEscuela de Diseño y Multimedia | Instituto Profesional Arcos

Animación Para animar cada símbolo es necesario establecer la duración en Flash de ésta animación insertando un fotograma clave en el momento deseado. En cada uno de los fotogramas clave, es posible cambiar los parámetros de las propiedades del símbolo (posición, tamaño, efectos, filtros, etc.).Portafolios digitales | Jorge CantúEscuela de Diseño y Multimedia | Instituto Profesional Arcos

Animación Una vez establecidas las propiedades de cada fotograma en Flash clave es posible crear la “interpolación” o pasos intermedios que permitirán la visualización de la animación. Es importante trabajar en este nivel con la interpolación “clásica” (CS4 y +) debido a que la interpolación de movimiento es mas compleja de manejar.Portafolios digitales | Jorge CantúEscuela de Diseño y Multimedia | Instituto Profesional Arcos

Animación Terminado el proceso de animar mediante interpolación cada en Flash una de las capas, podremos probar el resultado de nuestra película en el menú Control > Probar película.Portafolios digitales | Jorge CantúEscuela de Diseño y Multimedia | Instituto Profesional Arcos

Escenas en Cada pantalla o sección de nuestro interactivo estará armado Flash en una escena de flash independiente. Para ver y crear nuevas escenas, activar el panel desde el menú Ventana > Otros paneles > Escena.Portafolios digitales | Jorge CantúEscuela de Diseño y Multimedia | Instituto Profesional Arcos

Botones en Los símbolos de botón poseen la característica de poder ser Flash configurados en cada uno de sus “estados “ (reposo, sobre y presionado). Para ello debemos ingresar al botón haciendo doble clic sobre él, insertar fotogramas clave en cada uno de los estados a configurar y realizar las modificaciones de tamaño, filtros y/o efectos, así como cambios en eventuales capas adicionales, utilizadas para incorporar otro tipo de información, como texto u otros.Portafolios digitales | Jorge CantúEscuela de Diseño y Multimedia | Instituto Profesional Arcos

Programación La incorporación de comportamiento en flash se realiza en Flash mediante la configuración de acciones escritas en el lenguaje Action Script, del cual en la actualidad disponemos de 3 versiones. Este trabajo se realizará en AS2.Portafolios digitales | Jorge CantúEscuela de Diseño y Multimedia | Instituto Profesional Arcos

Acciones en Vamos a utilizar dos tipos de acciones: Acciones de Flash Fotograma (asociadas a la reproducción general de la línea de tiempo de la película) y las Acciones de Botón (asociadas a la interacción del usuario con los símbolos de botón). Cada una de ellas se activa al seleccionar el elemento correspondiente (un fotograma particular en la línea de tiempo o un botón particular dentro del escenario). Además, trabajaremos activando la opción de “Asistente de script” para auto completar parte del código.Portafolios digitales | Jorge CantúEscuela de Diseño y Multimedia | Instituto Profesional Arcos

Detener Las primeras acciones a incorporar en flash, serán las que nospelícula Flash permitirán detener la reproducción de la película, para evitar que pase automáticamente a otra escena. Esta acción se incorpora en el último fotograma de la escena actual, generalmente en una capa especial a la que se le inserta un fotograma clave, y mediante el Asistente de script se inserta la acción de “stop”.Portafolios digitales | Jorge CantúEscuela de Diseño y Multimedia | Instituto Profesional Arcos

Programación La acción para programar un botón se incorporabotones Flash seleccionando el símbolo y mediante el Asistente de script se inserta la acción de “goto”, definiendo el nombre de la escena a la cual se quiere mandar la película.Portafolios digitales | Jorge CantúEscuela de Diseño y Multimedia | Instituto Profesional Arcos

Configuración La película debe iniciar su reproducción en modo “pantallaPelícula Flash completa”, para esto podemos incorporar una acción de fotograma, en el primer fotograma de la primera escena, con la acción “fscommand”, utilizando el comando “fullscreen” y el parámetro “true” para activarlo.Portafolios digitales | Jorge CantúEscuela de Diseño y Multimedia | Instituto Profesional Arcos

Configuración Junto con lo anterior, debemos crear un botón para salir delPelícula Flash portafolio, ya que este, al estar en modo pantalla completa, perderá los botones de cerrar ventana, propios del sistema operativo. Se debe incorporar una acción de botón, con la acción “fscommand”, utilizando esta vez el comando “quit”.Portafolios digitales | Jorge CantúEscuela de Diseño y Multimedia | Instituto Profesional Arcos

Publicación Una vez creadas todas las escenas y programados los final Flash botones se genera la película definitiva mediante el menú Archivo > Configuración de la publicación. Acá debemos activar la opción de Proyector para Windows y para Macintosh. Esto permitirá que el portafolio corra en cualquier sistema operativo de forma autónoma.Portafolios digitales | Jorge CantúEscuela de Diseño y Multimedia | Instituto Profesional Arcos

CD Finalmente debemos crear un documento de texto con elAutoejecutable nombre “autorun.inf” que incluya las instrucciones para que el CD se autoejecute al momento de insertar el CD. En el Cd se deben grabar, el archivo ejecutable .exe, la carpeta .app para Mac, el archivo autorun.inf y si se utilizaron videos, los archivos .flv y los .swf de los controladores de video.Portafolios digitales | Jorge CantúEscuela de Diseño y Multimedia | Instituto Profesional Arcos

Portafolios digitales | Jorge CantúEscuela de Diseño y Multimedia | Instituto Profesional Arcos

Portafolio (proceso de construcción)

by jorgecantul on Sep 05, 2012

Accessibility

Upload Details

Usage Rights

1 Embed 117

Statistics

Portafolio (proceso de construcción) Presentation Transcript