Diseño de interfaz de usuario

Diseño de la interfaz de usuario

Yesith Valencia, MsC (e)

[email protected]

Yesith Valencia MsC(e), Docente UDI 2 http://www.nuevosvecinos.com/descargas/ims-46-47/Plano%20casa.jpg

http://www.nuevosvecinos.com/descargas/ims-46-47/Plano casa.jpg





Yesith Valencia MsC(e), Docente UDI 3 http://www.casaskela.cl/planos/general/Plano-Casa-El-Yeco_2.jpg

http://www.casaskela.cl/planos/general/Plano-Casa-El-Yeco_2.jpg







Yesith Valencia MsC(e), Docente UDI 4 http://3.bp.blogspot.com/-o5OjyMmTVu0/Tz7ne2nlqFI/AAAAAAAAAbc/AGgZos0IViA/s1600/fachada+principal-casas-modernas.jpg

http://3.bp.blogspot.com/-o5OjyMmTVu0/Tz7ne2nlqFI/AAAAAAAAAbc/AGgZos0IViA/s1600/fachada+principal-casas-modernas.jpg







Diseño de interfaz de usuario

• Entre componentes de software

• Entre el software y entidades externas

• Entre el ser humano y la computadora

Yesith Valencia MsC(e), Docente UDI 5

En qué consiste ?

• En crear una comunicación efectiva entre el ser humano y la computadora siguiendo un conjunto de principios


Quién lo hace ?

• El ing. De software

Por qué es importante ?

• Porque crea la percepción que crea el usuario del software

Cuáles son los pasos ?

• Identificar los requisitos, las tareas y el ambiente

• Definir el conjunto de objetos y acciones para la interfaz

• Crear formatos de pantalla, diseño gráfico y ubicación de iconos

• Revisar los artefactos


Cómo se sabe que está correcto ?

• El usuario debe hacer una prueba de manejo

Preguntas que se deben plantear

• Quién es el usuario ?

• Cómo aprende a interactuar con un nuevo sistema ?

• Cómo interpreta la información ?

• Qué espera del sistema ?


Reglas de oro

1. Dar control al usuario

2. Reducir la carga de memoria

3. Lograr que la interfaz sea consistente


1. Dar control al usuario

• Definir las formas de interacción de forma que el usuario no realice acciones innecesarias o indeseables: activar y desactivar una opción sin esfuerzo

• Proporcionar una interacción flexible: interactuar mediante el mouse, táctil, comandos del teclado.

• Tener las opciones de interrumpir y deshacer


2. Reducir la carga de memoria

• Reducir la memoria a corto plazo: reconocer acciones sin tener que recordarlas

• Definir accesos directos intuitivos: Ctrl + P

• Desglosar la información de manera progresiva: Subrayar palabras


3. Lograr que la interfaz sea consistente

• Contextualizar al usuario: títulos de la ventana, íconos, colores, opciones

• Consistencia en la familia de aplicaciones: Office 2010

• Conservar los modelos mentales: Ctrl + G


El proceso


El proceso: Análisis del usuario, la tarea y el entorno

Análisis del Usuario

Registrar el perfil, grado de habilidad, comprensión del trabajo, disposición ante el nuevo sistema.

Describir las tareas que el usuario realiza para alcanzar los objetivos del sistema

Análisis del entorno: Dónde se localizará físicamente la interfaz ? El usuario estará sentado, de pie, realizará otras tareas ? El Hw tiene restricciones de espacio, iluminación ?




Fuentes de información: Entrevistas, Información de ventas, de mercadotecnia.

Algunas preguntas:

Qué grado de estudio tiene ?

Es capaz de aprender de un tutorial ?

Es experto tecleando ?

Edad, Sexo, sueldo, horario de trabajo ?




Algunas preguntas:

Trabaja en la casa ?

Idioma materno ?

Expertos en el tema (entiende el sistema) ?



Análisis de tareas

Responder las siguientes preguntas:

Qué trabajo hará el usuario ?

Qué otras tareas se realizan mientras el usuario trabaja ?

Cuál es la secuencia o jerarquía de las tareas ?

UML, BPMN


El proceso: Diseño de interfaz

• definir los objetos y las acciones de la interfaz

• Definir las acciones del usuario que cambiarán el estado de la interfaz

• Representar cada estado de la interfaz como lo verá el usuario final




• Escenario. El propietario de la casa desea acceder al sistema HogarSeguro instalado en su casa. Mediante el sistema operativo de un PC remoto (por ejemplo, un portátil que el propietario se lleve al trabajo o de viaje), el propietario determina el estado del sistema de alarma, arma o desarma el sistema, reconfigura las zonas de seguridad y observa las diferentes habitaciones de la casa mediante la preinstalación de una cámara de vídeo.



Tareas del propietario:

• acceder al sistema HogarSeguro;

• introducir un ID y una contraseña para permitir un acceso remoto

• comprobar el estado del sistema;

• activar o desactivar el sistema HogarSeguro;

• visualizar el plano de la casa y las localizaciones de los sensores

• Visualizar zonas en el plano de la casa;

• cambiar zonas en el plano de la casa;

• visualizar las localizaciones de las cámaras de vídeo en el plano de la casa

• seleccionar la cámara de vídeo para tener visión;

• observar las imágenes de vídeo (cuatro encuadres por segundo)

• recorrer y ampliar las habitaciones con la cámara de vídeo

El proceso: Implementación de la interfaz

Se crea un prototipo que permita evaluar los escenarios



Temas de diseño

Tiempo de respuesta: desde que el usuario realiza una acción hasta que el sistema responde

Funciones de ayuda: disponible en línea y para todas las funciones del sistema y en todo momento

Manejo de errores: No ofrecer información inútil, debe describir el problema en lenguaje del usuario, dar concejos sobre la manera de recuperarse, tener una pista visual, no tener juicios sobre el usuario



Temas de diseño

Rotular menús y comandos: comandos para los menús que sean fácil de recordar, submenús consistentes

Accesibilidad de la aplicación: fácil acceso a quienes tienen necesidades especiales: visual, auditiva, movilidad, habla o aprendizaje

Internacionalización: para otras localidades e idiomas: formato de pantalla, alfabetos, horas y fechas.


El proceso: Validación

Es la capacidad para implementar correctamente todas las tareas del usuario, y cumplir con los requerimientos del usuario

Se valida la facilidad de uso y el aprendizaje de la interfaz


El proceso: Validación

Se pueden usar técnicas formales de evaluación:

Preguntas o cuestionarios: de respuesta simple (sí/no), respuesta numérica, respuesta con escala de valoración (subjetiva), respuesta abierta, hojas de evaluación: del 80 al 100 % de los usuarios rechazan el mecanismo para guardar los datos .

De acuerdo a estas evaluaciones se realiza la siguiente versión


Bibliografía

• Ingeniería del software, Un enfoque práctico: Pressman 6th edición

• Ingeniería del software, Ian Sommervil, 7th edición


Diseño de interfaz de usuario

Education

Transcript of Diseño de interfaz de usuario