PROGRAMA OBJETIVOS GENERALES OBJETIVOS ESPECIFICOS CONTENIDOS. Producción Digital IV FACULTAD DE DISEÑO Y COMUNICACION

Transcripción

1 PROGRAMA OBJETIVOS GENERALES Conocer los fundamentos y conceptos generales de la utilidad, función de la producción digital y la comunicación visual en el campo digital multimedia. Aproximarse a las variables de la producción digital de contenidos multimedia interactiva. Indagar en el ejercicio de la producción digital, y comprender la relación entre las etapas de la producción de un proyecto multimedia interactiva, sus aspectos técnicos y alternativas de solución. Integrar los conceptos de Producción digital III para la solución de trabajos prácticos de producción de proyectos multimedia en web. OBJETIVOS ESPECIFICOS Reconocer y aplicar los conceptos técnicos y estándares web a la propia producción de un proyecto multimedia. Reconocer los conceptos de arquitectura de la información, interfaz e interactividad al desarrollo del propio proyecto multimedia. Identificar la noción de sistema y diagramación a través de wireframes y mapas conceptuales para aplicarlos en la maquetación del proyecto. Aplicar los contenidos de la cursada, integrar y resolver los aspectos de la producción multimedia en la inclusión de imagen, video, sonido, animación e interactividad a la propuesta, y adquirir vocabulario especifico de la materia. CONTENIDOS Módulo 1. Desarrollo de productos multimedia Multimedia. Soporte conceptual y de solución a las etapas del proyecto multimedia. Plan de necesidades. Investigación. Concepto. Guión multimedia. StoryBoard. Mapa Conceptual. Arquitectura de la información. Interfaces. Planteo de pantalla con opciones. Test preliminares por pantalla y grupos de pantallas. Requerimientos técnicos, compatibilidad y visualización del material producido. Test final. Correcciones y devolución. Puesta definitiva y difusión. Difusión digital e impresa. Difusión en soportes digitales : tablets y celulares. Módulo 2. Desarrollo de productos multimedia Estándares de reproducción en web: estructura, presentación y comportamiento. Propiedades y elementos de la web; sindicación, predecibilidad, navegabilidad, blogs, podcasts. Lenguajes HTML 5 y XTML, XML. HTML5 y las aplicaciones en web. HTML y Javascript. DIVS. La estructura semántica de la página y de un proyecto multimedia. CSS3, anatomía de los estilos y el layout. Objetos animados. Objetos de video. Sonido. Interacción. Reglas de accesibilidad para un multimedia aplicables al uso de imágenes, video es streaming, reproducción del color, uso de estilos en cascada, tipografías, comportamientos de scripts y rollovers, layouts. Browsers. Estándares y validación. Estándares W3C. Soportes digitales : tablets y celulares. Página 1

2 Módulo 3. Relación usuario interfase Módulo 4. Organización del multimedia interactivo. Relación usuario/interfase. Usuario y comportamiento. Introducción al proceso organizativo. Estructura. Necesidades del usuario. Estudio del mercado. Especificaciones funcionales. Requerimientos de contenido. Diseño de la interacción. Introducción al concepto de interactividad. Aplicaciones. Diseño de la información. Diseño visual. Optimización. Ejemplos. Análisis. Principios para el desarrollo de productos interactivos. Concepto de sistema. Esquematización por pantallas. Mapa de navegación. Coherencia. Consistencia. Usabilidad. Predecibilidad. Legibilidad. Accesibilidad. Enlaces y mapa de recorridos. Velocidad de la interfaz. Economía. Publicidad en la web. Recursos. Multimedia interactivo. Definición. Posibilidades comunicaciones. Estructura. Esquema de organización, funcionamiento y navegación del producto hipermedia. Mapas conceptuales. Flujogramas. Wireframes. Organización, etiquetado, navegación y sistema de búsqueda. Diagrama. Planos. Maquetas. Diagramas de contenido o flujo. Diagramas de presentación. Prototipo de alta fidelidad (mock up). Wireframe elementos: inventario de contenido, elementos de la página, etiquetado layout, comportamiento. Wireframe tipos: content-only. Diagrama de bloques. Detallado. Errores y metodología de la creación de wireframes. Módulo 5. Diseño visual de interfase Módulo 6. Interactividad de un multimedia Modelo conceptual. Lenguajes y formatos. Los materiales digitales y su presentación. Organización del proyecto multimedia. Estructura y arquitectura de la información. Comportamiento, código e interacción. Consistencia e interfaz. Organización del contenido. Mapas mentales. Usabilidad y análisis de usabilidad. Contextos de navegación. Direcciones URL. Orientación. Barras de navegación. Menúes. Resolución de casos. Diseño visual y definición de estilo. Enfoque perceptivo. Modelado en función del usuario. Relación usuario versus imagen audiovisual. Recepción y perceptividad. Presentación animada de un producto en base a imágenes y sonidos. El favor emotividad. Impacto. Prebocetos, bocetos, esquematizado y prototipado. Interactividad. Definición. Tipos de interactividad. Hipertexto. Hipervínculos. Enlaces entre pantallas. Principios de diseño de interfases. Relaciones de color, forma y función. Aplicación en el diseño y uso de botones. Creación de pantallas y subpantallas interactivas. Actuación independiente de pantallas. Conceptos de interactividad aplicados a las secuencias de pantallas. La estructura semántica de la página. Continuidad. Transiciones. Manejo técnico de la imagen raster y vectorial. Procesamiento de la imagen. Página 2

3 Módulo 7. Diseño sonoro aplicado a multimedia Aplicación del sonido en el desarrollo de multimedia. Uso del sonido. Correspondencia entre forma y función. Correlación con los componentes visuales del producto. Impacto en el usuario. Formatos de audio. Tipos de compresión. El diseño del espacio sonoro aplicado a multimedia e hipermedia. Aplicaciones en el diseño multimedia. Canales de audio. Frecuencias de muestreo. Pesos de distintos archivos. Optimización. Inclusión de sonido. Utilización en presentaciones multimedia. Inserción e integración de archivos de texto, gráficos, sonido, animaciones y texturas. Interactividad. Módulo 8. Aplicación de video en un multimedia El video aplicado en medios interactivos. Requerimientos para su captura y procesamiento. Formatos. Alta definición. Relación entre calidad y peso. Sincronización de archivos de audio con imagen fija y de video. Diferencias entre salidas a soporte fílmico, televisivo y productos multimedia. Velocidad de cuadros. Video en streaming. Módulo 9. Aplicación de animación bidimensional en un multimedia Concepto de animación. Armado de frames o fotogramas. Fotogramas clave (keyframes). Tweening. Animación por registro en tiempo real. Otras técnicas de animación. Movimientos en ejes x, y z. Zoom in y zoom out. Animación y control. Transiciones. Fundidos (fade in/out). Rotación. Traslación. Roll over. Velocidad de cuadros. Optimización. Creación y aplicación dentro de un producto interactivo. Módulo 10. Creación de un proyecto interactivo Integración de lenguajes y recursos. Peso de los archivos. Navegabilidad. Verificación del proyecto. Validación. Resolución, tamaño de impresión, tamaño en la pantallas y peso del archivo. Optimización de las imágenes teniendo en cuenta la conexión. Colores de pantallas y en la web. Tiempo de producción. Formatos, compresión y calidad. Fuentes legibilidad y color. Hosting. Dominio. Publicación del sitio. FTP. BIBLIOGRAFÍA Biagi, Shirley (2010) Media impact: an introducción to mass media. Wadsworth, Cengage Learning. Bou Bauzá, G. (1997) El guión multimedia. Madrid. Anaya Multimedia. Hagen, Rebecca; Golombisky, Kim (2010). White Space is not your enemy. Focal Press. Ingo, Walther. (2005). Arte del siglo XX. Taschen. Kristoff R, Satran A. (2002). Diseño Interactivo. Biblioteca profesional de diseño. Madrid. Anaya. Nielsen, Jakob. (2000). Usabilidad. Diseño de sitios Web. Prentice Hall. Puig, Tomás (2009). Del hipertexto al hipermedia. Una aproximación al desarollo de las obras abiertas. Página 3

4 BIBLIOGRAFÍA (Continuación) Rolando, Fernando L. (2001). Arte digital e interactividad. Buenos Aires. Editorial Universidad de Palermo. Vanderthorpe, Christian. (1999). Del papiro al hipertexto. Fondo de Cultura económica. Villalobos, Ray (2010) Exploring Multimedia for designers. Zeldman, Jeffrey. (2011) Web standards. New Riders (3 ed.). Página 4

5 GUÍA DE TRABAJOS PRÁCTICOS (Cada trábajo práctico tendrá su correspondiente ficha, que será entregada con las pautas de dicho trabajo oportunamente, incluyendo fecha y pautas de entrega) TP1 Análisis gráfico de sitios y selección de temática de interés. TP 2 Memoria descriptiva, idea rectora y wireframes. TP 3 Bocetos de pantallas de sitio. TP 4 Producción de la home y pantallas multimedia. TP FINAL I Producción digital de multimedia interactiva con inclusión de video, sonido, animación, interactividad para web y aplicación en móviles. PAUTAS DE PRESENTACIÓN DE ENTREGA GENERALES: Informe, capturas y fundamentación impresas y archivos digitales de proyecto y fuentes en todos los casos. El diseño y presentación de de dicha entrega también es considerado en la nota final de los trabajos prácticos. IMPLEMENTACIÓN: El formato de presentación para las entregas es en hoja A4. La entrega deberá tener un orden de lectura coherente en función del proyecto definido por el alumno. No se aceptarán elementos por separado. Se entregará 1 o 2 paneles A4 montados en algún soporte rígido, a modo de bitácora que deberá contener los puntos que el alumno considere más relevantes de su TP. Página 5

6 TP 01 ANÁLISIS GRÁFICO DE SITIOS Y SELECCIÓN DE TEMÁTICA DE INTERÉS FECHA DE ENTREGA: 12/03/12 DESCRIPCIÓN Y OBJETIVOS DEL TRABAJO PRÁCTICO: 1. Se analizarán los siguientes sitios, fundamentando por escrito y teniendo en cuenta los aspectos vistos en clase. Se sugiere elegir 3 (tres), y ejemplificar los aspectos a analizar Aspectos a analizar: Audiencia Diseño en gral Sistema iconográfico Composición audiovisual Lenguaje estético, Nivel de Accesibilidad (tiempo de carga, fuentes y tamaños, usos de software, carga de imágenes). Identidad (presencia de logotipo, propósito de la empresa, inicio de pagina, legibilidad, manejo de información, contacto); Navegación (menúes, etiquetas, botones, enlaces búsquedas); Contenido (titulares, distribución de contenido, estilo, colores, anuncios, popups, url) Algunas preguntas a modo de orientación para realizar el analisis. Ejemplificar y justificar Cuáles son los objetivos del sitio web? Los contenidos y servicios que ofrece se corresponden con esos objetivos? La estructura general del sitio web está orientada al usuario, al diseño creativo o a la tecnología que se utilizó para el desarrollo de la página? Se proporciona información sobre la protección de los datos de carácter personal que los usuarios deben ingresar a la página web? Usa un único sistema de organización de la información, bien definido y claro? Los enlaces son fácilmente reconocibles como tales? Es predecible la respuesta del sistema antes de hacer clic sobre el enlace? Existen elementos de navegación que orienten al usuario acerca de dónde está y cómo deshacer su navegación? El tipo de fuente, ancho de línea y alineación empleados facilitan la lectura? Es compatible el sitio web con los diferentes navegadores? Se visualiza correctamente con diferentes resoluciones de pantalla? Se ha controlado el peso de la página? Se ha controlado el tiempo de respuesta, o la velocidad del servidor? Página 6