Diseño de interfaz de usuario

3,095 views

Published on

En esta presentación se muestra el proceso que se lleva a cabo durante el dieseño de interfaz de usuario

Published in: Education
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
3,095
On SlideShare
0
From Embeds
0
Number of Embeds
78
Actions
Shares
0
Downloads
88
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Diseño de interfaz de usuario

  1. 1. Diseño de la interfaz de usuario Yesith Valencia, MsC yesithvalencia@gmail.com
  2. 2. Diseño de interfaz de usuario 2http://www.nuevosvecinos.com/descargas/ims-46-47/Plano%20casa.jpg
  3. 3. Diseño de interfaz de usuario 3 http://www.casaskela.cl/planos/general/Plano-Casa-El-Yeco_2.jpg
  4. 4. Diseño de interfaz de usuario 4 http://3.bp.blogspot.com/-o5OjyMmTVu0/Tz7ne2nlqFI/AAAAAAAAAbc/AGgZos0IViA/s1600/fachada+principal-casas-modernas.jpg
  5. 5. Diseño de interfaz de usuario • Entre componentes de software • Entre el software y entidades externas • Entre el ser humano y la computadora Diseño de interfaz de usuario 5
  6. 6. En qué consiste ? • En crear una comunicación efectiva entre el ser humano y la computadora siguiendo un conjunto de principios Diseño de interfaz de usuario 6 Quién lo hace ? • El ing. De software / Ing. De sistemas Por qué es importante ? • Porque crea la percepción que crea el usuario del software
  7. 7. 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 Diseño de interfaz de usuario 7 Cómo se sabe que está correcto ? • El usuario debe hacer una prueba de manejo
  8. 8. 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 ? Diseño de interfaz de usuario 8
  9. 9. Reglas de oro 1. Dar control al usuario 2. Reducir la carga de memoria 3. Lograr que la interfaz sea consistente Diseño de interfaz de usuario 9
  10. 10. 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 Diseño de interfaz de usuario 10
  11. 11. 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 Diseño de interfaz de usuario 11
  12. 12. 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 Diseño de interfaz de usuario 12
  13. 13. El proceso Diseño de interfaz de usuario 13
  14. 14. 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 ? Diseño de interfaz de usuario 14
  15. 15. El proceso: Análisis del usuario, la tarea y el entorno Análisis del Usuario 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 ? Diseño de interfaz de usuario 15
  16. 16. El proceso: Análisis del usuario, la tarea y el entorno Análisis del Usuario Algunas preguntas: Trabaja en la casa ? Idioma materno ? Expertos en el tema (entiende el sistema) ? Diseño de interfaz de usuario 16
  17. 17. El proceso: Análisis del usuario, la tarea y el entorno 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 Diseño de interfaz de usuario 17
  18. 18. 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 Diseño de interfaz de usuario 18
  19. 19. El proceso: Diseño de interfaz Diseño de interfaz de usuario 19 • 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.
  20. 20. El proceso: Diseño de interfaz Diseño de interfaz de usuario 20 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
  21. 21. El proceso: Diseño de interfaz Diseño de interfaz de usuario 21
  22. 22. El proceso: Implementación de la interfaz Se crea un prototipo que permita evaluar los escenarios Diseño de interfaz de usuario 22
  23. 23. El proceso: Implementación de la interfaz 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 Diseño de interfaz de usuario 23
  24. 24. El proceso: Implementación de la interfaz 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. Diseño de interfaz de usuario 24
  25. 25. 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 Diseño de interfaz de usuario 25
  26. 26. 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 Diseño de interfaz de usuario 26
  27. 27. 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 27

×