Integración de la funcionalidad en productos multimedia. ARGN0110. Juan Luis Perles García
rel="nofollow" href="#fb3_img_img_25e2db8c-bb04-53d2-8c1c-4c785b9ee2d8.png" alt="image"/>
Delimitación de las áreas funcionales principales
La funcionalidad de los principales elementos que se usan en la interfaz –enmarcados con un rectángulo rojo en la imagen anterior- junto con sus errores de diseño es la siguiente:
1 Menú de navegación principal. Será fijo en todas las pantallas, por lo que no debe modificarse su tamaño ni su estilo. El cambio de color cuando el puntero se sitúa encima no es suficiente, y el color amarillo es poco gratificante visualmente, al igual que el tipo de letra anticuada.
2 Selector. Es un control de tipo lista cuya función es seleccionar el animal del cual se muestra información. El color de fondo del selector se confunde con el objeto imitación de madera.
3 Marco. Sirve para agrupar el texto “Programas de alimentación”. Aparte del mal diseño comentado anteriormente, no queda claro si el tamaño del marco es mayor o menor que el texto que debe mostrar, o si ofrece barras de desplazamiento.
4 Marco de fotos o vídeos. Es el contenedor del reproductor de fotos o vídeos. Su tamaño es pequeño en relación a todo el espacio desaprovechado en la interfaz, y su posición, lejos del foco de atención principal del usuario, no es adecuada.
5 Menú de navegación secundario. Es el menú interactivo de la zona 6 y cabe decir lo mismo que lo comentado en el punto 1.
6 Marco. Zona que tiene como función informar sobre determinadas características de los productos. La combinación de fondo verde y texto negro es muy negativa. Su tamaño hace pensar que sobrará espacio horizontal y probablemente faltará espacio vertical, por lo que será necesario el uso de barras de desplazamiento.
7 Imagen. Representa el logotipo de la empresa, de exagerado tamaño, lo cual rompe desde el principio la distribución.
8 Texto. Muy desacertada la posición y el tamaño del texto.
3.2. Navegación
Cuando un usuario abre una aplicación multimedia, tendrá un número determinado de páginas o pantallas estructuradas de algún modo y accesibles desde la pantalla de inicio. La forma de acceder a estas pantallas se denomina navegación y es uno de los puntos principales que determinan el grado de interactividad de la aplicación.
Recuerde
Se considera página o pantalla, a la unidad informativa integrada en un interfaz interactivo donde se exponen unos determinados contenidos como imágenes, textos, controles de navegación, reproductores, etc.
Existen distintas formas de estructurar la aplicación en función de la navegación; estas se describen a continuación.
Lineal
Se accede a las pantallas a partir de una inicial, secuencialmente, una detrás de otra y permitiendo en muchos casos, volver a la pantalla anterior. Esta estructura obliga al usuario a seguir un camino predefinido y por tanto recibir la información en el orden adecuado. Está indicada para aplicaciones multimedia de tipo pedagógico, como cursos de idiomas, mecanografía, etc.
Lineal ampliada
Permite realizar una navegación lineal, pero con la posibilidad de visitar pantallas anteriores, saltar pantallas, acceder a pantallas alternativas, y lo que es más importante, volver en cualquier momento a la pantalla inicial.
Jerárquica o en árbol
Se basa en el concepto de estructura de árbol, donde el acceso a las distintas pantallas se realiza desde una pantalla inicial, también llamada pantalla “raíz”, a través de la cual los caminos van bifurcándose. Esto ofrece como ventaja dar al usuario la libertad de acceder ordenadamente a un contenido muy amplio.
Tiene como principal desventaja que en función del contenido, cuanto más profundo sea, el usuario tendrá que pulsar más veces en los enlaces para acceder a una determinada pantalla.
Existe la posibilidad de ampliar el número de enlaces en la página de inicio, con lo cual el usuario tendrá que hacer menos “clicks” para llegar a una determinada pantalla, aunque en su detrimento este sistema tiende a recargar la pantalla de inicio. Esta idea se denomina árboles anchos.
Malla y malla completa
La estructura de tipo malla permite múltiples accesos entre las distintas pantallas, siendo una combinación entre la estructura jerárquica y la lineal. Si la aplicación permite una navegación donde cada página está vinculada con todas las demás, se dice que usa una estructura de tipo malla completa. El número de vínculos totales, resultará de multiplicar el total de páginas, por el total de páginas menos una.
Hipertextual
Tiene como principal característica el uso de enlaces de texto (hipertexto) para acceder a los distintos contenidos. Un ejemplo son las enciclopedias on-line con un amplio número de enlaces. El usuario puede navegar siguiendo distintos caminos, como se ha explicado en los tipos anteriores.
Nota
En las enciclopedias on-line el hipertexto permite reunir un amplio conocimiento, estructurándolo y relacionándolo en grupos temáticos diferentes, mediante enlaces que dan al usuario la posibilidad de navegar libremente, en función de las relaciones que se establezcan.
Por tanto, siguen unas estructuras de navegación mucho más complejas que las que hemos visto, y en todo caso se aproximan a usar estructuras de tipo malla completa.
Cuando se utiliza el texto como sistema de navegación es necesario definir las etiquetas con el fin de estructurar el recorrido por los distintos temas de la aplicación, tal y como ha sido especificado por el cliente y que esta cumpla con los objetivos de accesibilidad y usabilidad.
Nota
Las etiquetas son entendidas en este ámbito como el texto que tiene atribuida la función de poder dirigir al usuario a un determinado contenido una vez que se pincha en él.
Por otro lado se habla de “etiquetas” en el contexto de la programación web, para referirse al “lenguaje de marcado” o de “etiquetas” que es aquel que permite diseñar documentos con un contenido formateado y visualizado de una determinada manera mediante etiquetas.
El lenguaje de etiquetas más conocido hoy día es el HTML (“HyperText Markup Language”, Lenguaje de marcado de hipertexto), base del World Wide Web.
Cada etiqueta tendrá un nombre, un texto o la palabra o frase en sí, un estilo y el vínculo que es la pantalla de la aplicación a la que se accede al pulsar en ella.