01 introducción a flash catalyst

19
MAESTRÍA EN MEDIOS INTERACTIVOS Tercer Semestre

Upload: victor-garcia

Post on 13-Jun-2015

1.411 views

Category:

Design


0 download

DESCRIPTION

MMI. 3 Semestre. IxD. PrácticaSesión 01. Introducción a Flash Catalyst

TRANSCRIPT

Page 1: 01 Introducción a Flash Catalyst

MAESTRÍA EN MEDIOS INTERACTIVOSTercer Semestre

Page 2: 01 Introducción a Flash Catalyst

INTRODUCCIÓN A FLASH CATALYST

01

Page 3: 01 Introducción a Flash Catalyst

CONTENIDO• Temario General

• 1. 1Acerca de Flash Catalyst

• 1.2 ¿Para quién es Flash Catalyst?

• 1.3 Principales Características

• 1.4 Conceptos clave

• 1.5 ¿Cuándo usar Flash Catalyst?

• 1.6 Flujo de trabajo en Flash Catalyst

Page 4: 01 Introducción a Flash Catalyst

TEMARIO1.Introducción a Flash Catalyst•Acerca de Flash Catalyst•¿Para quién es Flash Catalyst?•Principales Características•Conceptos Clave•¿Cuándo usar Flash Catalyst?•Flujo de trabajo en Flash Catalyst

2.Proyecto en Flash Catalyst. Conceptos básicos•Creación de un nuevo proyecto•Definiendo componentes•Agregando páginas•Agregando interacción•Agregando transiciones•Opciones de publicación

3.Creación de proyectos•Planeación de un proyecto•Iniciando un proyecto desde Illustrator, Photoshop y Fireworks•Iniciando un proyecto desde Flash Catalyst

Page 5: 01 Introducción a Flash Catalyst

TEMARIO

4.Componentes básicos•Qué es un componente•Tipos de componentes:

•Button•Checkbox•Radio Button•Toogle Button•Text Input•Slider•Scrollbar

5.Creación y edición de trabajo de arte•Herramientas básicas de dibujo•Configuración de propiedades de los objetos•Importación de trabajo de arte•Edición desde Illustrator•Edición desde Photoshop

•Trabajando con texto•Optimización del trabajo de arte

Page 6: 01 Introducción a Flash Catalyst

TEMARIO

6.Organización y layout•Páginas y capas•Edición de páginas y estados.•Guías, retículas y reglas•Alineación y distribución de objetos•Traslado de objetos entre páginas y estados•Uso del panel Librería

7.Creación de interacción y transiciones básicas•Los diferentes tipos de interacción•Condicionales de interacción•Línea del tiempo. Conceptos básicos•Tipos de transiciones

•Suavizadas •Movimiento•Escala•Rotación

•Rotación 3D•Ajustes básicos de timing•Animación de una secuencia

Page 7: 01 Introducción a Flash Catalyst

TEMARIO

8.Integración de elementos Rich Media•Creación de archivos de video Flash•Agregando video a un proyecto•Control del reproductor de video•Agregando efectos de sonido•Integración de contenido Flash

9.Trabajando con Design-Time Data•Uso de una lista de datos para definir

elementos repetitivos•Creación de una lista básica de datos:

componentes y datos•Creación de una lista compleja de datos:

componentes y datos10.Publicación de proyectos•Salida SWF•Salida Adobe AIR

Page 8: 01 Introducción a Flash Catalyst

ACERCA DE FLASH CATALYST

Adobe Flash Catalyst CS5 es una herramienta de diseño interactivo accesible. Permite transformar las imágenes de Adobe Photoshop, Illustrator y Fireworks en proyectos interactivos* sin que sea necesario escribir código**.

* En forma básica.** Visible para el usuario.

Page 9: 01 Introducción a Flash Catalyst

ACERCA DE FLASH CATALYST

http://www.adobe.com/flashplatform/index.html

Flash Catalyst está integrado a la Plataforma Adobe Flash, una colección de tecnologías integradas de Adobe para el diseño, creación, desarrollo y visualización de Aplicaciones de Internet Enriquecidas (RIA´s).

Page 10: 01 Introducción a Flash Catalyst

ACERCA DE FLASH CATALYST

Actividad 01Visitar el sitio de Adobe, consultar información sobre la Plataforma Adobe Flash

Page 11: 01 Introducción a Flash Catalyst

ACERCA DE FLASH CATALYST

Responder las siguientes preguntas:

1. ¿Qué es una Aplicación de Internet Enriquecida (RIA)?

2. ¿Qué tecnologías integran la Plataforma Adobe Flash?

3. ¿En qué consiste el framework Adobe Flex?

Page 12: 01 Introducción a Flash Catalyst

¿PARA QUIÉN ES FLASH CATALYST?

Está orientado a diseñadores que desarrollen contenido interactivo:

•Diseñadores Web•Diseñadores de interacción•Arquitectos de información•Diseñadores gráficos•Directores creativos•Desarrolladores RIA

Cualquier diseñador querequiera transformar rápidamente

contenido estático y describir la Experiencia de Usuario

Page 13: 01 Introducción a Flash Catalyst

PRINCIPALES CARACTERÍSTICAS

• Integración

• Librería

• Componentes interactivos

• Eventos de interacción

• Transiciones

• Páginas y estados

• Publicación

Permite a diseñadores:

•Mostrar Interfaz funcional y no sólo contenido estático en menor tiempo

•Facilita la interpretación de la UX

•Mejora la colaboración con desarrolladores

Page 14: 01 Introducción a Flash Catalyst

CONCEPTOS CLAVE

• Diseño de Interacción (IxD)• Experiencia de Usuario (UX)• Construcción de bloques

• Componentes• Páginas y estados• Transiciones

• Diseño sin código• Framework de código abierto Flex• Integración con la fase de

desarrollo• Formatos de salida

• SWF• AIR

Page 15: 01 Introducción a Flash Catalyst

CUÁNDO USAR FLASH CATALYST

InDesignDiseñar

• Contenido “estático”• Documentos• Presentaciones• Portfolios• Cross-media

FlashCrear

• Aplicaciones de Internet o escritorio

• Video interactivo• Publicidad Web• Juegos

Flash CatalystTransformar

• GUI• Aplicaciones de

Internet• Micrositios• Widgets

Flash BuilderDesarrollar

• Aplicaciones de Internet complejas

Page 16: 01 Introducción a Flash Catalyst

FLUJO DE TRABAJO

Existen dos tipos principales de aplicaciones Flash Catalyst:

• Micrositios

Page 17: 01 Introducción a Flash Catalyst

FLUJO DE TRABAJO

Existen dos tipos principales de aplicaciones Flash Catalyst:

• Aplicaciones centradas en datos (Data-Centric Aplications)

Page 18: 01 Introducción a Flash Catalyst

FLUJO DE TRABAJO

• El flujo de trabajo es similar para ambas aplicaciones. Incluye:

1. Planeación (lápiz y papel)2. Crear Artwork3. Agregar recursos a Flash Catalyst4. Crear y modificar páginas5. Crear componentes interactivos6. Definir estados de los componentes7. Definir interacciones y transiciones8. Testear y publicar

Seguir un flujo de trabajo consistentepermite llevar de mejor forma la

administración de proyectos.

Page 19: 01 Introducción a Flash Catalyst

SIGUIENTE SESIÓN:02 Proyectos en Flash Catalyst. Conceptos básicos