Ing. Elizabeth Guerrero V.

Transcripción

1 Ing. Elizabeth Guerrero V.

2 Interfaz de usuario Principios de diseño de las interfaces de usuario Recuperabilidad Retroalimentación Tipos de interfaz de usuario Reglas para el diseño de la interfaz de usuario Lo que no se debe hacer en un diseño El proceso de diseño de la interfaz de usuario

3 Conjunto de elementos hardware y software de un computador que presentan información al usuario y le permiten interactuar con la información y con el computador.

4 Principio Familiaridad del usuario Uniformidad Mínima sorpresa Recuperabilidad Guía de usuario o Retroalimentación Diversidad de usuarios Descripción En la interfaz se debe utilizar términos y conceptos obtenidos de la experiencia de las personas que más utilizaran el sistema La interfaz debe ser uniforme en el sentido de que las operaciones comparables se activen de la misma forma El comportamiento del sistema no debe provocar sorpresa a los usuarios La interfaz debe incluir mecanismos para permitir a los usuarios recuperarse de errores Cuando ocurran errores, ejecución de acciones que se deban confirmar, etc, la interfaz debe proporcionar retroalimentación significativa y características de ayuda sensible al contexto La interfaz debe proporcionar características apropiadas para los diferentes tipos de usuarios del sistema

5 Tres tipos de recursos para ayudar al usuario a recuperarse de errores: Confirmación de acciones destructivas: el sistema debería pedir confirmación antes de ejecutar tal acción Proporcionar un recurso para deshacer: restablece el sistema al estado previo antes de que ocurriera la acción. Generar puntos de control: implica grabar el estado de un sistema en intervalos periódicos y permitir que el sistema se restaure desde el último control

6

7 La retroalimentación sirve para que el usuario, se entere de que: La computadora aceptó la entrada La entrada se encuentra en la forma correcta La entrada no se encuentra en la forma correcta Habrá un retraso en el procesamiento La solicitud ha sido concluida La computadora es incapaz de concluir la petición Se dispone de mayor detalle en la retroalimentación (e indica la manera de obtenerla)

8 Interfaz en lenguaje natural Interfaz en lenguaje de comandos Interfaz de preguntas y respuestas Interfaz de menu Formularios de entrada/salida Interfaz gráfica de usuario (GUI) Reconocimiento de voz Pantallas sensibles al tacto Lápices ópticos

9 Permiten a usuarios interactuar con la computadora en su lenguaje cotidiano o natural. No se requieren habilidades especiales de usuarios

10 lnterfaz en lenguaje de comandos Permite al usuario controlar la aplicación con una serie de pulsaciones del teclado, comandos, frases o alguna secuencia de estos tres métodos. Es una interfaz popular entre programadores y administradores linux

11 Despliega en pantalla una pregunta para el usuario. Para interactuar, el usuario introduce una respuesta (mediante pulsaciones del teclado o un clic del ratón) y la computadora después actúa en esa información de entrada de acuerdo con su programa, normalmente pasando a la siguiente pregunta.

12 Una interfaz de menú proporciona al usuario una lista en pantalla de las selecciones disponibles. En respuesta al menú, un usuario está limitado a las opciones desplegadas. El usuario no necesita conocer el sistema pero tiene que saber qué tarea se debe realizar. Por ejemplo, con un menú típico de procesamiento de texto, los usuarios pueden escoger opciones para editar, copiar o imprimir. Sin embargo, para utilizar el mejor menú los usuarios deben saber qué tarea desean desempeñar. Los menús no dependen del hardware. Las variaciones abundan. Los menús se establecen para usar el teclado, lápiz óptico o el ratón. Las selecciones se pueden identificar con un número, carta o palabra clave. La consistencia es importante en el diseño de una interfaz de menú.

13 De barra Contextual o popup En cascada

14 Formularios de entrada/salida Las interfaces de formulario consisten de formularios en pantalla o formularios que se basan en la Web que despliegan campos que contienen datos o parámetros que necesitan ser comunicados al usuario.

15 Las interfaces gráficas de usuario (GUIs) permiten la manipulación directa de la representación gráfica en pantalla, la cual se puede realizar con la entrada del teclado, una palanca de juego o el ratón. La manipulación directa requiere mayor sofisticación del sistema que las interfaces vistas anteriormente. La clave para las GUIs es la retroalimentación constante que proporcionan. La retroalimentación continua en el objeto manipulado significa que se pueden hacer rápidamente los cambios o incluso cancelar operaciones sin incurrir en mensajes de error.

16

17 Reconocimiento de voz Pantallas sensibles al tacto Lápices ópticos

18 1. El periodo de entrenamiento necesario para los usuarios debe ser aceptablemente corto. 2. Mantener consistentes las interfaces en las aplicaciones. 3. La interfaz debe ser perfecta para que haya pocos errores y los que ocurran no sea por un mal diseño. 4. El tiempo que los usuarios y el sistema necesitan para recuperarse de los errores debe ser corto. 5. Los usuarios poco frecuentes deben poder aprender a usar el sistema en poco tiempo.

19

20 El diseñador debe dar al usuario la posibilidad de hacer su trabajo, en lugar de suponer qué es lo que éste desea hacer. La interfaz debe ser suficientemente flexible para adaptarse a las exigencias de los distintos usuarios del programa. Permitir a los usuarios utilizar el teclado o el ratón. Permitir al usuario interrumpir su tarea y continuarla más tarde. Utilizar mensajes y textos descriptivos. Permitir deshacer las acciones, e informar de su resultado Permitir una cómoda navegación dentro del producto y una fácil salida del mismo. Permitir que el usuario personalice.

21 Reducir la carga de memoria del usuario La interfaz debe evitar que el usuario tenga que almacenar y recordar información. Para ello, debe Aliviar la carga de la memoria de corto alcance (permitir deshacer, copiar y pegar; mantener los últimos datos introducidos). Ejemplo: el porta papeles de Window

22 Basarse en el reconocimiento antes que en el recuerdo ejemplo: elegir de entre una lista en lugar de teclear de nuevo

23 Proporcionar indicaciones visuales de dónde está el usuario, qué está haciendo y qué puede hacer a continuación

24 Utilizar metáforas del mundo real Considerar las metáforas para definir: Características Físicas.- Cada persona tiene diferentes características físicas. Ambiente.- El lugar donde va a ser usado el sistema. Cada interfaz tiene que adecuarse al lugar. Visibilidad.- Tomar en cuenta la cantidad de iluminación del lugar. Se refleja el brillo en la pantalla? Personalidad.- De acuerdo a la edad, nivel socio-económico, etc. Cultura.- Este factor es importante si el mercado para el sistema es a nivel internacional.

25 Presentar al usuario sólo la información que necesita Hacer clara la presentación visual (colocación/agrupación de objetos, evitar la presentación de excesiva información) Mal diseño Buen diseño

26 Construir una interfaz Consecuente Permite al usuario utilizar conocimiento adquirido en otros programas consistentes con el nuevo programa. Ejemplo: Office:

27 Consistencia dentro del propio producto y de un producto a otro. En presentación (lo que es igual debe aparecer igual: color del texto estático). En el comportamiento (un objeto se comporta igual en todas partes). la interacción (los atajos y operaciones con el ratón se mantienen; el usuario espera los mismos resultados cuando interactúa de la misma forma con objetos distintos).

28 Consistencia Consistencia en los resultados de las interacciones: misma respuesta ante la misma acción. Los elementos estándar del interfaz deben comportarse siempre de la misma forma (las barras de menús despliegan menús al seleccionarse). Consistencia de la apariencia estética (iconos, fuentes, colores, distribución de pantallas).

29 Manual de usuario Tutoriales Ayuda en línea Entrada en el nivel superior Entrada desde la aplicación Entrada desde el sistema de mensajes de error

30

31 Uso de imágenes que confunden Dónde se baja el volumen? A qué velocidad va? Por donde abro la nevera?

32 Interfaz confusa

33 Un diseñador-programador siempre tiene que tener bien validado los botones y detectar si el botón podrá usarse en cierto momento o no. Cuando un botón no esta disponible, es esencial que el programador lo DESHABILITE con algún comando como button.enable=false. En este caso en vez de hacer eso lo que hicieron fue dejar el botón tal como esta pero cuando uno posiciona el cursor encima del botón lo que sucede es que te avisa por medio del statusbar que el botón esta deshabilitado

34

35 1. El ingeniero de software crea el modelo de diseño 2. Cualquier otro ingeniero (o el mismo ingeniero del software) establece un modelo de usuario 3. El usuario final desarrolla una imagen mental que se suele llamar modelo de usuario o percepción del usuario 4. Los que implementan el sistema crean una imagen de sistema El papel del diseñador de interfaz es reconciliar estas diferencias y derivar una representación consecuente de la interfaz.

36 El proceso de diseño de las interfaces de usuario es iterativo y se puede representar mediante un modelo espiral. En la figura se puede observar que el proceso de diseño de la interfaz de usuario acompaña cuatro actividades distintas de marco de trabajo: 1. Análisis y modelado de usuarios, tareas y entornos. 2. Diseño de la interfaz 3. Implementación de la interfaz 4. Validación de la interfaz de usuario

37 La actividad de análisis inicial se concentra en el perfil de los usuarios que van a interactuar con el sistema. Esencialmente, el ingeniero del software intenta comprender la percepción del sistema para cada clase de usuario. Se identifican, describen y elaboran las tareas que lleva a cabo el usuario para conseguir los objetivos (por encima de la cantidad de pasos iterativos a través de la espiral) El análisis del entorno de usuario se centra en el entorno del trabajo físico. Entre las preguntas que se formulan se encuentran las siguientes: Dónde se ubicará físicamente la interfaz? Dónde se situará el usuario? Llevará a cabo tareas no relacionadas con el interfaz? Se adapta bien el hardware a las limitaciones de luz, espacio o ruido? Esta recopilación de información que forma parte de la actividad de análisis se utiliza para crear un modelo de análisis para la interfaz.

38 El objetivo del diseño de la interfaz es definir un conjunto de objetos y acciones de interfaz (y sus representaciones en la pantalla) que posibiliten al usuario llevar a cabo todas las tareas definidas de forma que cumplan todos los objetivos de usabilidad definidos por el sistema.

39 La actividad de implementación comienza normalmente con la creación de un prototipo que permita evaluar los escenarios de utilización. A medida que avanza el proceso de diseño iterativo, y para completar la construcción de la interfaz, se puede utilizar un kit de herramientas de usuario.

40 La validación se centra en: (1) la habilidad de la interfaz para implementar correctamente todas la tareas del usuario, para acoplar todas las variaciones de tareas, y para archivar todos los requisitos generales del usuario; (2) el grado de facilidad de utilización de la interfaz y de aprendizaje, (3) la aceptación de la interfaz por parte del usuario como una herramienta Útil en su trabajo.

41