Conceptos Básicos del Diseño de InterfazPor D.C.G. Andrés Suárez Yáñez

Los Multimedia y las páginas Web han cambiado el paradigma en el cual el diseñador gráfico era sólo un “traductor” del mensaje del emisor. Hoy en día, a través de la construcción de la interface, el diseñador gráfico debe ser además el “guía” entre el mensaje y el receptor.

Todo proceso comunicativo que se basa en el uso de una computadora consiste en tres principales componentes: Hardware, Software y Usuario, cuya interacción es una de las partes más importantes del sistema: la interfaz hombre-máquina.

Interfaz “Conexión física y funcional entre dos aparatos o sistemas independientes”Diccionario de la Lengua Española Real Academia 22 edición, 2001.

“La interface es lo que presenta información al usuario y acepta información del usuario” (Garanda, 1996), “Es la parte del diseño con la que el usuario entra primero en contacto y a través de la cual experimenta sus posibilidades” (Wildbur y Burke, 1998).

El diseñador de interfaces intenta presentar toda la información de una manera objetiva y de tal manera que le permita al usuario tomar ciertas decisiones, reducir la complejidad cognoscitiva en la masa de información producida y distribuidas en la sociedad actual, sobre todo en el ámbito de los medios digitales. La interfaz gráfica de usuario (GUI) fue creada para proporcionar al público un control directo sobre sus ordenadores personales. Utilizando los recursos visuales y auditivos, para transformar datos en información asimilable, comprensible e interpretable.

El entorno dentro del cual se inscribe el diseño de una interface y la medida de su usabilidad, está dado por tres factores: una persona , una tarea y un contexto.

La usabilidad es un atributo de calidad, que se refiere a que tan fácil es el uso de una interface. También se utiliza la palabra usabilidad para nombrar un método para mejorar la facilidad de uso de una interface, durante la fase de diseño. Para medir la usabilidad de una interfaz se utilizan cuatro parámetros:

Utilidad: Capacidad que tiene una herramienta para ayudad a cumplir tareas específicas.Facilidad de uso: Está en relación directa con la eficiencia o efectividad, medida como la velocidad o cantidad de posibles errores.Facilidad de aprendizaje: medida del tiempo requerido para trabajar con cierto grado de eficiencia en el uso de la herramienta y alcanzar un cierto grado de retención de estos conocimientos luego de cierto tiempo de no usar la herramienta o sistema.

Apreciación: medida de las percepciones, opiniones, sentimientos y actitudes generadas en el usuario por la herramienta o sistema; una medida, si se quiere, de su seducción o elegancia.

Un análisis de usabilidad identifica los problemas y dificultades del uso y obtiene soluciones o recomendaciones para su rediseño, que le permita disponer de un producto mas fácil de usar por los usuarios y mas eficiente para alcanzar los objetivos, mediante:

Evitar elementos innecesarios y eliminar distracciones, centrándose en las tareas de los usuarios.Destacar los contenidos importantes con una efectiva jerarquía visual.Ser claros y elegantes, simples y directosSer transparentes, intuitivos y fáciles de aprenderReducir las funciones a las mas esencialesSimplificar el número de pasos en los procesosSer fáciles de cargar y mantener.

El diseñador es básicamente el gestor visual de la información, utilizando conceptos y elementos tales como la composición, la tipografía , la ilustración y el color, para guiar al usuario a través del espacio virtual. Para ello existen tres principios que fundamentan el uso del lenguaje gráfico en la creación de interfaces y que inciden, directamente en la implementación de los elementos de diseño y las leyes compositivas:

Organizar: Proveer al usuario de una estructura conceptual clara y consistenteEconomizar: Hacer lo máximo con la menor cantidad de elementosComunicar: Ajustar la presentación a las capacidades del usuario.

Establecer una adecuada distribución de elementos, generalmente por medio de la implementación de retículas base y estilos para los elementos gráficos que determinen cómo han de disponerse las diferentes bloques de documentos y sus ilustraciones, así como marcar las pautas y estilos de las páginas principales, sus cabeceras, subtitulos y botones de navegación.

La carencia de consistencia involucra innovación. Desviarse de las convenciones existentes sólo debe hacerse cuando proporciona un claro beneficio al usuario.

A continuación se presentan algunas consideraciones generales respecto al contexto en la interface, que deben ser tomadas en cuenta por el diseñador para el manejo y presentación de la información:

1. El camino. Es la vía por la que el usuario avanza para obtener la información. Esta vía debe ser auto-evidente y hasta intuitiva. Un camino intuitivo significa que éste tiene una estructura lógica tanto en los pasos como en las acciones.

2. Incomprensibilidad. El nivel de información presente debe respetar el nivel de conocimiento del usuario, no el de su inteligencia. Se le deben ofrecer opciones a éste para que elija el nivel de información proporcionada.

3. Guía. El control y las herramientas de navegación deben ser escalables en relación con la complejidad de la información presentada. Las ayudas deben estar presentes sólo cuando las necesite el usuario.

4. Nivel de Actividad. Este punto se refiere a la contestación de las preguntas: ¿Cuánta lectura pasiva o video debe de existir? y ¿Cuánta participación es necesaria? La

respuesta correcta podría depender de la experiencia del diseñador, de las reacciones del usuario y de los usos y prácticas de la cultura cibernética.

5. Circunstancias especiales. Es recomendable tomar en cuenta algunas posibles peculiaridades del usuario, como la posibilidad de que éste que no vea muy bien, que sea daltónico o zurdo. Se puede diseñar la presentación de la información de tal manera que sea comprendida por la mayor variedad posible de usuarios.

6. Localidad. Es muy importante tener en cuenta algunas costumbres, como la forma de hablar en la región específica donde se va a presentar el material para evitar errores en la interpretación del texto.

7. Preferencias de medios. Algunos usuarios, de acuerdo con su grupo social, prefieren leer la mayoría de la información y solo en algunos casos ver algún apoyo de video, animación o gráficas. Es necesario proporcionar opciones al usuario, respecto a la forma de presentación de la información para que a éste le sea más fácil entenderla y asimilarla.

En el diseño de la interfase se utilizan seis medios para comunicar la información, con una variedad de elementos para combinar o usarse en forma aislada. Estos son: el texto (escrito), el audio (hablado), la música (o sonidos), la fotografía (o ilustraciones), las películas (movimiento) y los elementos tridimensionales.

MetáforaTranslación del sentido recto de una palabra a otro figurado.

Laruousse Diccionario básico de la lengua española , 1984.

El uso de metáforas adecuadas en el diseño de una interface facilita y acelera el aprendizaje del funcionamiento de un producto. Similitud con otros mecanismos y procedimientos conocidos por el usuario que aplica lo que ya conoce a los elementos y relaciones dentro de un dominio no familiar.

Una metáfora, para potenciar su funcionamiento debe:

Ser consistente, aplicándose de forma coherente y sólida a lo largo de todo el sistema.Autoexplicativa, facilitándole al usuario el conocer las acciones posibles en cada momento.Hacer visibles partes y procesos invisibles al usuario, incluyendo el modelo conceptual del sistema, las acciones alternativas y el resultado de las acciones.Informar con claridad al usuario acerca del estado actual del sistema y de las consecuencias de sus acciones.Claro y simple para no desbordar al usuario con información superflua o innecesaria.

Tipos de MetáforasOrganizacionales: se fundamenta en la estructura existente de un grupo, sistema u organización.Web de un supermercado: secciones de; panadería, carnicería, frutas y legumbres, etc. No es conveniente organizarlo como reflejo de la estructura corporativa de la empresa, que es algo que el usuario no entiende y además le resulta inútil en su tarea de compra.

Es importante que el usuario encuentre el sentido y utilidad a la metáfora.

Funcional: se apoya en tareas o funciones que el usuario puede realizar en su vida cotidiana.Los programas manejan menus comunes como son “archivo” y “edición”; donde siempre se encontrará el usuario las funciones de abrir, nuevo, copiar y pegar, etc.Visuales: Basadas en elementos gráficos familiares para la mayoría de la gente.Es el mas utilizado por nosotros y el mas clara de entender, y donde normalmente se abusa de la “creatividad” y se desorienta al usuario.

HipertextoEs una estructura de la información que organiza un conjunto de elementos en forma de red.

H de Hipertexto, o la teoría de los hipertexto revisitada, HYPERLINK "http://www.campusvirtual.redcom.org/posgrado/htteoria.htm" www.campusvirtual.redcom.org/posgrado/htteoria.htm

Un hipertexto consiste en tres elementos:Un conjunto de nodos, que son los elementos que contienen la información.Los enlaces entre tales nodosConjunto de anclajes, que identifican el inicio y el destino de cada enlace.

Nodos Son las unidades básicas del hipertexto. Pueden corresponder a las partes correspondientes clásicas de los documentos escritos, tales como capítulos, secciones o párrafos; pueden corresponder a partes propias del mundo digital, como la porción de texto que cabe en una pantalla sin efectuar desplazamiento, o pueden ser documentos completos.

Qué cosa sea un nodo tiene diversas implicaciones. En primer lugar, si los nodos son de grano muy fino, por ejemplo, si se identifican con párrafos, la lectura de un hipertexto con nodos tan pequeños puede resultar frustrante para el lector. Si los nodos son muy grandes, se desaprovecha la genuina ventaja de los hipertextos: el establecimiento de relaciones asociativas entre partes significativas de un documento.

EnlacesInterconectan nodos. El conjunto de nodos más el conjunto de sus enlaces crean la red en la que todo hipertexto está sustentado. De acuerdo con ciertas corrientes teóricas, todos los enlaces deberían ser bidireccionales en un doble sentido que examinaremos más adelante.

AnclajesEs el punto de activación o el punto de destino del enlace. Los enlaces se activan desde puntos determinados de los nodos y tienen su punto de destino en la globalidad del nodo de destino, o bien en una parte determinada del mismo. Ambos puntos, el punto de inicio y el punto de destino, reciben el nombre de anclajes.

Los anclajes de un nodo suelen ponerse de manifiesto para el lector a travéz de alguna convención gráfica, típicamente mediante iconos, alteraciones en los atributos del texto, tales como el subrayado o la negrita, o mediante cambios en la forma del cursor.

A partir de los conceptos anteriores, es fácil generalizar la idea del hipertexto y pasar a la idea del hipertexto y pasar a la idea del hipermedio. En un hipermedio los nodos pueden contener cualquiera de las siete morfologías de la información: en lugar de contener únicamente texto.

Designing Business, Clement Mok,Adobe Press, San Jose California, 1996.

Infográfica, Peter Wildbur y Michael Burke,Editorial Gustavo Gili, S.A., Barcelona 1998.

Seminario anual del Programa de Posgrado en Diseño, Mtro. Manuel Gándara. Universidad Autónoma Metropolitana, México D.F. 1996.

Mercovich, Eduardo. Ponencia sobre Diseño de Interfaces y Usabilidad,http://palneta.gaiasur.com.ar/infoteca/diseno-de-intercades-y-usabilidad.html.