MediaLab Rosario

1. Zonas sensibles

La unidad básica de trabajo en multimedia es la escena interactiva, pantalla interactiva o página interactiva (la terminología varía en función del autor). Esto es, una pantalla a la vista del usuario que consta de los elementos que se plasman en la figura siguiente:

Corresponden al lote de tareas de entrada todas aquellas acciones del ordenador que se producen antes de que el usuario interactúe. Los ejemplos son muy diversos según las aplicaciones, veamos algunos:

a) en una pantalla, se coloca la ilustración de fondo

b) en una página web, se activa una música inicial que se interrumpe cuando el usuario hace clic por primera vez

c) en un juego se extrae una pregunta al azar de un banco de preguntas

d) en una aplicación de investigación psicológica, el ordenador toma nota del tiempo inicial para saber cuánto tiempo tardará el usuario en salir de aquella pantalla

e) en una escena, un texto que dice "bienvenidos" se desplaza de derecha a izquierda por la pantalla antes de que aparezca el decorado.

Todas estas acciones, por tanto, se producen antes de que el usuario realice ninguna acción y pueden ser más o menos prolongadas. La toma del tiempo por parte del ordenador del ejemplo d) tarda unos milisegundos, en cambio podemos imaginarnos una aplicación educativa en la que antes de que el usuario respondiera preguntas, apareciera un vídeo de medio minuto en la parte superior derecha de la pantalla, o pensemos en juegos de ordenador en los que al entrar en una habitación se enciende la luz, se oyen sonidos de objetos que se mueven ,etc.

Por lo que se refiere al lote de tareas de salida, el lector puede intuir que se trata de lo mismo, pero con la diferencia que las acciones se realizan al abandonar la escena.

Mención especial merece el lote de tareas de fondo. Se trata de todas aquellas acciones que se ejecutan en la máquina mientras el usuario no hace nada. Siempre explico que es importante que las pantallas de una aplicación multimedia o un web site se conciban como elementos vivos, es decir, en ellas siempre debe suceder algo (algún movimiento) aunque el usuario no esté interactuando. Ésta es una de las diferencias entre el cine y el multimedia: en cine el fondo tiene vida por sí solo (las hojas de las plantas del bosque se mueven con el viento), en multimedia es el diseñador quien establece si algo va a moverse o no.

Y, finalmente, la parte de especificaciones interactivas de una escena puede pensarse siempre como la colocación de unas zonas sensibles a la interacción (normalmente al clic del ratón o al paso del cursor) sobre un fondo.

La utilidad de este esquema radica en que es muy útil tanto para la concepción (guión) de los audiovisuales como para la producción. Es decir, la utilización del mismo ayuda a sentar las bases para un lenguaje común y analítico a la hora de montar una aplicación entre varias personas.

De entre las reglas generales para el diseño de zonas sensibles, resaltemos las más comunes de tipo ergonómico :

a) Normalmente no hace falta que se pierdan esfuerzos de producción haciendo que las zonas sensibles se adapten exactamente a las figuras de fondo. Por ejemplo, si en un lugar de la pantalla está dibujada la figura de un coche, tranquilamente se puede definir una zona cuadrada que englobe parte o la totalidad del vehículo y que, al pasar sobre ella, aparezca el texto "coche". Es en la mente del usuario donde se forma la asociación etiqueta-imagen, y esta asociación se produce fácilmente, sólo por el hecho de que la imagen esté relativamente próxima a la etiqueta.

b) En general, las zonas sensibles se diseñan en sentido vertical, ya que el usuario suele "barrer" la pantalla horizontalmente. De este modo nos aseguramos que tropezará con la zona sensible (véase figura 2) al mover el ratón sobre la pantalla. En definitiva, lo que hace una zona detectable depende normalmente más de su altura que de su anchura.

c) Las zonas sensibles de comportamiento regular contribuyen a la uniformidad de la aplicación y a que el usuario se familiarice con ella. Se reservan preferentemente para aplicaciones destinadas a usuarios noveles.

d) Las zonas sensibles de comportamiento condicionado o de respuesta y desconexión aumentan la interactividad de la aplicación, la sorpresa y la frescura del discurso narrativo. Se reservan, sin embargo, para usuarios acostumbrados a utilizar las aplicaciones multimedia.

Los lenguajes de autor o de diseño de páginas web permiten que los elementos estándar también sean sensibles (botones, iconos, iconos animados, etc.). A efectos de guión nos solemos referir a ellos como zonas sensibles sin distinción; en la fase de diseño gráfico, sin embargo, el diseñador entra en detalle sobre la composición de la página y sobre cada tipo de elemento.

1. Economía y redundancia

El principio de economía se basa en la convicción de que el cerebro humano es un ente activo, receptivo, ágil y extremadamente rápido en el proceso de la información. Por ello se parte de la base de que cualquier aplicación multimedia (en soporte Cd o en la red) debe suministrar sólo la información precisa para que active todo un mecanismo de reconstrucción e interpretación. Otra forma de aplicar el principio es suministrar mucha información pero a un ritmo acelerado, de manera que la densidad sea alta. Ambas variantes comparten una conclusión común: si el cerebro del receptor está ocupado, éste se divierte; en caso contrario, se aburre y abandona la aplicación.

En obras anteriores ya he explicado los tipos de economía, básicamente cinco: de tiempo, de espacio, conceptual, de lenguaje y de espera. De estos tipos el último es el que hace referencia de forma más directa al ritmo de una aplicación. Nos dice que en una aplicación multimedia no hay que entrar en una dinámica de elementos que se esperan unos a otros sino que hay que superponerlos. La técnica se toma de prestado de la narración cinematográfica: vemos una escena y oímos un sonido que pertenece a la siguiente, es decir, la banda sonora de la segunda escena no ha esperado a que se desalojara la imagen de la primera.

Este efecto, lejos de producir desconcierto, se convierte en una forma ágil de enlazar y ayuda a la percepción de continuidad del producto audiovisual. En teoría, por tanto, hay que esperar que sea posible en una aplicación multimedia o en una página web activar diferentes elementos asíncronamente y despreocuparse: el usuario ya les dará el sentido correcto.

Por otra parte, a esta concepción innovadora y de predominio de lo dinámico, que es siempre muy útil cuando se realizan aplicaciones cuyos destinatarios estén familiarizados con el multimedia, se opone a los principios ergonómicos básicos de redundancia. Esto es, para aplicaciones destinadas a usuarios con un desarrollo menor de los hábitos audiovisuales (o aplicaciones en los que predomine el valor de la información y se imponga un ritmo lento y seguro) se aconseja echar mano de unos recursos redundantes para que guíen al usuario y eviten confusiones o pérdidas del control de la aplicación.

Los recursos más típicos son los relativos a la redundancia de refuerzo. Por ejemplo, Microsoft ha apostado por este estilo en los iconos de menú de sus aplicaciones de Office (97 y 2000): si situamos el cursor sobre un icono y no lo movemos, aparece al cabo de un rato una etiqueta explicativa. Otro ejemplo son el de las páginas web con enlaces etiquetados, es decir, aquellos que constan de una explicación suficientemente clara pero que, al pasar por encima, aparece además un pequeño texto.

En el diseño de aplicaciones y web sites se discute hasta qué punto se optará por un estilo redundante o no. El ejemplo de Microsoft es claro debido al hecho que sus productos se conciben para un uso universal (y, por tanto, gran parte de los usuarios finales necesitarán de esta ayuda suplementaria para utilizarlos con soltura). La decisión, pues, se fundamenta en el tipo de usuario final. Ahora bien, hay tres ideas que deben considerarse a la hora de optar por los diseños redundantes:

a) Es obligatorio seguir las modas. Es decir, si la mayoría de las páginas web y los productos ofimáticos utilizan etiquetas con fondo amarillo y texto negro, súmese a la tendencia general. La razón es obvia: usted quiere una ayuda para el usuario; pues bien, tenga presente que si su aplicación es "como todas" esta semejanza ya es un punto. Evite, por tanto, una excesiva excentricidad gráfica en estos ámbitos.

b) Adopte pautas de regularidad. Por ejemplo, si cada vez que se pulsa sobre un link aparece un icono explicativo o se oye un sonido de refuerzo antes de bifurcar, asegúrese de que sucede siempre. En caso contrario, al usuario le despistará y le creará inseguridad la ausencia puntual del elemento de refuerzo.

c) Hay un consenso creciente en la necesidad de elementos redundantes de tipo general en los web sites: los mapas del site, los buscadores internos, las ayudas y otros recursos similares. En estos casos la redundancia no se encamina al usuario novel sino al que tiene prisa, es decir, al que busca la eficiencia del site como punto de información. Al respecto, es útil consultar la discusión sobre el web site y su concepción (como páginas de navegación o como base de datos) que se halla en Ribas (2000).

1. Conjunción de texto e imagen

Hay principios básicos en este campo que se conocen pero que no se aplican todavía en las páginas web (y no puede decirse que sea por limitaciones técnicas). Comentaremos dos de ellos: el anclaje del texto respecto a la imagen y la dramatización de la imagen respecto al texto.

El primero nace de la idea que la imagen es, por naturaleza, polisémica. Una fotografía aislada, por ejemplo, situada tal cual en una página web puede significar muchas cosas diferentes. El texto que la acompañe promoverá que adoptemos un significado concreto dentro de los posibles, por ellos se dice que anclará la imagen. La publicidad juega estupendamente bien con este mecanismo, ya que en los anuncios de revista (de página entera) nos fijamos en una imagen que nos llama la atención, que puede significar muchas cosas y que puede ser ligeramente provocativa (transgresora), entonces leemos el texto y entendemos el significado del anuncio, no llega el mensaje del publicista vía un proceso de anclaje del estímulo visual inicial que nos cautivado.

El segundo se halla ampliamente desarrollado en la composición periodística y consiste en el rol dramatizador (humanizante o ejemplarizante) que juegan las fotografías que acompañan a las noticias. Si el titular habla de distanciamiento entre dos políticos, por ejemplo, la fotografía los muestra sentados en la misma mesa pero mirando a lugares diferentes. La imagen, por tanto, juega el papel de un flash momentáneo que ilustra la noticia (además, la refuerza y le da credibilidad).

El quid de la cuestión radica en que estos dos recursos tan genuinamente audiovisuales no son todavía de uso común en nuestras páginas. La imagen juega todavía este papel de fondo agradable y contextualizador, se presenta frecuentemente difuminada (o con brillo apagado) y se limita a hacer de soporte al texto que se despliega sobre ella.

Una apuesta más radical, apoyada en recursos técnicos, aumentaría sin duda el impacto comunicativo de una página web. Haga al respecto un experimento: tome una muestra de unas diez páginas que siguen la estructura conservadora expuesta en el párrafo anterior, piense luego en cómo podrían presentarse atendiendo a uno de los dos recursos expuestos, es decir, piense si podría enfocarse como un anuncio publicitario (anclaje) o como una noticia periodística (dramatización); verá entonces que con alguna de ellas es posible y, además, como el resultado mejora notablemente.

2. Hipertexto

El tema de cómo unas páginas se abren en un orden no predeterminado ante el usuario y éste construye un cuerpo de información es tan polémico e hipotético que yo me atrevería modestamente a calificarlo en la actualidad de esotérico. Ciertamente la psicología cognitiva ha avanzado mucho en los modelos de aprendizaje constructivista y muchos autores recurren a ella para fundamentar web sites de naturaleza abierta, libre y fuertemente hipertextualizada. Quizá la experiencia, rigurosamente evaluada, muestre algún día que los usuarios se pierden frecuentemente, abandonan el site o tardan demasiado en encontrar lo que buscan.

Como regla a seguir, por tanto, debe uno ponerse en el lugar del usuario final y preguntarse no sólo lo que busca sino cómo lo quiere. Por ejemplo, ¿tiene sentido un documento hipertextual de derecho informático? Hasta cierto punto sí y hasta cierto punto no. A un estudioso le puede ser muy útil disponer de unas páginas sobre leyes de referencia, otras sobre jurisprudencia y otras sobre consejos generales de actuación. Ahora bien, quizá le apetezca poder imprimir de golpe cada una de estas familias de páginas, para estudiarlas con detenimiento sentado cómodamente en su mesa de trabajo. ¿Qué pasa entonces si hemos diseñado cada una de estos textos con un fuerte nivel de hipertextualización, con enlaces explicativos, con ventanas que aparecen y desaparecen? Pues que el usuario se las verá y se las deseará para obtener lo que quiere, ya que iniciará una ardua tarea de impresión a plazos en la cual se perderá rápidamente (no sabrá qué ha impreso y qué le falta por imprimir y, además, seguro que se dejará al final páginas sin leer).

Por tanto, sin dejar de investigar y leer los tentadores resultados apoyados en el constructivismo, mi propuesta consiste en apoyarse un poco más en la usabilidad a la hora de atacar problemas de hipertextualización. Por mi parte, avisé de ciertos problemas típicos en Bou (1997) pero ahora se dispone, además, de unas reflexiones interesantes en Ribas (2000).

3. Animación limitada

El equipo de animación de Tex Avery (Bugs Bunny y cía) aprovechaba en tiempos de crisis las transparencias de animación: eran borradas y reutilizadas. Las series producidas por Hanna-Barbera (Flintstones, Yogui Bear, etc.) optimizaban la producción con el uso de matrices de estilo de animación limitada (conseguir el efecto de movimiento con un número reducido al máximo y estandarizado de fotogramas). Con ello quiero que el lector se dé cuenta de que siempre ha habido un interés por obtener un alto rendimiento (de forma muy diferente) de la producción de animación, es decir, siempre se ha querido contar con ella a pesar de su elevado coste.

Si los Simpson supusieron un experimento exitoso e innovador al desarrollar toda la serie mediante dibujos con trazos regulares y simplificados (ojos, mentones, manos, figuras humanas...) y basar la fuerza expresiva en el guión, puede decirse que ahora South Park ha dado una vuelta más de tuerca. Es casi increíble notar la naturalidad final del producto resultante cuando los dibujos de base se restringen prácticamente a formas geométricas elementales (ojos de círculo redondo, manos cuadradas, un rectángulo por torso, etc.).

Todos estos ejemplos han de servir para que los diseñadores de páginas web se den cuenta de que la animación es un campo agradecido en la investigación y que las ideas atrevidas suelen dar buen resultado. Si uno se entretiene a mirar con detalle las colecciones de pequeños gif animados que pueblan la red percibirá la tremenda simplificación gráfica (dibujo de base) y dinámica (número de fotogramas) a que ha sido sometido el conjunto antes de ser puesto en la página. ¡Y así y todo funciona! Es decir, cautiva al usuario, da vida a la página y resuelve muchos problemas de espacios incómodos, exceso de rigidez, etc.

Por ello, el consejo que doy al respecto es que una parte de la producción se invierta en animación limitada. Ya se ha visto que tanto la reducción de fotogramas como la simplificación del dibujo base puede dar buen resultado. Parece que básicamente es cuestión de jugar con el pequeño tamaño y de encontrar un estilo adecuado. Sólo hace falta, pues, intentarlo. Las páginas producidas ganarán en impacto comunicativo.

BIBLIOGRAFÍA

BOU, G. (1997): El guión multimedia. Anaya. Barcelona.

BOU, G. & RIUS, E. (1999): Ciento once ejercicios de guión y producción multimedia. Edición para el master universitario en nuevas tecnologías de la información y de la comunicación. Universidad Nacional de Educación a Distancia. Madrid.

FERNÁNDEZ-COCA, A. (1998): Producción y diseño gráfico para la world wide web. Paidós. Barcelona.

MATAS, A. (1997): Productes multimèdia: disseny i anàlisi conceptual. Artículo electrónico disponible en [www.bcnmultimedia.com]

RIBAS, J. I. (1997): "Direcciones en el diseño de interactivos". Artículo electrónico disponible en [http://www.iua.upf.es/~ribas/]

RIBAS, J. I. (2000): "Caracterización de los interactivos de difusión cultural. Aproximación a un tratamiento específico, los ensayos interactivos". Tesina. Universitat Pompeu Fabra. Barcelona.