DISEÑO DE LA INTERFAZ GRÁFICA DEL USUARIO (IGU)

DISEÑO DE LA INTERFAZ GRÁFICA DEL USUARIO (IGU)
Como sabemos, la mayoría de las aplicaciones deben interactuar con el usuario para que se logren los
tres pasos necesarios del procesamiento de datos: Entrada, Transformación y Salida. Toda aplicación
debe poseer una forma de lograr la interrelación con el futuro usuario, es decir, debe tener un mecanismo
que establezca cómo se lograrán el ingreso de los datos (Entrada) y los resultados del sistema (Salida).
Durante la ejecución de la aplicación, se produce una especie de diálogo entre ambos: el usuario y la
máquina. Para que este diálogo sea lo más ameno posible y se minimicen los errores, hay que poner
especial atención en el diseño de la Interfaz Gráfica del Usuario (IGU), que también suele llamarse Interfaz
Hombre – Máquina: es la que relaciona al usuario con la aplicación.
En la realidad, para construir una IGU eficaz, debemos empezar por conocer a los usuarios a los que
va dirigida: edad, sexo, capacidades físicas, estudios, nivel cultural o étnico, motivación, metas y
personalidad.
Los usuarios se pueden categorizar como:

Novatos: Sin conocimientos del uso de la computadora en general.

Esporádicos: Recuerdan vagamente el uso de la computadora.

Frecuentes: Conocen bien el uso de la computadora; son los que investigan y buscan accesos
directos y modos abreviados de interacción (ejemplo: teclas rápidas).
El diseño de la IGU para una aplicación tiene que ver con el estudio de las personas y con los
aspectos de la tecnología. Cuando se va a diseñar la IGU, básicamente nos tenemos que preguntar lo
siguiente:

¿Quién será el usuario de la aplicación?

¿Cómo aprenderá el usuario a interactuar con la misma?

¿Cómo va a interpretar la información de salida producida por la aplicación?

¿Qué es lo que espera el usuario de dicha aplicación?
Directrices para el diseño de Interfaces
Existen tres categorías de consejos a tener en cuenta al momento de diseñar la IGU. Estas son:
1) INTERACCIÓN GENERAL
Abarcan todo lo referente a la visualización de la información, a la entrada de datos y al control general
de la aplicación. Algunos consejos sobre la interacción general son los siguientes:

Ser consistente: Usar un formato consistente para la selección del menú, introducción de órdenes y
visualización de datos. Si en una pantalla se ingresan datos de determinada forma, en las demás también.
Si el menú se encuentra en una barra en la parte superior del formulario, en los demás formularios debe
estar en el mismo lugar. De esta manera, se evita la confusión y el usuario no se pierde por el sistema y se
adapta más rápido al uso de la aplicación. Lo mismo pasa con los colores, los fondos, los íconos, todo debe
ser homogéneo.

Ofrecer Respuestas Significativas: Darle al usuario respuestas visuales y auditivas para garantizar
que se establece la comunicación en ambos sentidos.

Pedir verificación de cualquier acción destructiva importante: Por ejemplo, si un usuario pide dar
de baja un registro, avisarle que se perderá información y hacer que confirme la baja. Si pide finalizar el
programa debe aparecer un mensaje que pida su confirmación como por ejemplo “¿Está usted seguro?”.

Permitir deshacer la mayoría de las acciones: Las funciones Deshacer y Rehacer han salvado a
miles de usuarios de millones de horas de frustración.

Reducir la cantidad de información que se debe memorizar entre acciones: No se debe esperar
que el usuario recuerde una lista de números o nombres para reusarlos en las funciones siguientes. Estos
datos deben quedar en pantalla.

Buscar la eficiencia en el diálogo, el movimiento, el pensamiento: La cantidad de Clicks deben
minimizarse; se debe considerar la distancia que debe moverse el mouse entre botones al diseñar la
distribución de los objetos en la pantalla. . El usuario no debe encontrarse con situaciones donde se tenga
que preguntar: “¿Y ahora qué significa esto?”.

Categorizar las actividades por función y organizar la pantalla de acuerdo a esto: Una de las
ventajas del menú desplegable es la capacidad de organizar las órdenes por tipo. Por ejemplo, el menú
Archivo, posee un submenú desplegable con todas las opciones que se pueden realizar sobre los archivos
(Guardar, Imprimir, etc.).

Proporcionar ayuda sensible al contexto: En lo posible, y tal vez en las operaciones que así lo
requieran, el usuario debe poder activar una pequeña ayuda contextual acerca del objeto que no entiende
(por ejemplo el clic derecho sobre un botón, o las pistas de ayuda).

Usar verbos de acción sencillos o frases verbales cortas para nombrar las órdenes: Un nombre
largo de órdenes es más difícil de reconocer y de recordar. Y ocupa mucho espacio innecesario en la lista
del menú.
2) VISUALIZACIÓN DE LA INFORMACIÓN:
Si la información presentada por la IGU es incompleta o ambigua, la aplicación no podrá satisfacer las
necesidades del usuario. Consejos:

Mostrar sólo la información que sea relevante en el contexto actual: El usuario no tiene que vagar a
través de datos, menús y gráficos extraños para obtener la información relativa a una función específica del
sistema.

No abrumar al usuario: No llenarlo de datos, usar un formato de visualización que le permita asimilar la
información rápidamente. Los gráficos y esquemas deben reemplazar a las tablas voluminosas.

Usar abreviaturas estándar y colores predecibles: No confundir al usuario con formatos de
abreviaturas poco usadas. Los colores deben ser claros, nunca fuertes pues cansan la vista.

Permitir al usuario mantener el contexto visual: Si se reduce o amplía la escala de los gráficos la
imagen original debe permanecer en una esquina de la pantalla para que el usuario comprenda cuál es la
porción del gráfico que está viendo (por ejemplo, el Paint cuando ampliamos el dibujo).

Producir mensajes de error significativos: El usuario debe entender el error para poder corregirlo;
por lo tanto los mensajes de error deben ser claros y describir el problema. Se deben evitar mensajes tales
como “ Error Nro 45”, u otros que no son claros y no especifican bien qué se está haciendo mal.

Usar mayúsculas y minúsculas, tabulaciones y agrupamiento del texto para ayudar a entenderlo:
Mucha de la información visualizada en una IGU es texto, y la distribución y formato del mismo tiene un
impacto significativo en la facilidad con la que el usuario asimila la información.

Estudiar la geografía disponible en la pantalla y usarla eficientemente: Cuando hay que usar
múltiples ventanas, debe haber espacio disponible para mostrar por lo menos una parte de cada una. El
tamaño de la pantalla debe elegirse para albergar el tipo de aplicación que se va a implementar.
3) ENTRADA DE DATOS:
El usuario pasa la mayoría del tiempo eligiendo órdenes, ingresando datos y otras formas de
proporcionar entradas a la aplicación. El teclado sigue siendo el medio principal de introducción; luego le
sigue el mouse. Pero el escáner y los sistemas de reconocimiento de voz están convirtiéndose en
alternativas efectivas. Consejos:

Minimizar la cantidad de acciones de entrada de datos que necesita realizar el usuario: Reducir la
cantidad de escritura necesaria. Esto se puede lograr usando el mouse para elegir de entre un conjunto de
datos como puede ser un cuadro combinado, un cuadro de lista, botones de opción, casillas de verificación,
y hasta los mismo botones Aceptar y Cancelar en lugar de escribir nosotros tales palabras.

Mantener la consistencia entre la visualización y la introducción de datos: Si cuando ingreso un
dato en un cuadro de texto su etiqueta me indica que lo que ingreso es un código de legajo, en la salida
también debe figurar como código de legajo y no como Número de Empleado, por decir un ejemplo.

Pemitir al usuario personalizar la entrada: Un usuario experto podría decidir crear órdenes
personalizadas o deshacerse de algunos mensajes de advertencia y de verificación de acciones.

Desactivar las órdenes inapropiadas en el contexto de las acciones actuales: Esto protege al
usuario de intentar alguna acción que podría provocar errores.

Proporcionar ayuda en todas las acciones de entrada: Se debe especificar qué dato se requiere y en
qué formato.

Eliminar las entradas innecesarias: No pedirle al usuario que especifique unidades en las entradas de
datos (por ejemplo, que escriba el signo $ o %). No pedirle por ejemplo que ingrese .00 para cantidades
enteras de dinero. Proporcionar valores predeterminados siempre que sea posible, y nunca pedirle al
usuario que ingrese información que pueda adquirirse automáticamente o calcularse internamente en el
programa (por ejemplo, la fecha actual no debe ingresarse).
Fuente: “Ingeniería del Software, un Enfoque Práctico”, de Roger S. Pressman, Ed. McGraw Hill.