Efectos
Aunque no se consideran un elemento, en el sentido exacto de la palabra, si ofrecen mayor vistosidad al diseño final de la aplicación, permitiendo por ejemplo que las pantallas se muestren suavemente, con transiciones especiales, o desvaneciéndose a negro, por ejemplo, al salir de la aplicación.
Plantillas
Permiten realizar diseños fijos de pantallas u otros elementos, con unas características de diseño, funcionalidad e interactividad comunes. Así, el diseñador puede tener una plantilla tipo para las páginas de contenido de la aplicación multimedia y cambiar solo el texto y las ilustraciones que ofrecen, por ejemplo.
Ejemplo de plantilla en el que se observa que se pueden diseñar unos contenidos fijos, como el fondo, área de botones, etc., y unos contenidos variables, como los títulos, áreas de textos, enlaces, etc.
Nota
Las plantillas se crean como una pantalla más, con todos sus elementos y funcionalidad integrados, se eliminan aquellos objetos o características que sean variables y se guardan. Posteriormente se pueden crear nuevas pantallas a partir de las plantillas diseñadas y añadir aquellos elementos nuevos o que cambien permitiendo por tanto ahorrar mucho trabajo.
Reproductores multimedia
Se usan para visualizar y controlar los vídeos, animaciones o sonidos que en la aplicación se muestren. En ocasiones es necesario utilizar algún tipo de reproductor de autor, que simplifica enormemente la programación del control del medio. Es necesario asegurar su compatibilidad con los diferentes formatos, estándares y plataformas.
Controles de reproductor multimedia
2.3. Aplicación práctica sobre la identificación de los elementos de dos bocetos previos
A partir de los bocetos de interfaz multimedia de dos pantallas que nos envían del departamento de diseño, identifique los elementos principales, comentando la funcionalidad de los mismos. Se muestran en las siguientes imágenes.
Boceto 1 de interfaz multimedia
Boceto 2 de interfaz multimedia
SOLUCIÓN
Boceto1
Es un boceto compuesto por entre ocho y nueve imágenes sintéticas –no fotos reales– que pasamos a comentar.
Se divide la pantalla principal en dos zonas, una superior para situar en ella el nombre de la aplicación (“Lista de Precios”) y a la derecha el logo de la empresa (“Empresa X”) y abajo otra zona, de mayor tamaño, en la que se integra un menú de opciones y un botón de salir. Se usa una imagen de fondo que tiene como función integrar los elementos de diseño y ofrecer un estilo visual moderno.
En la zona central aparece una imagen que representa un marco transparente con esquinas redondeadas y efectos de bisel y que tiene como función albergar cuatro imágenes que representan los botones de acción para acceder a las cuatro pantallas restantes que ofrece el programa.
Por último, se muestra en la zona inferior una imagen rectangular con los bordes ovalados que cumple la función de botón de acción: cierra la aplicación cuando el usuario hace clic sobre ella.
Todas las imágenes quedan perfectamente integradas en un diseño elegante y atractivo.
Boceto 2
Es un boceto que mantiene la línea de estilo del anterior y está compuesto por un número mayor de imágenes y elementos interactivos, pues en él se muestran los datos de contacto y fotos de cinco delegaciones de la empresa.
Destacan un conjunto de cinco imágenes a la izquierda que tienen la función de ofrecer los datos de una determinada delegación cuando se pincha sobre cada una de ellas, mostrando además el efecto interactivo de sombrearse al situar el ratón.
En la zona central aparece una imagen de mapa interactivo de la península ibérica, con la localización de las cinco delegaciones y se puede pinchar en los rectángulos que aparecen –son también imágenes– para mostrar en la parte inferior los datos de dichas delegaciones y a la derecha una pequeña foto de la misma.
A la derecha se usa una imagen para representar el edificio donde está situada cada delegación. Estas imágenes deben ocupar el mismo sitio en la pantalla, para mantener la coherencia, y aparecen y desaparecen de manera suave, en función de la delegación seleccionada.
Justo encima hay dos imágenes que representan los botones de acción de volver a la pantalla anterior y de enviar correo electrónico a la empresa. Abajo del todo está el área de información de las delegaciones y una pequeña ayuda.
3. Aspectos funcionales definidos en los bocetos
Los aspectos funcionales sobre la interfaz de la aplicación, el sistema de navegación elegido, el árbol de contenidos y los sistemas de mensajes y ayudas definidos en los bocetos previos, son la base del proyecto editorial multimedia a desarrollar.
Nota
A partir de una idea original, se puede esbozar el guión de la aplicación, donde tiene vital importancia el diseño de la interfaz de usuario, el diseño del sistema de navegación, la elección de los medios o elementos digitales que se van a integrar con el contenido, las acciones programadas en los distintos elementos y el formato final del programa.
3.1. Interfaz
Se considera interfaz o de manera más técnica GUI –Graphical User Interface (Interfaz Gráfica de Usuario)– al conjunto de elementos gráficos, que hacen posible la interacción entre una persona y un ordenador, normalmente mediante un sistema de visualización o periférico de salida, como puede ser la pantalla o monitor y unos periféricos de entrada como son el ratón, el teclado y/o los dispositivos táctiles.
Esto permite una comunicación “amigable” entre el ordenador y la persona, mediante una representación gráfica basada en imágenes y objetos como iconos, ventanas, textos, etc., que conforman un lenguaje visual y apoyada por otros elementos secundarios (sonidos o animaciones por ejemplo que refuerzan la interactividad), evitando así la comunicación en lenguaje máquina.
Imagen en la que se muestra la clara evolución de cuatro ejemplos de interfaces desarrolladas a lo largo del tiempo. De arriba abajo: MS-Dos, Yast para Ms-Dos, Windows 95 y KWin Cube para KDE.
Sabía que...
Internamente cualquier sistema informático