6 - El Guion Multimedia

El guin multimedia
Caterina Ramon Marta Serra

PID_00150918
FUOC PID_00150918
El guin multimedia
Ninguna parte de esta publicacin, incluido el diseo general y la cubierta, puede ser copiada, reproducida, almacenada o transmitida de ninguna forma, ni por ningn medio, sea ste elctrico, qumico, mecnico, ptico, grabacin, fotocopia, o cualquier otro, sin la previa autorizacin escrita de los titulares del copyright.
FUOC PID_00150918
El guin multimedia
ndice
1.
Etapa 1. Proceso de creacin de un producto multimedia...... 1.1. 1.2. 1.3. 1.4. 1.5. 1.6. Fases de la produccin ................................................................ El equipo humano de un proyecto multimedia ......................... Introduccin al guin multimedia ............................................. Consideraciones previas .............................................................. Fases en el proceso de elaboracin del guin ............................. La concepcin del producto multimedia .................................... 1.6.1. 1.6.2. Anlisis, estudio y estrategia ......................................... Ficha del producto .........................................................
5 5 6 9 9 10 11 11 11 13 13 13 15 15 16 17 17 17 18 18 20 20 21 22 23 23 26 26 26 27 27 28 28 28 29 29 30 30 31 31
2.
Etapa 2. Diseo de la interactividad............................................ 2.1. 2.2. 2.3. 2.4. Idea .............................................................................................. Sinopsis ........................................................................................ Diseo de la interactividad ......................................................... La secuencialidad o narracin lineal .......................................... 2.4.1. 2.4.2. 2.4.3. 2.5. 2.6. 2.7. 2.8. Obras de ficcin y juegos .............................................. Enciclopedias y obras de consulta ................................. Productos didcticos ......................................................
Estructuracin de la comunicacin ............................................ La temporalidad .......................................................................... Interactividad e interaccin ........................................................ Reglas en el diseo de la interactividad ..................................... 2.8.1. 2.8.2. Reglas segn Bou ........................................................... Reglas segn Mok ..........................................................
2.9. 3.
La forma del diseo interactivo ..................................................
Etapa 3: Diseo de la navegacin.................................................. 3.1. 3.2. Organizacin de la informacin ................................................. Modelos de organizacin de la informacin .............................. 3.2.1. 3.2.2. 3.2.3. 3.2.4. 3.2.5. 3.2.6. 3.2.7. 3.2.8. 3.2.9. Lineal .............................................................................. Circular ........................................................................... Indexada ......................................................................... Jerrquica ....................................................................... Lineal jerrquica ............................................................ Ramificada ...................................................................... Lineal ramificada ........................................................... Matricial ......................................................................... Paralela ...........................................................................
3.2.10. Concntrica .................................................................... 3.2.11. Reticular ......................................................................... 3.2.12. Contributoria ................................................................. 3.2.13. Mixta ..............................................................................
FUOC PID_00150918
El guin multimedia
3.3. 3.4.
Sistemas de navegacin .............................................................. 3.3.1. 3.4.1. 3.4.2. 3.4.3. Tipos de navegacin ...................................................... Definicin ...................................................................... Elaboracin de diagramas de flujos ............................... Simbologa en los diagramas de flujos .......................... El diagrama de flujos ..................................................................
32 32 33 33 35 35 39 39 39 40 40 41 41 42 42 42 42 43 43 43 43 43 44 44 44 45 45 45 48 50 50 50 51 52 53 56 56 58 58
4.
Etapa 4. El diseo lgico.................................................................. 4.1. 4.2. El diseo lgico ........................................................................... El guin tcnico .......................................................................... 4.2.1. 4.2.2. 4.2.3. 4.2.4. 4.3. 4.3.1. 4.3.2. 4.3.3. 4.3.4. 4.3.5. 4.3.6. 4.3.7. 4.3.8. 4.3.9. Ttulo .............................................................................. Fondo ............................................................................. Zonas sensibles .............................................................. Comportamiento de las zonas sensibles ........................ Textos ............................................................................. Iconos ............................................................................. Secuencias ...................................................................... Animaciones .................................................................. Sonido ............................................................................ Marcadores ..................................................................... Objetivos ........................................................................ Distractores .................................................................... Ejecuciones o rutinas .....................................................
Otros elementos del guin .........................................................
4.3.10. Grupos de tareas ............................................................ 4.3.11. Entrada a una escena ..................................................... 4.3.12. Tareas de fondo ............................................................. 4.4. 4.5. 4.6. 5. Reglas para la escritura del guin ............................................... Ejemplo de diseo lgico ............................................................ Recursos y ejemplos de guin multimedia .................................
Etapa 5. El story-board..................................................................... 5.1. 5.2. 5.3. El story-board multimedia ............................................................ Funciones y ventajas del story-board............................................ Grafo general y grafo exhaustivo ............................................... 5.3.1. 5.3.2. 5.4. 5.5. 5.4.1. 5.5.1. El grafo general .............................................................. El grafo exhaustivo ........................................................ Narrativa de wireframes guiados .................................... Los guiones audiovisuales .............................................
El story-board con wireframes........................................................ Anexos del guin ........................................................................
FUOC PID_00150918
El guin multimedia
1. Etapa 1. Proceso de creacin de un producto multimedia
1.1. Fases de la produccin En el proceso de creacin de un producto multimedia se pueden establecer las siguientes grandes etapas: diseo, produccin y difusin. Cada una de ellas est estructurada en distintas fases, como se muestra en el grfico adjunto.
En la etapa de diseo se definen los objetivos y la estrategia teniendo en cuenta el presupuesto para realizar la aplicacin. Una vez definidos los objetivos y desarrollada la estrategia, ya est encaminada la tarea de generar la aplicacin multimedia. En la fase de concepcin del producto se enmarca el proceso de
FUOC PID_00150918
El guin multimedia
creacin del guin. En cuanto est elaborado el guin y determinado el equipo humano necesario, el plan de trabajo y el material, se programarn las aplicaciones y se proceder a la fase de pruebas (tests y pruebas piloto). Equipohumano: Se debe planificar el equipo humano que se necesitar para la creacin del producto multimedia. Plandetrabajo: Se procede a la divisin del conjunto del trabajo en mdulos o partes detalladas; se seala al responsable y el plazo de tiempo. Equipomaterialnecesario: ordenadores, escner, cmara, software, etc.
Con las pruebas ya realizadas, se programa definitivamente la aplicacin con las pertinentes modificaciones. En la tercera etapa, en la de difusin, se establecer la distribucin del producto y su promocin. 1.2. El equipo humano de un proyecto multimedia Se trata de un equipo interdisciplinar. Las producciones multimedia interactivas de diversa tipologa pueden resultar bastante complejas y, por ello, es imprescindible la participacin coordinada de diferentes profesionales. Hoy en da, raramente se puede concebir una aplicacin desarrollada por una sola persona que tenga la intencin de competir con los productos multimedia que se encuentran en el mercado. Pero, habitualmente, ocurre que una misma persona puede desempear ms de uno de estos perfiles. Jos Luis Orihuela agrupa las funciones del equipo en cuatro grandes reas:
rea Produccin Redaccin Artstica Tcnica Funcin Coordinacin Documentalista y guionista Direccin de arte y diseo grfico Programacin y especialidades (audio, vdeo, animaciones) Bibliografa Orihuela,JosLuis;Santos, MaraLuisa(1999). Introduccin al diseo digital. Concepcin y desarrollo de proyectos de comunicacin interactiva. Madrid: Anaya Multimedia.
En la tabla adjunta se definen las funciones de cada perfil teniendo en cuenta las reas propuestas anteriormente.
Funciones de cada perfil segn el rea rea de produccin
Nota. Estos cuadros estn basados en: Orihuela,JosLuis;Santos,MaraLuisa(1999). Introduccin al diseo digital. Concepcin y desarrollo de proyectos de comunicacin interactiva (pginas 69-74). Madrid: Anaya Multimedia. Vayhan,Tay (1994). Todo el poder de multimedia (pginas 35-49). Osborne, Mxico: McGraw-Hill.
FUOC PID_00150918
El guin multimedia
Perfil Coordinador
Funciones Se responsabiliza del desarrollo total e implementacin del proyecto. Asimismo, tambin asume la responsabilidad del contenido y la estructura del proyecto. Entre sus tareas estn: la administracin, la gestin del equipo humano que desarrollar el proyecto y el liderazgo del equipo; la elaboracin y administracin del presupuesto; la realizacin de los planes de trabajo, horarios, sesiones, etctera y el control del calendario; la relacin con el cliente; la mercadotecnia del proyecto; la gestin de recursos; el control del resultado. Segn la envergadura de la empresa, puede existir este perfil, cuyas funciones son: la gestin administrativa, la mercadotecnia de la empresa, la relacin con los clientes, la elaboracin de presupuestos, la gestin de recursos. Segn la envergadura de la empresa, puede existir este otro perfil, responsable de la produccin de un proyecto en particular, cuyas funciones son: el liderazgo del equipo, el establecimiento del plan de trabajo, el control del calendario, el control del resultado. rea de redaccin
Productor ejecutivo
Director del proyecto
Perfil Documentalista
Funciones Su labor consiste en obtener la informacin necesaria para elaborar el contenido del proyecto. Sus funciones son: la investigacin, la identificacin y seleccin de fuentes, el acceso y la valoracin de informacin, la redaccin de borradores, la revisin y correccin de textos. Se encarga del contenido global del proyecto: estructura el contenido, determina los elementos de diseo que se requieren para apoyar esta estructura y decide los medios ms apropiados de las diferentes partes del contenido. Sus funciones son: Dar estructura al contenido y elaborar la informacin del proyecto en forma de hipertexto: Establecer el sistema de navegacin contemplando todos los posibles trayectos, determinando las rutas del usuario y su retroalimentacin. Definir el sistema de ayuda, las metforas y los mapas de navegacin. Seleccionar los medios ms idneos y considerar los puntos fuertes de cada uno de los media que integran multimedia. Revisar y corregir textos. En proyectos de ficcin interactiva y juegos, el guionista: crea la historia y los personajes, escribe los dilogos, los textos narrativos y expositivos y articula en escenas navegables los universos de ficcin. rea artstica
Guionista
Perfil
Funciones
FUOC PID_00150918
El guin multimedia
Director de arte
Sus funciones son: la definicin de la esttica global, la supervisin del diseo grfico, la coordinacin con especialistas, el control del estilo final. Se encarga del aspecto visual del proyecto, junto con ilustradores, animadores y especialistas en procesamiento de imgenes. Entre sus funciones estn: el diseo de interfaces, la creacin de elementos visuales, la composicin de pantallas. En funcin de la envergadura del proyecto, puede necesitarse este perfil especfico. Se encarga de: crear rutas de navegacin y mapas de contenido; organizar el contenido multimedia, de manera que permita al usuario acceder fcilmente al contenido y moverse cmodamente dentro de la creacin final; que se mantenga la facilidad de uso de navegacin; el uso efectivo de ventanas, fondos, iconos, etc. (resultados stos de su trabajo). Puede ser adems guionista o diseador grfico. rea tcnica Perfil Funciones Usualmente, es un ingeniero de software que integra todos los elementos del proyecto utilizado, un sistema de desarrollo o un lenguaje de programacin. Entre sus funciones estn: la compilacin de la maqueta, la integracin multimedia, la funcionalidad de la navegacin, la operatividad del soporte, la realizacin de pruebas beta. Especialistaenvdeo. Adems de tener experiencia en direccin, edicin de vdeo y saber realizar buenas tomas, ha de trabajar con herramientas para la edicin digital. Es importante que adapte y consiga las tomas de vdeo para la programacin interactiva. Su funcin es la grabacin, la edicin y la postproduccin digital de vdeo. Especialistaenaudio. Disea y produce msica, narraciones explicativas y efectos de sonido. Pueden responsabilizarse tambin de localizar y seleccionar la msica adecuada, grabar, digitalizar y editar material grabado. Tambin deben realizar los clculos pertinentes para optimizar los sonidos y obtener una calidad decente. Su funcin es la composicin musical, la edicin y los efectos de sonido. Otrosespecialistas. Tienen estas funciones: la fotografa y el tratamiento digital de imgenes; la creacin de objetos, entornos y animaciones 2D y 3D; la creacin de entornos de realidad virtual.
Diseador grfico
Diseador de interfaces
Programador multimedia
Especialistas
El diseo de la informacin, diseo interactivo y diseo de los medios son reas crticas para la creacin de cualquier interfaz y debe haber una interrelacin entre ellas.
La colaboracin entre todos los miembros del equipo es la clave para conseguir un proyecto multimedia con xito.
FUOC PID_00150918
El guin multimedia
1.3. Introduccin al guin multimedia Como en un producto secuencial, el guin para una aplicacin multimedia interactiva es un documento clave para su produccin. La elaboracin del guin multimedia se enmarca en la fase de diseo de la aplicacin, de creacin y concepcin de un nuevo producto. La fase de diseo es previa a la fase de produccin.
Actualmente, una aplicacin multimedia interactiva no puede pensarse como una secuencia de pantallas estticas y sin conexin entre ellas, sino que aparece como una aplicacin viva, estructurada de forma conveniente y con interacciones. En una aplicacin multimedia, a diferencia de un cortometraje para televisin, por ejemplo, debe haber interaccin entre el usuario y la mquina. Es importante que en la creacin de un guin multimedia se conjuguen los recursos del lenguaje audiovisual juntamente con los propios de la informtica. 1.4. Consideraciones previas La elaboracin de un guin multimedia, como proceso creativo, no es a priori diferente a la de un guin para un producto audiovisual, pero incluye elementos de lenguaje inexistentes en el guin secuencial: la interactividad y la navegacin, por un lado y por el otro un canal de difusin distinto. Estos son los elementos que hacen diferente el guin multimedia. En el guin para una aplicacin multimedia se incluye a menudo alguna parte ms narrativa que conlleva necesariamente una estructura lineal. Estos fragmentos pueden concebirse como una "porcin" de un guin secuencial, con muchas de sus caractersticas, dentro del conjunto total del guin de la aplicacin multimedia.
FUOC PID_00150918
10
El guin multimedia
Toda aplicacin multimedia debe concebirse sin perder de vista la perspectiva del guin audiovisual. Los elementos propios del guin han de estar presentes en el diseo de toda la aplicacin y en cada pantalla en particular. Se debe pensar y planificar con detalle cada pantalla (texto, fotos, iconos, etc.) y su conjunto. En la conceptualizacin de una aplicacin multimedia deben tenerse en cuenta los siguientes aspectos bsicos:
Hipertexto La organizacin de la informacin y su estructura considerando las posibilidades y caractersticas que ofrece el hipertexto. El diseo de la interactividad (cantidad de interaccin, calidad, capacidad de control por parte del usuario, etc.).
Interactividad
El guin multimedia es un documento que servir para recoger, desarrollar y plasmar todos estos aspectos. Adems, es importante recordar dos consideraciones ms:
Usuario Las aplicaciones multimedia se conciben para ser utilizadas por un tipo concreto de usuario, y, por tanto, deben adaptarse de forma conveniente. A partir de aqu se disear la estructura de navegacin y la interactividad. Se debe prever la incorporacin de recursos tcnicos, que servirn para reforzar el mensaje. Es importante seleccionarlos de forma acertada para lograr que la aplicacin transmita las sensaciones previstas.
Recursos tcnicos
1.5. Fases en el proceso de elaboracin del guin Como ocurra en el guin de un producto audiovisual no se ha establecido una sola forma de presentacin para un guin multimedia. En el mundo profesional, cada guionista, cada equipo de trabajo, cada editorial de ttulos interactivos tiene su propio mtodo. Pero, como ocurre en el campo del audiovisual, se siguen unas pautas para la elaboracin de un guin multimedia ms o menos sistematizado y adaptado a cada uno de los tipos de productos que existen en el mercado. La conceptualizacin de una website de un producto comercial diferir de la de un juego de estrategia en CD-Rom. El desarrollo del guin se deber adaptar de forma conveniente en cada caso. Generalmente, para planificar el proceso global de la aplicacin, las fases que deben tenerse en cuenta son las siguientes:
FUOC PID_00150918
11
El guin multimedia
1.6. La concepcin del producto multimedia
1.6.1. Anlisis, estudio y estrategia Antes de empezar una produccin las empresas multimedia realizan un exhaustivo estudio a partir del cual se toman las decisiones pertinentes de diseo y se deciden la conveniencia de editar o producir el nuevo producto. Tanto si el producto es encargado por un cliente, como si es un titulo propio de una editorial, se tienen que definir los siguientes conceptos: cul es el mensaje que se va a comunicar; a qu publico va dirigido; cul es el objetivo del producto.
1.6.2. Ficha del producto A modo de resumen, en esta primera fase se intenta dar respuesta a estas preguntas que se elaboran en forma de un documento que llamado Ficha del producto, que contiene: 1)Descripcindelaidea: De qu trata el nuevo producto? 2)Necesidad: A qu problema o necesidad queremos responder con el producto? Por ejemplo, la observacin de que en el mercado falta un producto para nios sobre cmo aprender matemticas jugando (Edutaiment).
FUOC PID_00150918
12
El guin multimedia
3)Lameta:Qu queremos conseguir, cul es el beneficio que puede aportar la edicin del ttulo? Podra ser iniciar en el uso del ordenador a los trabajadores de una empresa, apropiarse de un hueco en el mercado, etc. 4)Pblicoobjetivo: Quin es el usuario, quien es el comprador? Este es uno de los apartados ms importantes por los que se debe definir muy bien tanto al comprador, como el usuario real del producto. Por ejemplo, en los productos infantiles el usuario real es un nio pero el comprador es el adulto. 5)Objetivos: En este apartado se establecen los objetivos editoriales: Es un ttulo unitario? Pertenece a una coleccin, a una serie? Hay una fecha de lanzamiento prevista? Etc.
Tratamos de responder a las siguientes preguntas: Cul es el contenido? A quin va dirigido? Cules son los objetivos?
FUOC PID_00150918
13
El guin multimedia
2. Etapa 2. Diseo de la interactividad
2.1. Idea Una vez realizada la primera fase de anlisis y estudio y a partir de las decisiones tomadas respecto a cmo podra ser el producto, cul es su objetivo y cul es su pblico recogidas en la ficha del producto, pasamos a la fase de creacin de guin propiamente dicha. Todo producto empieza con una idea de su creador. La idea es el motivo principal para la realizacin de la aplicacin. Es recomendable que se pueda escribir, describir y concretar en un mximo de dos lneas. Debe ser sencilla y de rpida comprensin para poderla comunicar a una empresa para su realizacin o financiacin, al equipo, al cliente, etc. En algunas aplicaciones interactivas multimedia, como en los juegos, encontramos que en la idea se refleja una estructura narrativa propia de un guin de ficcin de una produccin audiovisual (o literaria), con el esquema tpico de la introduccin o planteamiento, parte central o nudo y final o desenlace, junto con el desarrollo del personaje, el objetivo y el conflicto. En otro tipo de aplicaciones, como las de ndole didctica, la idea puede estar constituida por un objetivo de aprendizaje.
Ejemplo de aplicacin didctica Objetivodidctico: Aprender a redactar. Pblicoobjetivo: Nias y nios de 7 a 9 aos. Idea: Crear un CD-Rom que permita aprender a escribir cartas originales, disear felicitaciones y continuar cuentos de forma muy imaginativa. Cmo: Por medio de un bho muy especial, muy sabio y simptico, que facilitar a los nios la investigacin por las distintas pantallas y propondr ejercicios, actividades, etc. Ejemplos de juegos En Age of Empires el usuario es el gua de una tribu en la edad de piedra y su misin es dominar el mundo creando y conquistando imperios. En la Odisea (la bsqueda de Ulises), el usuario es Heritias, el mejor amigo de Ulises, y su misin es emprender un largo viaje en su busca.
En el caso de una aplicacin de ndole comercial, la idea puede estar constituida por un objetivo de fidelizacin de clientes, aumento de ventas, etc. Generalmente, el trabajo del guionista de una aplicacin multimedia consiste en transmitir el contenido especfico para que se cumpla el objetivo marcado. 2.2. Sinopsis A partir de la idea que se tiene de la aplicacin en concreto se realiza la sinopsis.
FUOC PID_00150918
14
El guin multimedia
La sinopsis es el desarrollo ms amplio de la idea inicial. Para Guillem Bou, "la sinopsis es un texto que responde a la pregunta: En qu consiste esta aplicacin?". En este documento se deben establecer los puntos ms destacables de la aplicacin, destacar lo esencial y ofrecer una idea clara del contenido de la aplicacin o programa. En los productos multimedia narrativos, como los juegos de aventuras, cuentos interactivos, etctera, se crea una estructura dramtica con sus personajes principales y secundarios, con un objetivo y un conflicto. Aunque estas historias no son lineales, se bifurcan, el usuario puede elegir entre varios caminos o ver la historia desde el punto de vista de diferentes personajes; se debe contar de manera narrativa en la sinopsis, de la misma manera que se realiza en un guin cinematogrfico. No slo las obras de ficcin tienen una construccin dramtica, muchos productos (didcticos, informativos, promocionales) crean metforas narrativas que van desde un tipo determinado de interfaz a la caracterizacin de personajes que nos guan a travs del producto multimedia. Estas metforas tambin se explican en forma de sinopsis argumental.
La trampa pap Es un CD-Rom que forma parte de un conjunto de juegos que constituyen una alternativa a los videojuegos. Est pensada para que los nios y las nias, a partir de siete aos, pongan a prueba sus habilidades de observacin, memoria, razonamiento lgico, orientacin, etc. Es una propuesta ldica para que disfruten de todos los alicientes de los juegos de ordenador: puntuaciones, tiempo, superacin de etapas o "pantallas", posibilidad de jugar varios jugadores a la vez, niveles de dificultad, premio al final, etc.
Bibliografa BouBouz,Guillem (1997). El guin multimedia. Madrid: Anaya Multimedia.
Sinopsis: La "trampa pap" empieza cuando los protagonistas, Boris y Noem, sobrevuelan una de las islas pap, en Oceana; el motor del avin empieza a fallar; lo que les obliga a hacer un aterrizaje de emergencia. Boris y Noem caen en una isla muy peligrosa, porque est habitada por piratas que han expulsado a sus habitantes, los paps. Por eso, los indgenas han llenado los bosques de la isla con peligrosas trampas: quieren capturar a los piratas.
FUOC PID_00150918
15
El guin multimedia
Boris y Noem descubren una de las trampas pap en la que hay alguien atrapado en su interior. Su misin ser salvar a este cautivo para evitar que caiga en manos de los piratas o de los miembros de una escuela de supervivencia, an ms peligrosos.
2.3. Diseo de la interactividad Una vez realizada la sinopsis, se procede al diseo de la interactividad, que es una de las fases ms importantes en el guin multimedia. Pensar en cmo se va a relacionar el usuario con la aplicacin es una de las tareas ms difciles del guionista de un producto interactivo. Para Bou en esta fase "se describen con mayor detalle las caractersticas del protagonista de la aplicacin y el modo de interaccin usuario-aplicacin" y "la misin de estas pginas es presentar al lector la idea de la aplicacin, con ms detalle del que se proporcion en la sinopsis, a fin de que se entienda mejor el guin". Segn Bou, su finalidad es: Didctica: Explica con detalle en qu consiste la aplicacin. Persuasiva: Contribuye a "vender" la aplicacin.
Muchos autores definen esta fase como la capacidad que debe tener el guionista para convertirse en usuario imaginario del producto una vez finalizado. No imaginamos todava las pantallas y los enlaces que finalmente tendr el producto, sino el uso que har de ellos el usuario. Por lo que es muy importante tener en cuenta qu tipo de producto vamos a crear y quin es el usuario. Antes de realizar esta fase es necesario conocer las caractersticas principales de cada uno de los productos existentes. Toni Matas i Dalmau, editor de Barcelona Multimedia, propone un modelo de anlisis de productos multimedia basado en cuatro dimensiones: la secuencialidad versus aleatoriedad, la estructuracin o desestructuracin de la comunicacin, la temporalidad versus atemporalidad, y la interactividad versus la pasividad. 2.4. La secuencialidad o narracin lineal Cuando hablamos de secuencialidad nos referimos a aquellas narraciones en que los acontecimientos pasan consecutivamente en un orden inalterable. Como en una novela o en una pelcula, los acontecimientos de una historia se suceden uno detrs de otro segn el orden que ha dispuesto su autor. Cuando es el usuario quien decide en qu orden va a acceder a la informacin y aparentemente no hay un orden establecido por el autor, hablamos de narracin no lineal o acceso aleatorio.
Bibliografa Matas,A. (1997). Productes multimedia: disseny i anlisi conceptual. Artculo electrnico disponible en http://www.raco.cat/ index.php/Bibliodoc/article/ view/56349/ 65771
FUOC PID_00150918
16
El guin multimedia
Cuando creamos un producto multimedia una de las primeras decisiones que debemos tomar es cmo vamos a presentar la informacin: de manera secuencial o de manera aleatoria, y cules son las implicaciones para el usuario de un tipo de presentacin u otra. En un multimedia tememos ambas opciones e incluso opciones mixtas:
Presentarloscontenidosdemanerasecuencial Podemos presentar de manera ordenada los contenidos. Toni Matas dice que la estructura secuencial de la informacin se usa cuando la asimilacin de una unidad de contenido es requisito indispensable para la presentacin de la siguiente. En una pelcula debemos ver las escenas tal y como las ha establecido el autor para tener toda la informacin que necesitamos para entender la historia. Presentarloscontenidosdemaneraaleatoria El usuario tiene la opcin de acceder adonde quiera; puede acceder desde cualquier parte del contenido a cualquier otra cuando l mismo decida. El ejemplo ms caracterstico de este tipo de presentacin es la navegacin en el hipertexto, en el que circulamos mediante enlaces entre los distintos nodos de contenido. En el hipertexto el usuario debe participar activamente y se convierte en lector-autor. l es quien decide crear la secuencia narrativa a su manera: por tanto la ventaja que obtiene es la libertad de accin. Pero hay que ser concientes de que esta ventaja, segn el tipo de producto, se puede convertir en inconveniente y llevar al lector al caos. Presentarloscontenidosdemaneramixta:secuencialyaleatoria Incluso en las obras aparentemente aleatorias, es necesario que el autor piense el recorrido necesario que ha de hacer el lector para la buena asimilacin de la informacin. Toni Matas aconseja que "la combinacin de la aleatoriedad y la secuencialidad ha de ser estudiada para poder conseguir los resultados de transmisin de contenidos". Una forma presentacin u otra tiene unos resultados diferentes segn sea el gnero del producto.
2.4.1. Obras de ficcin y juegos Son por lo general secuenciales; un autor piensa como ser la sucesin de pantallas, las pruebas que el jugador deber superar, cmo se desarrollar la historia que se pretende explicar.
FUOC PID_00150918
17
El guin multimedia
Hay juegos de aventuras (como Myst, creado por Cyan y producido por Broderbund) que son secuenciales y aleatorios a la vez. El usuario puede acceder a diversos lugares, pero, al mismo tiempo, los caminos son planteados de manera secuencial, y para que el usuario pueda avanzar es necesario resolver diversos enigmas. 2.4.2. Enciclopedias y obras de consulta Las enciclopedias son aleatorias; para su buen funcionamiento deben permitir al usuario acceder a cualquier punto de informacin, como a una letra determinada o a una palabra determinada. Pero tambin es frecuente encontrar propuestas secuenciales, como en algunos bloques temticos. 2.4.3. Productos didcticos Los productos didcticos son secuenciales por naturaleza porque en este tipo de productos es necesario asumir unos contenidos antes de pasar a otros; as, por ejemplo, es necesario aprender a sumar y restar antes de aprender a dividir. Pero por otro lado, deben permitir al usuario un acceso aleatorio para, entre otras cosas, repasar un concepto anterior que no ha sido bien asimilado. 2.5. Estructuracin de la comunicacin La estructuracin de la comunicacin, segn Matas, no se refiere a la manera de ordenar el contenido de la informacin, sino a la forma en que se establece la comunicacin entre el usuario y la mquina; es decir, hasta qu punto nuestro producto necesita que el usuario est orientado?
Comunicacinmuyestructurada En una comunicacin muy estructurada el usuario conoce en todo momento las acciones que el producto le permite llevar a cabo mediante mens, estructuras en rbol, un interfaz grfico similar al Windows... Las obras de consulta o productos didcticos son productos altamente estructurados. Comunicacinpocoestructurada Una comunicacin poco estructurada obliga al usuario a explorar el producto. El usuario no esta del todo guiado, y parte del atractivo del producto es precisamente se. De ah que los juegos de aventuras, donde la toma de decisiones del usuario tiene consecuencias diferentes, se caracterizan por este tipo de comunicacin poco estructurada.
De todas manera, en las obras de consulta y en los productos didcticos tambin encontramos formas de comunicacin desestructurada. Por ejemplo, en los que productos contienen juegos, o una enciclopedia o un producto didcti-
FUOC PID_00150918
18
El guin multimedia
co que incluya un apartado de aprendizaje experimental. Otro ejemplo son los simuladores, que incluyen una parte muy estructurada porque son educativos, pero, como pretenden imitar la realidad, incluyen partes desestructuradas. 2.6. La temporalidad Entendemos por temporalidad en un producto interactivo la presencia de un contador de tiempo, explcito o implcito, que provoca que las acciones del usuario y sus consecuencias cambien en el tiempo. Para analizar esta dimensin es necesario distinguir entre los conceptos de vida, historia e inteligencia.
Vida El concepto de "vida" en un programa informtico se aplica cuando ste parece que hace "un esfuerzo por cambiar" para reclamar la atencin del usuario. Es el caso de la animacin de la ayuda de Word, elemento que parece que est vivo porque reacciona aparentemente slo. Historiaeinteligencia Los conceptos de "historia" y de "inteligencia" estn ligados entre s. Muchos productos multimedia guardan el historial de las acciones que realiza el usuario a lo largo del tiempo. Este historial permite al programa adaptarse a las caractersticas de cada usuario, por lo que parece reaccionar con inteligencia. El historial se utiliza a menudo en productos educativos donde el programa guarda el historial de errores del estudiante y genera ejercicios especiales para corregirlos.
2.7. Interactividad e interaccin Los productos multimedia son normalmente productos interactivos, pero no todos tienen el mismo grado de interactividad.
FUOC PID_00150918
19
El guin multimedia
Primergrado El primer grado es el ms simple: aprieto un botn y pasa algo. Todos los programas interactivos incluyen este grado de interactividad. Segundogrado El segundo grado de interactividad se refiere a que los efectos de las acciones del usuario tienen consecuencias en el tiempo, como en el ejemplo del programa de mecanografa. Este segundo grado esta ligado a los conceptos de historia y de inteligencia. Tercergrado El tercer grado es el grado ms sofisticado de interactividad. Lo encontramos cuando las acciones del usuario transcienden al uso del producto. As ocurre cuando la aplicacin obliga al usuario a realizar acciones que van ms all de las comunes en un producto multimedia: coger un atlas para resolver un enigma, conectarse a Internet para participar en un foro o para recoger una informacin, etc.
Cada grado de interactividad tiene unas repercusiones diferentes en el usuario. Mientras el primer grado implica una actitud pasiva, el segundo grado obliga al usuario a pensar sus acciones antes de actuar. El tercer grado requiere una actitud activa por parte del usuario. Laura Solanilles en su anlisis de las webs de museo establece distintos niveles de interactividad partiendo de una distincin entre interactividad e interaccin. La interactividad es entendida como una actividad de dilogo entre el usuario y la mquina mediante el programa. En cambio, la interaccin es la accin recproca que se puede establecer entre el emisor y el receptor. As, podemos ver diferentes niveles de interactividad segn la relacin que se instaure entre el emisor y el receptor.
FUOC PID_00150918
20
El guin multimedia
Nivel1 El usuario puede contactar con los responsables de la web mediante el correo electrnico, por ejemplo. La interaccin no es controlada por el emisor, excepto en la posibilidad de responder o no al usuario. Nivel2 El usuario tiene la posibilidad de participar en una actividad previamente programada por el emisor. El emisor determina lo que puede o no puede hacer el usuario (un juego en lnea). Nivel3 El usuario puede generar contenidos de forma controlada por los responsables de la web (foros de opinin). Nivel4 El usuario pude ser coautor de la web y modificar o ampliar la informacin ofrecida previamente por el emisor.
2.8. Reglas en el diseo de la interactividad Para realizar el diseo de la interactividad de un producto multimedia se pueden tener en cuenta una serie reglas genricas. En este apartado trataremos las que proponen dos autores: Bou y Mok. 2.8.1. Reglas segn Bou Bou recomienda que "siempre que pueda haber interaccin debe haberla". Pero cada interaccin del usuario con la aplicacin debe estar cuidadosamente planificada. 1) La interaccin tiene la funcin de reforzar el mensaje. Debe haber un motivo para cada intervencin. 2) Deben evitarse perodos excesivamente prolongados en los que el usuario no intervenga (as, la lectura de textos extensos en pantalla). 3) La interaccin implica participacin activa, no una repeticin de gestos. Toda interaccin implica una decisin entre alternativas. Pulsar "Intro" para pasar de una pantalla a otra no puede considerarse interactividad.
Bibliografa BouBouz,Guillem (1997). El guin multimedia. Madrid: Anaya.
FUOC PID_00150918
21
El guin multimedia
4) No recordar al usuario que no puede interactuar. Es frustrante para el usuario pulsar sobre un sitio en el que crea que va a pasar algo y no pase nada (bien porque aquel botn est desactivado por mantenimiento, bien porque aparezca en la pantalla como una zona aparentemente sensible y en realidad no lo sea). 5) La interaccin no se limita al esquema usuario-mquina. Tambin forma parte de la interaccin de una aplicacin la previsin de que varias personas puedan participar en ella simultneamente. 6) La interaccin permite obtener un registro de datos descriptivos de la conducta del usuario. Bou recomienda lo siguiente:
"Adopte la costumbre de imaginarse a s mismo dialogando con el usuario cuando disee un hipertexto. Si se esfuerza en respetar el enunciado anterior evitar los largos monlogos textuales disfrazados de texto interactivo".
2.8.2. Reglas segn Mok Segn Mok, hay nueve reglas que miden la utilidad y el xito de un producto multimedia interactivo: 1)Consistencia. Los elementos han de tener una apariencia uniforme. 2)Predecible. El diseo debe ser intuitivo y predecible. 3)Progresin. Todo debe de progresar de simple a complejo. La complejidad gratuita provoca disminucin del inters y de la participacin por parte del usuario. 4)Visibilidad. Los elementos funcionales deben ser visibles y su funcin, aparente. 5)Transparencia. El usuario tendra que olvidarse de que est trabajando con un ordenador y concentrarse en la tarea del momento. 6)Retroalimentacin. Cada accin del usuario debera tener un efecto obvio e inmediato. 7)Modosdeoperacin. Existen tres modos de operacin principales: Mododecomando: Decir al sistema que haga algo, que busque una palabra, que vaya a una seccin. Mododemanipulacin: Manipular objetos, simular.
Bibliografa Mok,Clement (1998). Designing Business. Adobe Press.
FUOC PID_00150918
22
El guin multimedia
Mododegrabacin: Introducir datos, anotaciones, etc.
8)Velocidad. El usuario tendra que ser capaz de poder controlar la velocidad con la que se mueve. 9)Adecuacin. El diseo de la interfaz debera acomodarse a los usuarios. 2.9. La forma del diseo interactivo Cuando hemos de plantear el diseo interactivo de un producto multimedia debemos describir la manera en que el usuario se relacionar con el programa, es decir, qu elementos vamos a incluir en nuestro programa para que el usuario se pueda relacionar con l. En esta fase se recomienda valorar las diversas opciones que tenemos a partir del gnero del producto.
En el diseo interactivo pensamos cmo presentamos los contenidos, cmo se establece la comunicacin con el usuario, qu elementos del uso del tiempo vamos a tener en cuenta, y cmo se materializa todo ello.
El diseo interactivo se escribe de manera narrativa, incluye todos estos elementos y define cules son las cosas que encontrar el usuario cuando entre en nuestro CD-Rom o web.
Redaccin de un diseo interactivo Como ejemplo de redaccin de un diseo interactivo de un juego est el siguiente fragmento: La aplicacin consiste en un juego en el que se establecen diversos grados de dificultad. Se va a guardar el historial de cada uno de los participantes. En cada grado de dificultad hay cinco etapas, compuestas por tres pruebas, que el usuario debe superar. Si las supera, se sumarn puntos en un contador. Si no las supera, se restarn. Los juegos se dividen en varias pruebas de preguntas y respuestas sobre diversos campos de conocimiento. El usuario cuando entre en la aplicacin encontrar a un personaje animado que le ayudar con pistas sobre cada una de las pruebas, etc. Visitas recomendadas Recursos y ejemplos de diseo interactivo: http://www.uned.es/ntedu/espanol/master/primero/modulos/guion-multimedia/elementos-dinamicos.htm http://arantxa.ii.uam.es/~castells/publications/interaccion00.pdf http://jlori.blogia.com/2004/102201-ejemplos-de-interactividad.php http://www.javeriana.edu.co/cursos/ntae/DisenoInteractivo.htm http://www.javeriana.edu.co/cursos/ntae/documentos/diseppt0310.ppt
FUOC PID_00150918
23
El guin multimedia
3. Etapa 3: Diseo de la navegacin
3.1. Organizacin de la informacin Una vez tenemos el diseo de la interactividad, procedemos al diseo de la navegacin:
Pensar y disear cmo se va a mover el usuario por la aplicacin, cmo va a acceder a la informacin.
El acceso a la informacin y las diferentes opciones posibles que tiene el usuario (mirar, escuchar, hacer clic, mover el ratn, teclear un mensaje, etc.) deben estructurarse de forma adecuada. Si una aplicacin est bien estructurada, se facilitar que el usuario pronto sepa navegar por ella y se sienta cmodo. Por tanto, es importante pensar cmo se organizar la informacin cuando se disea una aplicacin multimedia. En el grfico adjunto se muestran una serie de fases coherentes para organizar y estructurar la informacin.
FUOC PID_00150918
24
El guin multimedia
Clasificacindelainformacinporcategoras El objetivo de esta fase es generar una lista amplia de las posibles categoras del contenido de la aplicacin.
Ejemplo de categoras Estas categoras pueden establecerse por tema o asunto, ubicacin, secuencia narrativa...
Agrupacintemticayredefinicindelosgrupostemticos A continuacin, una vez generada la lista principal de categoras, se procede a agruparlas temticamente. Estas metacategoras se convertirn en los temas de nivel superior que los usuarios vern al acceder a la aplicacin.
FUOC PID_00150918
25
El guin multimedia
Ejemplo de metacategora En una pgina web personal, dentro de la metacategora de tiempo libre, podran situarse estas categoras: vacaciones, entretenimientos, etc.
Consiste bsicamente en colocar todos los temas o categoras de la lista principal en diferentes grupos temticos. Probablemente, habr temas que podrn pertenecer a dos categoras o ms, mientras que otros no se podrn colocar fcilmente. Es importante asegurarse de que estas categoras temticas estn bien definidas y se diferencian unas de las otras. Fragmentacindelainformacinen''trozos'',bloquesounidadespequeas En esta fase deben concretarse los contenidos de informacin en bloques de informacin relativamente pequeos dentro de cada tema. Jerarquizacinyadjudicacindeprioridades Establecer la jerarqua de importancia de cada tema determinar en cierto modo la estructura de navegacin de la aplicacin. En primer lugar, deben definirse las prioridades, qu conceptos son ms importantes y ms generales, y cules son ms especficos u opcionales. Establecimientoderelaciones A continuacin, se establecer qu relaciones pueden fijarse entre los distintos temas. Organizacindentrodeunaestructura Probablemente, la organizacin de la informacin no ser secuencial. Por esta razn es preciso disear uno o ms caminos especficos. La estructura de la organizacin debe resultar coherente para que el usuario se encuentre cmodo y navegue fcilmente por la aplicacin. La manera de organizar el contenido determinar la mayor o menor facilidad para llegar a todos los contenidos. Realizacindeldiagramadeflujo La estructura de la fase anterior es el principio del diagrama de flujo de la aplicacin.
Bibliografa Kristof,Ray;Satran,Amy (1998). Diseo interactivo (pgs. 32-37). Madrid: Anaya Multimedia.
FUOC PID_00150918
26
El guin multimedia
3.2. Modelos de organizacin de la informacin Existen distintos modelos para organizar la informacin en la aplicacin interactiva. A continuacin se tratarn los siguientes: lineal, circular, indexada, jerrquica, lineal jerrquica, ramificada, lineal ramificada, matricial, paralela, concntrica, reticular, contributoria, mixta.
Web Style Guide http:// www.webstyleguide.com/ index.html?/sites/ site_design.html
3.2.1. Lineal Es la ms simple y es propia del soporte del papel tradicional. Representa una secuencia nica. El usuario no tiene ms opcin que avanzar o retroceder. Es til cuando se precisa que el navegante siga un itinerario fijo. Si bien este modelo no proporciona mucha interactividad al usuario, garantiza el acceso a la informacin que se considera importante. Se suele utilizar en tutoriales de formacin o en visitas guiadas en aplicaciones informticas. Tambin en las secuencias iniciales de los juegos interactivos donde se realiza una exposicin y planteamiento de objetivos al usuario, o bien en una presentacin inicial de un producto.
3.2.2. Circular A diferencia de la estructura lineal, que tiene un principio y un final, en la estructura lineal el camino es fijo y nico, pero sin inicio ni fin.
FUOC PID_00150918
27
El guin multimedia
3.2.3. Indexada Esta estructura ofrece un men de opciones que llevan a una respuesta, y, despus, de nuevo regresa otra vez al men.
3.2.4. Jerrquica Consiste en organizar el flujo de la aplicacin bajo la estructura tpica de rbol, donde la raz suele actuar como bienvenida y men para acceder a las distintas secciones. Es un modelo clsico de organizacin temtica de la informacin en el que se refleja el orden que va de lo general a lo particular y de la dependencia de unos conceptos respecto a otros. Esta estructura es tpica de las aplicaciones educativas y de los buscadores temticos de la web (por ejemplo, Yahoo).
FUOC PID_00150918
28
El guin multimedia
3.2.5. Lineal jerrquica Esta estructura es una solucin mixta a partir de las estructuras lineal y jerrquica. Permite navegar por un contenido organizado de forma jerrquica, pero tambin permite una navegacin lineal. Tambin se utiliza en ciertos tutoriales, sobre todo en formato web.
3.2.6. Ramificada Este tipo de estructura consiste en un men de opciones que llevan al siguiente suceso, y ste lleva de nuevo al men hasta acabar o volver al men original. Representa una trayectoria de navegacin en la que se han incluido nodos subordinados para ofrecer mayor interactividad al usuario. La estructura ramificada puede darse en los cuentos infantiles interactivos en los que la historia se organiza de manera lineal y obliga al usuario a una lectura secuencial, a la vez que se ampla la interactividad incorporando, como explica Orihuela, "las dimensiones ldicas en los nodos subordinados".
Bibliografa Orihuela,JosLuis;Santos, MaraLuisa (1999). Introduccin al diseo digital. Concepcin y desarrollo de proyectos de comunicacin interactiva. Madrid: Anaya.
3.2.7. Lineal ramificada Esta estructura consta de una secuencia principal que no vara con ramas ocasionales que retornan a la secuencia principal.
FUOC PID_00150918
29
El guin multimedia
3.2.8. Matricial Esta estructura forma una especie de matriz. En este caso, al seleccionar un elemento se activan una serie de opciones que estn relacionadas. Esta estructura puede ser difcil de comprender si el usuario no conoce las relaciones entre los distintos elementos, entre las distintas categoras de informacin.
3.2.9. Paralela En esta estructura se representan una serie de secuencias lineales en las que es posible: la navegacin entre ellas, el desplazamiento entre los nodos de un mismo nivel.
Este modelo puede ser de utilidad en ficciones interactivas. Permite organizar diferentes acciones o puntos de vista de una historia que se desarrollan al mismo tiempo. As, el usuario podra seleccionar en cada secuencia los puntos de vista de diferentes personajes que intervienen en la historia.
FUOC PID_00150918
30
El guin multimedia
3.2.10. Concntrica Este modelo parte de un nodo de entrada a partir del cual se organizan una serie de secuencias lineales. A diferencia de la estructura paralela, el modelo de estructura concntrica no permite la navegacin entre los nodos de un mismo nivel. Un ejemplo de estructura concntrica podra ser un juego o ficcin interactiva en el que se propone al usuario diferentes tareas u objetivos como condicin necesaria para pasar al nivel superior.
3.2.11. Reticular Esta estructura es una organizacin en la que en apariencia no existe un itinerario de navegacin predefinido, y, por tanto, permite el mximo grado de flexibilidad para el usuario en la navegacin. Es una de las estructuras ms laboriosas, ya que el guionista debe prever todos los flujos posibles.
FUOC PID_00150918
31
El guin multimedia
3.2.12. Contributoria En este modelo de estructura, llamada contributoria, el usuario puede aadir sucesos que despus constituirn opciones para los usuarios siguientes.
Bibliografa Wilson,Stephen (1994). "The aesthetics and practice of designing interactive computer events". En: Multimedia '94. New York: ACM.
3.2.13. Mixta La estructura mixta es aquella que combina dos o ms modelos de estructura. Estas estructuras deben aprovechar las ventajas de cada uno. La estructura mixta se da en la mayora de aplicaciones interactivas.
FUOC PID_00150918
32
El guin multimedia
3.3. Sistemas de navegacin Tal como comenta Orihuela,

"la navegacin que permite los interactivos se disea mediante las diversas estructuras hipertextuales y el variado sentido de los enlaces, y se orienta mediante el recurso a las metforas, en particular a los mapas de orientacin y navegacin y a los sistemas de ayuda." Bibliografa Orihuela,JosLus;Santos, MaraLuisa(1999). Introduccin al diseo digital. Concepcin y desarrollo de proyectos de comunicacin interactiva (pg 42). Madrid: Anaya.
Por tanto, en el diseo de la navegacin deben tenerse en cuenta: el modelo de estructura de la informacin en hipertexto o hipermedia, las metforas, los sistemas de ayuda, los mapas (de orientacin y de navegacin).
3.3.1. Tipos de navegacin Bsicamente, los sistemas de navegacin se pueden clasificar en tres tipos: 1)Navegacincerrada Se entiende como navegacin cerrada aquella en la que el usuario slo puede ascender o descender en la estructura de niveles que se ha creado. Este tipo de navegacin precisa de una estructura jerrquica. La ventaja evidente es la facilidad de navegacin que tiene el usuario; por el contrario, la sensacin de falta de libertad de movimiento tambin puede ser ms patente. 2)Navegacinabierta En este tipo de navegacin el usuario marca su propio itinerario sin un orden prefijado. Es el usuario quien salta de un punto de la aplicacin a otro. En este caso la estructura puede quedar establecida en forma de red. 3)Navegacinmixta En este tipo de navegacin existe una estructura de mens que condiciona la navegacin lineal, pero a su vez existe la posibilidad de variar relativamente la navegacin y generar una estructura lineal pero con jerarquas determinadas, con lo que se permite al usuario salir de la lnea de navegacin establecida en los mens para pasar de un bloque o seccin a otro. Otra clasificacin, muy simple, de navegacin es la siguiente: 1)Navegacininterna
FUOC PID_00150918
33
El guin multimedia
La navegacin interna se refiere a la navegacin dentro de nuestra propia aplicacin (por ejemplo, por nuestra website). 2)Navegacinexterna En la navegacin externa, en cambio, el usuario sale de la aplicacin, mediante enlaces o links y puede visitar webs externas. Se recomienda que las relaciones con otras pginas externas sean complementarias de la informacin proporcionada en nuestra aplicacin. 3.4. El diagrama de flujos
"Process improvement starts with an understanding of the process, and flowcharting is the first step towards process understanding". Phil Cohen, HCI Consulting.
3.4.1. Definicin El diagrama de flujos de una aplicacin interactiva es un esquema visual en el que se plasma el contenido, la estructura, organizacin y el acceso de la aplicacin. Debe reflejar el diseo de todos los posibles flujos, caminos o itinerarios que se puedan generar en la aplicacin. Kristof define as un diagrama de flujo:
"es sencillamente un esbozo presentado como diagrama, con lneas que muestran las rutas de acceso entre sus partes". Bibliografa Kristof,Ray;Satran,Amy (1998). Diseo interactivo. Madrid: Anaya.
En el diagrama de flujos debe verse cmo se relacionan las diferentes partes del proyecto unas con otras y sirve para ver las diferentes posibilidades de navegacin de los usuarios con la interfaz del proyecto.
"El diagrama de flujo ideal es una especificacin clara y fcil de seguir de las categoras temticas, los niveles y los vnculos del proyecto."
FUOC PID_00150918
34
El guin multimedia
Ejemplo de diagrama de flujo
Este es un ejemplo de una website ficticia muy sencilla. En la primera pgina se accedera a un men con cuatro opciones (gimnasio, aerbic, musculacin y salud). stas seran las principales categoras temticas. Dentro de cada una, habra una serie de categoras secundarias. Por ejemplo, en el gimnasio la localizacin, las instalaciones, las actividades, etc. Desde aqu se podra acceder a las dos actividades de este gimnasio: aerbic y musculacin. Y desde cada actividad podra accederse al apartado de beneficios mdicos (dentro de salud). Una versin ms ampliada de este diagrama podra mostrar todas estas categoras secundarias en lugar de presentarlas slo de forma apilada.
Ventajas El diagrama de flujos plasma el contenido: la estructura, la organizacin y el acceso de la aplicacin. Adems, permite condensar la informacin y representarla de forma visual. Bsicamente, las principales ventajas son: 1) Permite ver las distintas rutas de acceso que tendr el pblico. Generalmente, en una aplicacin interactiva se pretende que los contenidos sean accesibles de forma fcil y comprensible para el usuario. El diagrama de flujo ayuda a planearlos de forma conveniente. 2) Permite tener una visin clara del conjunto de la aplicacin, y esto es muy til para todo el equipo que participa en el proyecto. Por esta razn, el diagrama de flujo facilita el proceso de diseo de la aplicacin y, muchas veces, permite reducir tiempo y coste de produccin. Adems permite detectar errores posibles (links que no funcionan, etc.).
Bibliografa Kristof,Ray;Satran,Amy (1998). Diseo interactivo. Madrid: Anaya.
FUOC PID_00150918
35
El guin multimedia
3.4.2. Elaboracin de diagramas de flujos Existen diversas formas de representar los flujos de una aplicacin interactiva; se suelen utilizar sistemas adoptados y compartidos con otras disciplinas, como la informtica de gestin o el control de eventos, que pueden precisar una campaa electoral o de relaciones pblicas. El resultado final de los flujos de la aplicacin puede diferir del inicialmente ideado. Esto es completamente lgico, ya que durante el proceso de produccin o incluso en las pruebas pueden surgir alternativas mejores a las inicialmente previstas. Como herramienta o software para dibujar flujos de datos, existen varios especficos como el Inspiration, SmartDraw, Flowcharter, Igrafx. Procesadores de texto muy conocidos, como Microsoft Word, tambin incorporan en su barra de herramientas la de dibujo, con una librera de autoformas que incluye las especificas del diagrama de flujos.
Recomendaciones para elaborar diagramas de flujos Elegir nombres significativos. Numerar los procesos. Incluir verbos activos y el objeto. Evitar verbos del tipo: hacer, manejar, procesar. Evitar diagramas de flujo complejos. Llegar a ser comprensibles, digeribles y agradables a la vista. Los flujos de datos se pueden descomponer en la "explosin" del proceso en un DFD hijo. Evitar en lo posible abreviaturas.
Es importante precisar que, siempre que realicemos un diagrama de flujos, se debera acompaar dicha diagramacin con la leyenda correspondiente y especificar el sentido de todos los iconos utilizados. 3.4.3. Simbologa en los diagramas de flujos Como regla general, la simbologa que se utiliza en los diagramas de flujos debe ser simple y de rpida comprensin.
FUOC PID_00150918
36
El guin multimedia
En funcin del tipo de diagrama de flujo (de un proceso comercial, de un flujo de datos, de una asignacin de procesos, etc.) pueden utilizarse especficamente unos smbolos u otros. Incluso algunas empresas utilizan su propia simbologa. A continuacin se detallan los smbolos ms generalizados de los diagramas de flujo, que pueden ser de utilidad para crear algunos de ellos en las aplicaciones multimedia. Inicioyfin El smbolo que se utiliza para indicar el inicio o el fin de una aplicacin suele ser uno de los dos:
Contenidotextualogrfico Para indicar el contenido principal (ya sea textual o grfico) de las pantallas puede utilizarse el rectngulo (normalmente simboliza un proceso). Para complementar el contenido, para una explicacin, etctera puede utilizarse el rectngulo (inacabado por la parte inferior) que simboliza un documento.
Decisin Para simbolizar una decisin que tiene que tomar el usuario de la aplicacin se utiliza el siguiente smbolo, con las lneas conectoras pertinentes, en funcin de las respuestas.
FUOC PID_00150918
37
El guin multimedia
Conector Para marcar que desde un punto concreto se accede a otra pgina se utiliza este smbolo, el conector y se especifica un nmero en l. Este nmero ser el que se usar despus para seguir el camino marcado.
Ejemplo 1
http://www.mcli.dist.maricopa.edu/authoring/studio/guidebook/images/flow_final.gif
Ejemplo2 El diagrama de flujo representa este texto:
FUOC PID_00150918
38
El guin multimedia
"Dial 0 then your friend's number. You will hear a tone. If you have a calling card number, dial your home phone number and the PIN number. If you don't have a calling card number, first dial that 800 number (the one they always advertize on TV). When the computer voice asks you to say your name, say your name. Then wait for your friend to answer. If you have a calling card number, you can talk to your friend's answering machine. If you don't have a calling card number, you can't, so just hang up".
Recursos en Internet Ms informacin sobre diagramas de flujos: http://es.wikipedia.org/wiki/Diagrama_de_flujo http://www.network-press.org/?diagramas_flujo http://www.mis-algoritmos.com/aprenda-a-crear-diagramas-de-flujo http://www.elticus.com/?contenido=19 Ms ejemplos de diagramas: http://www.mis-algoritmos.com/ejemplos/diagramas-flujo.htm Programas para hacer diagramas: FreeDFD es un editor e intrprete de diagramas de flujo. http://wiki.freaks-unidos.net/freedfd/
FUOC PID_00150918
39
El guin multimedia
4. Etapa 4. El diseo lgico
4.1. El diseo lgico En el proceso de elaboracin de un guin multimedia, despus de hacer el diseo de la navegacin con su correspondiente diagrama de flujo, se procede a la realizacin del diseo lgico. El diseo lgico es el guin detallado clic a clic. En l se debe explicar todo lo que ocurre en la aplicacin paso a paso. Se escribe mediante una descripcin textual de la idea argumental de cada una de las escenas y a continuacin se describe cmo debe ser cada una de las pantallas, qu elementos de interactividad tiene y cmo son (si hay texto, imagen, sonido, cmo aparecen en pantalla, qu puede hacer o no hacer el usuario...). Es decir, se detallan todos y cada uno de los elementos que intervienen en cada una de las pantallas de la aplicacin. Este documento se suele redactar igual que un guin literario. Y se utiliza para realizar el diseo grfico y, posteriormente, la aplicacin informtica. Este apartado de diseo lgico contiene tambin el guin tcnico de la aplicacin. 4.2. El guin tcnico El guin tcnico de un producto multimedia, de la misma manera que el guin tcnico de un producto audiovisual, escapa de la responsabilidad del guionista y entra en la del programador de la aplicacin. Pero para que ambos profesionales se puedan entender y no quepan dudas sobre la pretensin del guionista se elabora un documento con un lenguaje a caballo entre el vocabulario del guionista y el del informtico. En el caso un producto multimedia no existe una metodologa nica para realizar un guin tcnico. En muchas empresas multimedia, por ejemplo, no trabajan con guiones muy extensos, sino que solamente plasman la estructura con un diagrama de flujos. Pero a medida que el equipo de trabajo crece (y tambin a medida que el proyecto es ms complejo) es imprescindible que haya un guin bien establecido, manejable y fcilmente inteligible.
FUOC PID_00150918
40
El guin multimedia
A continuacin se explica un ejemplo de realizacin de guin recogido por Guillem Bou en su libro El guin multimedia. ste es un mtodo que puede servir de ejemplo para la escritura de un guin multimedia, aunque no es el nico. Guillem Bou propone un mtodo de escritura de guiones basado en una serie de palabras clave; tiene como propsito que todos los miembros de un equipo de produccin multimedia puedan entenderse entre s. Este mtodo es muy til para escribir el guin tcnico de la aplicacin. En el diseo lgico el guionista debe tener claro lo que ocurre en la aplicacin, y ha de intentar plasmarlo de manera sencilla; tambin han de quedar claras las ideas de lo que ocurrir en la aplicacin. Los conceptos ms importantes que recoge el mtodo de Bou son los siguientes: ttulo, fondo, zonas sensibles, comportamiento de las zonas sensibles.
4.2.1. Ttulo Debemos definir cada una de las escenas con un ttulo, el cual est compuesto por un nmero de escena y un nombre.
Ejemplo Escena 1. "Playa".
4.2.2. Fondo Cada escena se define por un fondo. Cuando habla de fondo, Bou se refiere a una fotografa o pantalla dibujada que sirve de imagen de base para una escena. Este fondo se escribe en el guin despus del ttulo de la escena y se seala con el nombre de BMP (bitmaps) que es la extensin habitual de los ficheros de imagen de Windows. A continuacin, ponemos el nombre del fondo. Si este fondo ya est diseado, se seala en el guin con el nombre con el que hemos guardado el archivo, seguido de la extensin del formato grfico: PCX, TIF, CIF, BMP...
Ejemplo BMP: "Arena.tif"
FUOC PID_00150918
41
El guin multimedia
4.2.3. Zonas sensibles Las zonas sensibles son aquellas regiones de la pantalla que reaccionan al hacer clic o al paso del ratn sobre ellas. En el guin se hace un inventario de cules son las zonas sensibles. Se utilizan las siguientes palabras clave: RAT:(abreviatura de "ratn"). Indica una zona sensible que reacciona a las rdenes del ratn. ROL: (abreviatura del ingls "roller"). Indica un rea o zona que reacciona cuando el ratn pasa por encima. CLIC: Indica que la zona reacciona cuando se hace clic sobre ella. DCLIC: Indica que una zona reacciona cuando se hace doble clic sobre ella. 4.2.4. Comportamiento de las zonas sensibles La respuesta de cada una de las zonas sensibles se llama comportamiento. La respuesta que da una zona sensible al usuario tal vez no sea siempre la misma. Bou seala cinco tipos de comportamiento de las zonas sensibles: 1)Comportamientoregular: Sucede cuando una zona sensible repite siempre la misma respuesta. No se seala de ninguna forma especial en el guin. 2)Comportamientodeunarespuesta: Se refiere a las zonas que se comportan de una manera concreta la primera vez que se hace clic sobre ellas, pero luego dejan de ser de comportamiento regular. Se sealizan en el guin con el smbolo "". Se escribe a continuacin o en un anexo cmo son los otros comportamientos. 3)Comportamientoydesconexin: Son zonas que, despus de la primera respuesta, dejan de dar respuesta alguna; la zona se desconecta. Este tipo de comportamiento se seala en el guin con el siguiente smbolo "-". Este smbolo tambin se utiliza en el guin para indicar que alguna cosa deja de actuar. Por ejemplo, en la rutina de entrada a una escena (ver rutinas de entrada), si aparece este smbolo, indicar que la segunda vez que el usuario entre en la escena no se ejecutar la rutina. 4)Comportamientoparadiferentesejecuciones: Es el caso de una zona sensible que se comporta de diferente manera segn el nmero de veces que el usuario acte sobre ella. As ocurre en una zona que reacciona al tercer intento del usuario. Para indicar en el guin el nmero de acciones que son necesarias por parte del usuario con el fin de que esta zona reaccione, se utiliza el smbolo "N"; a continuacin se especifica el tipo de comportamiento.
FUOC PID_00150918
42
El guin multimedia
5)Comportamientoporcondiciones: Sucede en las zonas que se comportan de una determinada manera cuando se han cumplido ciertos objetivos. Se anotan con la letra "C" normalmente seguida de la condicin. 4.3. Otros elementos del guin A continuacin de cada uno de los epgrafes que se utilizan para nombrar las zonas sensibles se seala el elemento concreto que aparece con la reaccin a cada uno de los movimientos del ratn. Para ello, Bou propone ms trminos que nos ayudan a sistematizar el vocabulario del guin. 4.3.1. Textos Son las informaciones escritas que aparecen en la escena; vienen por lo general enmarcadas en un recuadro. Sirven para indicar en el guin que aparece un texto; se usa la palabra TXT. Existen ms opciones para indicar textos especiales: Etiquetas: Son los textos que aparecen cuando el ratn pasa por encima de una zona sensible y desaparecen cuando el usuario mueve el ratn a otra zona de la pantalla. La funcin de una etiqueta es identificar un objeto y avisar al usuario de que hay una zona sensible. Se indican con la palabra ETI. Bocadillos: Bocadillo es un trmino que procede del cmic. Son textos que aparecen dentro de un recuadro de puntas redondas o una elipsis con una flecha que indica el personaje que est hablando. Se sealan con la palabra BOC; entre parntesis se indica el personaje que esta hablando. Si no se indica lo contrario, los textos desaparecen cuando el usuario hace clic para indicar que lo ha ledo. En algunas ocasiones los textos desaparecen al cabo de un cierto tiempo; si es as, se debe especificar en el guin. 4.3.2. Iconos Son figuras o imgenes que se superponen sobre un fondo. Estas imgenes suelen ser temporales, aparecen y despus desaparecen. Se sealan en el guin con la palabra ICN. 4.3.3. Secuencias El autor entiende por secuencias el conjunto de iconos mviles, es decir, una familia de iconos animados. stos se sealan en el guin con la palabra SEC.
FUOC PID_00150918
43
El guin multimedia
4.3.4. Animaciones Las animaciones son las tramas de vdeo tanto si provienen de la digitalizacin de una seal externa, como si han sido generadas con un programa de animacin por ordenador. La principal diferencia entre la secuencia y la animacin es que en el caso del objeto animado ste se integra en el fondo, es decir, su propio fondo es transparente; por este motivo se ve el fondo de la escena. En cambio, las animaciones ocupan una zona rectangular de la pantalla. Las animaciones se sealan en el guin con la palabra FLI (el formato clsico en animacin por ordenador). Un FLI o bien ocupa toda la pantalla, o bien ocupa una parte. Si ocupa una parte de la pantalla se indica en el guin con una P (parcial); si ocupa toda la pantalla, se seala con una T (total). Si la animacin lleva un sonido incorporado, entonces se escribe la palabra AVIen lugar de FLI, por ser el formato comn en este tipo de datos. 4.3.5. Sonido El sonido se indica en el guin con la palabra WAV (formato tpico de sonido) y se especifica en el guin si los sonidos terminan cuando el usuario realiza una accin; por ejemplo, cambiar de escena, si la aplicacin deja que acaben o si han de volver a empezar una vez acabados. 4.3.6. Marcadores Son los indicadores de los puntos (si es que la aplicacin los utiliza) que tiene el usuario (as, en un juego). En el guin se escriben con la palabra SCO (del ingls score). Si existen varios jugadores con varios marcadores, se especifican con una etiqueta o con un nombre para diferenciarlos. 4.3.7. Objetivos Los objetivos para Bou son elementos concretos que el usuario debe descubrir o alcanzar. Se escriben en el guin con el smbolo "$" seguido de un nmero o un nombre. 4.3.8. Distractores Los distractores son zonas sensibles que sirven para distraer al usuario; en los juegos, por ejemplo, no son zonas que contengan ningn objetivo que se haya de conseguir por parte del usuario.
FUOC PID_00150918
44
El guin multimedia
4.3.9. Ejecuciones o rutinas Son fragmentos del cdigo informtico, hechos a media, que insertan los programadores entre el flujo de la aplicacin, es decir, trozos de programa que el guionista describe y que el equipo informtico incluye en el lugar indicado de la aplicacin. A modo de ejemplo, Bou manifiesta que si en un lugar de la aplicacin el usuario ha de resolver un crucigrama, el equipo informtico lo programa siguiendo las indicaciones del guin; por lo que se debe incluir un documento anexo que describe el funcionamiento de este juego, mientras que en el guin tan slo aparece la palabra EXE, seguida del nombre del juego y de la indicacin del anexo en que se encuentra la descripcin textual. Es frecuente incluir EXE en la descripcin del comportamiento de una zona sensible que se bifurca a otra escena. As ocurre cuando nos interesa por ejemplo que el usuario realice unas pruebas para poder cambiar de escena. En este caso en el guin se suele sealar con la palabra EXE y una descripcin de la rutina que se ha de programar. 4.3.10. Grupos de tareas Cuando el autor habla de grupos de tareas se refiere a cosas que pasan en las escenas y que no vienen determinadas por ninguna accin del usuario. Los casos ms importantes son las tareas de entrada a una escena y las tareas de fondo. 4.3.11. Entrada a una escena En el guin, despus de puntualizar cul es el fondo (BMP), se incluye la palabra ENTRADA para especificar una lista de cosas que suceden antes de que el usuario interacte. Estas cosas suelen ser: presentaciones, msica, animaciones y otros elementos, que sirven para presentar o ambientar la parte interactiva que vendr a continuacin. En el artculo "Introduccin al diseo interactivo de elementos dinmicos" de Guillem Bou se indican algunos ejemplos de tareas de entrada:
Ejemplos de entrada En una pantalla se coloca la ilustracin de fondo. En una pgina web, se activa una msica inicial que se interrumpe cuando el usuario hace clic por primera vez. En un juego se extrae una pregunta al azar de un banco de preguntas. En una aplicacin de investigacin psicolgica el ordenador toma nota del tiempo inicial para saber cunto tiempo tardar el usuario en salir de aquella pantalla. En una escena un texto se desplaza de derecha a izquierda por la pantalla antes de que aparezca el decorado. Bibliografa GuillemBou."Introduccin al diseo interactivo de elementos dinmicos". Revista TdD Temes de Disseny (n. 18). Barcelona: Elisava Edicions.
FUOC PID_00150918
45
El guin multimedia
De la misma manera que existen tareas de entrada, tambin existen tareas de salida; stas las marcaremos tambin en el guin con la palabra SALIDA. 4.3.12. Tareas de fondo En el guin tambin se describe lo que pasa cuando el usuario no realiza ninguna accin. Es el caso de las pantallas vivas: elementos que se mueven sin que el usuario haga nada. Este grupo de tareas se suma al guin, descritas y precedidas de la palabra IDLE, la cual tambin aparece en algunas herramientas de generacin de aplicaciones (en algunos generadores se llama timeline). 4.4. Reglas para la escritura del guin Bou establece una serie de reglas para escribir el guin definitivo con el fin de que sea til y prctico para todo el equipo. Estas reglas son las siguientes: Cada escena empieza en una pgina diferente. Una escena puede constar de los siguientes elementos que aparecen en este orden: nmero de la escena, ttulo, fondo, rutina de entrada, grupo de tareas, grupos de tareas IDLE, zonas sensibles (con sus comportamientos). El fondo de una escena puede cambiar, pero normalmente el fondo inicial sirve de decorado para identificar la escena. Si el fondo cambia, volveremos a escribir la palabra BMP con su nombre pertinente. Las zonas sensibles no cambian durante una escena; como mucho, se desconectan. Si cambian, es conveniente hacer otra escena aunque el fondo sea el mismo que el anterior.
4.5. Ejemplo de diseo lgico Escenan12 Titulo: Hacienda. Descripcintextual: Al entrar en la escena aparece un texto que dice: "Bienvenidos a la paz campestre" mientras se ve un pajarraco que se escapa porque estn intentando cazarlo. EL ruido de dos disparos suena de fondo.
FUOC PID_00150918
46
El guin multimedia
El usuario tendr un marcador en la pantalla. Sumar puntos cuando la decisin tomada sea correcta y los perder cuando se equivoque. Cuando pulse sobre la puerta de la izquierda saldr un texto que dir "Hala! Cmo se nota que sois urbanos!" "Habis abierto la puerta del gallinero y se estn escapando los animales". Entonces se cambiar el fondo y se ver una animacin que ocupar toda la pantalla en la que se escapan gallinas, conejos y toda suerte de animales domsticos. Se le restar un punto. Si se vuelve a pulsar sobre la misma puerta, las veces posteriores saldr un texto que dir "No quedan ya animales en esta granja". Hay un poste telefnico y cada vez que pulsen sobre l aparecer un texto que diga: "No hay telfono en la casa". Al intentar subir a la ventana superior aparecer una seora gritando: Ladrones! Ladrones!, y el usuario perder un punto. Mientras el usuario no haga nada, aparecern diversos motivos rurales, como carros que pasan por el camino, pjaros que vuelan, alguna serpiente que se arrastra, etc. BMP: casacamp.pcx ENTRADA (!) TXT: "Bienvenidos a la paz campestre" SEC: Se ve un pajarraco que se escapa porque estn intentando cazarlo. (pjaro 01 a pjaro 06) WAV: disparos.wav (dos disparos) Zonassensibles: 1) RAT: puerta del almacn ROL: ETI: "puerta del almacn" CLIC: TXT: "En el almacn hay una puerta." ICN "escalera" (sale el dibujo correspondiente) $1 2) RAT: puerta central (d)
Nota La descripcin textual es lo que otros autores llaman diseo lgico. Se puede colocar en un anexo.
FUOC PID_00150918
47
El guin multimedia
ROL: ETI: "puerta de entrada" CLIC TXT: "La casa est cerrada. Deberis entrar por una ventana." 3) RAT: ventana superior izquierda (d) (C $1) ROL: ETI: "ventana" (sin $1) TXT: "No puedes subir a esa ventana. Est muy arriba." (con $1) ICN. "seora. ICN" BOC (seora) "Ladrones! Ladrones!" SCO-1 4) RAT: ventana superior derecha (C$1) ROL: ETI: "ventana" CLIC: (sin $1) TXT: "No puedes subir a esa ventana. Est muy arriba." (con $1): TXT: "Esta ventana es de la habitacin de Rosa. A travs de ella se puede ver la cmara que ests buscando." 5) RAT: puerta izquierda (d) (!) ROL: ETI: "puerta izquierda" CLIC: TXT: "Hala! Cmo se nota que sois urbanos! Habis abierto la puerta del gallinero y se han escapado los animales." AVI: "granja Avi" (animales de granja que se escapan). (T) SCO-1 OTRAS:
FUOC PID_00150918
48
El guin multimedia
TXT: "No quedan animales en esta granja." 6) RAT: poste de telfonos (d) ROL: ETI: "poste de telfonos" CLIC: TXT: "No hay telfono en la casa." IDLE: Aparecen diversos motivos rurales (SEC) por este orden: carro, pjaro, caballo, serpiente. Ejemplo tomado del libro El guin multimedia de Guillem Bou. 4.6. Recursos y ejemplos de guin multimedia Recursosyejemplosdediseolgico http://www.um.es/gtiweb/fjmm/disetesa.htm http://www.fdi.ucm.es/profesor/milanjm/BDSI0304/Practica01-Tema02.pdf Recursossobreguinmultimedia http://www.ucm.es/info/especulo/numero34/guionmu.html http://www.uned.es/ntedu/espanol/master/primero/modulos/guion-multimedia/elementos-dinamicos.htm http://reddigital.cnice.mec.es/6/Articulos/pdf/Articulos_5.pdf http://www.wikilearning.com/tutorial/ el_usuario_arquetipico_creacion_y_uso_de_personajes_en_el_diseno_de_productos_interactivosguiones/4023-7 http://www.iua.upf.es/formats/formats1/a01et.htm http://mural.uv.es/dieguill/6%20%20Un%20horizonte%20interactivo%20T3.html Ejemplosdeguin Doce sentidos http://www.iua.upf.es/~ribas/GuioDisseny/ExemplesGuions/DotzeSentits/ Guions/CDROMPOE.DOC
FUOC PID_00150918
49
El guin multimedia
CD-ROM Joan Mir http://www.iua.upf.es/~ribas/GuioDisseny/ExemplesGuions/Miro/ GuionsMiro.htm Aracne. Ciencia en la red http://www.iua.upf.es/~ribas/GuioDisseny/ExemplesGuions/Aracne/ GuionsAracne.htm
FUOC PID_00150918
50
El guin multimedia
5. Etapa 5. El story-board
5.1. El story-board multimedia La ltima etapa del guin multimedia es el story-board y los esquemas grficos de todos los elementos que aparecen en cada una de las escenas. La story-board es una herramienta visual prestada del mundo de la comunicacin audiovisual que constituye una presentacin en forma esquemtica de una secuencia de dibujos, que son las pantallas del interactivo. En l se representa la idea que se pretende plasmar en la aplicacin. Un story-board es la expresin de todo lo que contendr la aplicacin, de las interacciones, de los estados y elementos dinmicos. Bou afirma que:
"en el mundo multimedia la accin no es lineal. El story-board es un diagrama de escenas con indicaciones de las posibles rutas que se pueden seguir en la navegacin por la aplicacin".
El story-board expresa todo lo que puede ser visto u odo o experimentado por parte del usuario final de la aplicacin multimedia. Debe contener todas las especificaciones necesarias. Los story-board pueden tomar muchas y diferentes formas y dimensiones en funcin del proyecto. El story-board es una gua que va a variar a lo largo del proceso de produccin del interactivo. As, una ilustracin inicialmente prevista puede variar, ya que se deduce que existe una opcin mejor.
El story-board es una herramienta dinmica que va a sufrir variaciones a lo largo del proceso de produccin.
5.2. Funciones y ventajas del story-board El story-board cumple bsicamente estas dos funciones: 1) Plasmar de forma grfica la estructura de los contenidos y sus interacciones. 2) Servir de gua, punto de referencia para todo el equipo, incluido el cliente. Las ventajas del story-board se pueden resumir de esta manera:
FUOC PID_00150918
51
El guin multimedia
Ayuda a catalizar la idea de cmo ser la aplicacin, ayuda a visualizarla. Fuerza al autor a pensar de forma visual y a desarrollar un documento claro en el que se especifiquen los detalles con imgenes y texto.
Permite transcribir acciones, estructuras, interacciones complicadas de explicar verbalmente y que podran interpretarse de manera equvoca.
Constituye un documento que todos pueden utilizar como punto de referencia. Permite acordar diferentes puntos ("s, es lo que quera decir" o "no, esto es un problema"). Permite comprender y retener mejor la informacin visual.
Es un documento flexible que permite al autor y a su equipo mover imgenes, secuencias.
Permite ver los enlaces entre las diferentes partes y discutir las interacciones. El story-board debe plasmar todos los enlaces (links) que hay entre las diferentes pantallas del documento.
Puede servir para ensear al cliente y que ste apruebe la lnea antes de seguir con el desarrollo del proceso.
La correccin de los problemas es menos costosa que en estadios ms avanzados.
Un story-board detallado puede significar un ahorro de tiempo en el proceso de escritura.
Ayuda a ver la estructura general del contenido de la aplicacin y a ver su magnitud.
Para producir productos multimedia complejos y con equipos relativamente grandes es esencial elaborar un story-board. 5.3. Grafo general y grafo exhaustivo El objetivo principal del story-board es concretar de forma grfica, y lo ms aproximada posible, la estructura de la aplicacin y lo que ocurre en concreto dentro de cada pantalla. Por esta razn, es preciso trabajar en dos niveles: el de la aplicacin en su totalidad y el del detalle de las relaciones entre las escenas.
FUOC PID_00150918
52
El guin multimedia
En una aplicacin multimedia interactiva el story-board est formado por el grafo general y el grafo exhaustivo.
Nota Grafo general y grafo exhaustivo son trminos utilizados por Bou en su libro Guin multimedia.
Grafo general y grafo exhaustivo Grafo general Una estructura general en un diagrama de flujos de la aplicacin donde se esquematiza la totalidad de la estructura de la aplicacin interactiva. Ofrece una visin global (de la estructura del contenido y del sistema de navegacin). Un comentario descriptivo y detallado que acompaa cada escena o pantalla en concreto. Por ejemplo, una descripcin detallada de como sern los mens, qu ilustraciones se vern y durante cunto tiempo, qu audio y qu texto acompaarn a las imgenes, qu enlaces habr, etc. Se emplea para visualizar el comportamiento detallado de cada escena y de los elementos que la integran.
Grafo exhaustivo
5.3.1. El grafo general Es el diagrama de flujos. En l se representan las imgenes y/o contenidos simplificados de las diferentes pantallas de la aplicacin. Debe estructurarse la informacin de manera coherente y teniendo en cuenta las posibilidades del hipertexto y de las diferentes estructuras posibles que se generarn. A continuacin, se recuerdan las fases coherentes para organizar y estructurar la informacin hasta plasmarla en un diagrama de flujos:
FUOC PID_00150918
53
El guin multimedia
5.3.2. El grafo exhaustivo En el grafo exhaustivo se detalla cmo se distribuyen en la pantalla los diversos elementos, adems de las formas de interaccin que se ofrecen al usuario.
Registros que debe contemplar el grafo exhaustivo Ilustracin Texto Sonido Vdeo Interacciones (zonas sensibles) Efectos-transiciones Descripcin general
FUOC PID_00150918
54
El guin multimedia
En el grafoexhaustivo se proporciona una descripcin detallada de lo que ocurre en cada pantalla, los elementos multimedia que hay (puede incluirse una relacin de los archivos utilizados, su nombre y ubicacin) y las interacciones que se ofrecen al usuario. En cambio, en el grafogeneral, en un diagrama de flujos se muestra la estructura de la aplicacin y las conexiones entre las pantallas. Tiene la funcin de orientacin global. En el grafo exhaustivo se marcan las zonassensibles (que, como ya hemos explicado anteriormente, son aquellas zonas de la pantalla en las que sucede algo al pulsar o pasar el ratn por encima, o bien al hacer otra accin). En este grafo debe detallarse dnde se localizan estas zonas sensibles y una descripcin de su comportamiento. A partir de estas zonas sensibles se planificarn las interacciones. En el apartado de guin tcnico se sealaron algunos de los comportamientos de las zonas sensibles y tambin una manera de nombrarlos; pero no es la nica nomenclatura que existe. En la tabla adjunta se muestra una descripcin de los eventosdeJavascript ms comunes:
Descripcin de los eventos de Javascript ms comunes Eventosderatn onmousedown onmousemove onmouseup onclick Al presionar un botn del ratn.
Al mover el puntero del ratn.
Al levantar un botn del ratn. Al hacer clic (una pulsacin completa subida y bajada del botn izquierdo del ratn). Al hacer doble clic. Al pasar el ratn por encima de un elemento o una zona. Al abandonar el elemento o zona. Al iniciar una operacin de arrastre. Al realizar una seleccin. Eventos de teclado
ondblclick onmouseover onmouseout ondragstart onselect
onkeydown onkeypress
Al presionar (bajar) una tecla. Al pulsar una tecla ANSI.
Bobadilla,Jess;Alcocer,Alejandro;Alonso,Santiago;Gutirrez,Abraham(1999). HTML Dinmico, ASP y Javascript a travs de ejemplos. Madrid: Ra-Ma.
FUOC PID_00150918
55
El guin multimedia
Eventos de "enfoque" onblur onfocus Al abandonar el mbito de un elemento. Al entrar en el mbito de un elemento. Eventos de formulario onreset onsubmit Al inicializar el formulario. Al enviar el formulario. Eventos de carga de pgina onload onunload Al cargar la pgina. Al descargar la pgina.
Bobadilla,Jess;Alcocer,Alejandro;Alonso,Santiago;Gutirrez,Abraham(1999). HTML Dinmico, ASP y Javascript a travs de ejemplos. Madrid: Ra-Ma.
Por ltimo, se ofrecen plantillas para realizar el grafo exhaustivo de un storyboard. Plantillasdestoryboard(grafoexhaustivo) Story 1 Story 2 Story 3 Story 4
Ejemplos de story-board (grafo exhaustivo).
FUOC PID_00150918
56
El guin multimedia
5.4. El story-board con wireframes Las webs y los productos interactivos son cada vez ms dinmicos, cambiantes y con elementos que aparecen da a da en el mercado; lo que hace que sea difcil plasmar lo que queremos conseguir en nuestro producto a travs de los story-board tradicionales. As que los diseadores de web estn usando nuevas tcnicas con el fin de plasmar sus ideas sobre los productos (como son el uso de wireframes para hacer storyboards), sobre todo en los que usen tecnologas que redunden en la interaccin inmediata con los usuarios ("Rich Internet Applications"), en las aplicaciones ricas usando AJAX o Flash.
Definicin de wireframe "Son una representacin esquemtica de una pgina web sin elementos grficos que muestran contenido y comportamiento de las pginas. Sirven como herramienta de comunicacin y discusin entre arquitectos de informacin, programadores, diseadores y clientes. Tambin se pueden utilizar en las pruebas de usuarios." http://isopixel.net/archivo/2008/07/wireframes/
5.4.1. Narrativa de wireframes guiados En el actual escenario (en el que se estn planteando aplicaciones icon una alta interactividad a tiempo real de ejecucin) es fcil que se dispare el coste de la elaboracin del producto. Y lo ideal es proporcionarle un prototipo del producto al cliente antes de realizar la aplicacin; aunque esto supondra un coste muy elevado. Andrs Zapata en The Guided Wireframe Narrative for Rich Internet Applications propone una solucin: como no se puede hacer un prototipo de la aplicacin por su elevado coste, se plasma el argumento que no es lineal por medio de los wireframes guiados. La propuesta de Zapata es la presentacin de pantallas en las que se insertan bocadillos con anotaciones sobre el comportamiento de la aplicacin en funcin de la interaccin con el usuario.
FUOC PID_00150918
57
El guin multimedia
Los wireframes se presentan con comentarios de diversos estados. Extrado de: http://www.boxesandarrows.com/view/the_guided_wire
Los elementos que se reflejan en los wireframes guiados son los siguientes: jerarqua, estado de la pantalla, convenciones de diseo, patrones de interaccin.
Recursos e informacin en Internet sobre wireframes http://www.boxesandarrows.com/view/the_guided_wire http://isopixel.net/archivo/2008/07/wireframes/ http://www.webstudio.cl/blog/wireframes/ http://www.galinus.com/noloentiendo/2005/07/wireframes-recopilacin-deenlaces.html http://www.torresburriel.com/weblog/2006/05/14/narrativa-de-wireframes-guiados/ The Guided Wireframe Narrative for Rich Internet Applications de Andres Zapata http:// www.boxesandarrows.com/ view/the_guided_wire Programas tiles Programas para hacer las presentaciones de pantallas: Open Office, Impress, Power point...
Webgrafa consultada
FUOC PID_00150918
58
El guin multimedia
5.5. Anexos del guin
5.5.1. Los guiones audiovisuales Al final del guin se incluyen una serie de anexos en los que se puede encontrar: los guiones de los audiovisuales que se han de crear; los textos que aparecen escritos o que una voz emitir; Los guiones de otros documentos, como los textos que acompaan a los audiovisuales, vdeos, cine, animaciones o fotografas; los story-boards de los audiovisuales, animaciones, etc.

6 - El Guion Multimedia

Încărcat de

Informații document

Drepturi de autor

Formate disponibile

Partajați acest document

Partajați sau inserați document

Opțiuni de partajare

Vi se pare util acest document?

Este necorespunzător acest conținut?

Drepturi de autor:

Formate disponibile

6 - El Guion Multimedia

Încărcat de

Drepturi de autor:

Formate disponibile

El guin multimedia

Caterina Ramon Marta Serra

La forma del diseo interactivo ..................................................

Otros elementos del guin .........................................................

El story-board con wireframes........................................................ Anexos del guin ........................................................................

1. Etapa 1. Proceso de creacin de un producto multimedia

Director del proyecto

1.6. La concepcin del producto multimedia

2. Etapa 2. Diseo de la interactividad

Bibliografa BouBouz,Guillem (1997). El guin multimedia. Madrid: Anaya Multimedia.

Mododegrabacin: Introducir datos, anotaciones, etc.

3. Etapa 3: Diseo de la navegacin

Web Style Guide http:// www.webstyleguide.com/ index.html?/sites/ site_design.html

3.3. Sistemas de navegacin Tal como comenta Orihuela,

Ejemplo de diagrama de flujo

Ejemplo2 El diagrama de flujo representa este texto:

4. Etapa 4. El diseo lgico

Es un documento flexible que permite al autor y a su equipo mover imgenes, secuencias.

La correccin de los problemas es menos costosa que en estadios ms avanzados.

Un story-board detallado puede significar un ahorro de tiempo en el proceso de escritura.

Ayuda a ver la estructura general del contenido de la aplicacin y a ver su magnitud.

Al mover el puntero del ratn.

ondblclick onmouseover onmouseout ondragstart onselect

Al presionar (bajar) una tecla. Al pulsar una tecla ANSI.

Bobadilla,Jess;Alcocer,Alejandro;Alonso,Santiago;Gutirrez,Abraham(1999). HTML Dinmico, ASP y Javascript a travs de ejemplos. Madrid: Ra-Ma.

Bobadilla,Jess;Alcocer,Alejandro;Alonso,Santiago;Gutirrez,Abraham(1999). HTML Dinmico, ASP y Javascript a travs de ejemplos. Madrid: Ra-Ma.

Ejemplos de story-board (grafo exhaustivo).

5.5. Anexos del guin

S-ar putea să vă placă și