Este documento describe los principios básicos del diseño de interfaces gráficas de usuario. Explica que una interfaz debe ser amigable, consistente y proporcionar retroalimentación al usuario. También destaca la importancia de validar los datos de entrada del usuario y presentar los resultados de una manera directa, accesible y estéticamente agradable.

1. Interfaz Grafica
DEL USUARIO

2. Fernando Ariel Lugones
Metodología de Sistemas 4ºC
13/11/2013
Bibliografía: Bruce Tognassini
•Pautas de Diseño de Interfaces
Gráficas Basadas en el Modelo
de Aprendizaje S.O.I.,
•Linux
•Gregoria Romero, Youtube

3. Interfaz Gráfica del Usuario
•
•
•
•
Permite ver y manipular los datos de la aplicación
Es parte del nivel de presentación
Se conecta al nivel del negocio
Un buen diseño de interfaz de usuario puede
significar una ventaja competitiva

4. Importancia de un buen diseño de interfaz
• Las interfaces ha ido evolucionando conforme al
tiempo, no solo por los avances tecnológicos sino
también por las necesidades del usuario.
• En un Mercado competitivo como el actual, en
donde se desarrollan aplicaciones para usuarios, es
muy importante tener un buen diseño. Una interfaz
amigable e intuitiva es mas atractiva para los
usuarios.

5. Principios de diseño
Para diseñar correctamente una interfaz de usuario
debemos:
•Identificar la navegación para los usuario de la interfaz
•Validar los datos de entrada
•Establecer formas apropiadas para presentar
resultados

6. Antes de realizar el diseño de una interfaz de usuario se
debe considerar lo siguiente:
• La estructura en la interfaz
• Los objetos que se van a estar manipulando
• La facilidad que tiene el usuario para el manejo de
las funcionalidades de la aplicación
• La mejor manera de presentar todos los objetos
dentro de la aplicación

7. Principios básicos de diseño para interfaces de usuario
•
•
•
•
•
•
•
Amigable al uso
Control del Usuario
Consistencia
Retroalimentación
Directo
Accesos Rápidos
Estética

8. Amigable al uso
• Se debe de minimizar el numero de pasos a seguir
para completar una tarea

9. Control del usuario
• El usuario tiene que tener la confianza en que el
sistema responderá según lo que quiera

10. Consistencia
• Aplicar los conocimientos adquiridos
• Uso de estándares

11. Retroalimentación
• Los sistemas deben ser capaz de darle información al
usuario

12. Directo
• Debe de mostrarle al usuario de una manera visual el
resultado de alguna acción

13. Accesos Rápidos
• Para completar alguna tarea mucho más rápido
• Una manera mas cómoda

14. Estética
• Visiblemente amigable
• Correcta posición de los elementos

15. Identificar la forma de navegar a traves de una
interfaz de usuario
• Los usuarios que utilizan la computadora como su
herramienta de trabajo encuentran muy importante
la forma en que ellos estarán navegando a través de
las ventanas y opciones.

16. Asistencia para el Usuario
•
•
•
•
•
Menu de ayuda o archivos de ayuda
Tooltips y barras de estado
Asistencia de tareas
Asistencia(el asistente de algún programa)
Que es esto?

17. Procedimientos de entradas y salidas
Entradas:
1.Validar que pertenezca al alfabeto deseado
2.Que este en el rango esperado
Salidas:
1.Posición
2.Consistencia
3.Simple

18. Como implementar las interfaces
• Unicode: El lenguaje internacional de la norma
página de códigos puede soportar casi todos los
idiomas conocidos y símbolo en uso hoy en día
• Installs Shieds: Proporciona herramientas de
desarrollo de software diseñado para permitir la
distribución de software para todas las plataformas
Windows
• Microsoft Systems Management Server: Una
solución completa para la gestión de los ordenadores
personales de forma centralizada en una red de
cualquier tamaño

19. Cuestiones de Interfaces
Hacer uso eficaz de las interfaces de múltiples
documentos(MDI):
•Los documentos(MDI) permite a los usuarios trabajar
con más documentos a la vez

20. Navegacion en la interfaz de usuario
•
•
•
•
•
•
•
Los menús proveen una forma sencilla de navegar
La simplicidad y consistencia son muy importantes
Se debe pensar en:
La estructura de la interfaz
Los objetos que manipula el usuario
Las vistas para mostrar esos objetos
Los controles

21. Validación de datos de entrada
• Verificar que todos los datos que proporciona el
usuario sean correctos
• Validación del tipo de dato
• Validación del rango

22. Características de la Interfaz Gráfica
•
•
•
•
•
•
•
•
•
•
•
•
Anticipación
Autonomía
Consistencia
Valores predeterminados
Eficacia del Usuario
Interfaces explorables
Objetos de la interfaz humana
Aprendizaje
Metáforas
Proteger el trabajo de los usuarios
Legibilidad
Navegación Visible

23. Anticipación
• Las aplicaciones deben intentar anticipar
necesidades y deseos de los usuarios

24. Autonomía
• El ordenador, la interfaz y el entorno de tarea
pertenecen al usuario
• Utilizar los mecanismos del estado para mantener los
usuarios consciente e informado
• Mantener información de estado hasta la fecha y
dentro de vista fácil

25. Consistencia
• Niveles de consistencia
• Imcopatibilidad
• La consistencia más importante es la consistencia
con las expectativas del usuario

26. Valores predeterminados
• Campos que contienen valores predeterminados
deben subir seleccionados
• Por defecto debería ser inteligente y sensible

27. Eficacia del Usuario
• Mira en la productividad del usuario, no de la
computadora
• Mantener al usuario ocupado
• Para maximizar la eficiencia de una empresa u otra
organización debe maximizar la eficiencia de todo el
mundo

28. Interfaces explorables
• Dar señales y caminos bien señalizados a los usuarios
• Ofrecer a los usuarios pautas perceptuales
• Realizar acciones reversibles

29. Objetos de la interfaz humana
• Objetos de la interfaz humana puede ser vistos,oído,
tocado o percibe lo contrario
• Tiene una forma estandar de interacción
• Tienen comportamiento resultantes estandar
• Deben ser compresibles, uniformes y estables

30. Aprendizaje
• Limitar las ventajas y desventajas

31. Metáforas
• Elegir bien las metáforas, que permitirán a los
usuarios a comprender al instante los detalles más
finos del modelo conceptual

32. Proteger el trabajo de los usuarios
• Asegurarse de que los usuarios nunca pierdan su
trabajo como resultado de error de su parte, o
cualquier otro motivo inevitable

33. Legibilidad
• Texto que debe leerse debe tener alto contraste

34. Navegación visible
• Evitar la navegación invisible, la mayoría de los
usuarios no puede y no construirá la elaboración de
mapas conceptuales

35. Pautas de Diseño de Interfaz Gráfica de Usuario
1. Estructura de la información y las tareas del
usuario en la aplicación
2. Punto focal en la ventana
3. Estructura y consistencia entre ventanas
4. Relación entre elementos
5. Legibilidad y flujo entre elementos
6. Integración

36. Redacción de texto en la interfaz
• Brevedad: Se sugiere eliminar las palabras
innecesarias y redactar textos breves sin sacrificar la
claridad y facilidad de comprensión
• Lenguaje: Utilizar la gramática correcta y estándar,
un lenguaje claro y coherente en la interfaz mejora la
facilidad de uso de la aplicación

37. Accesibilidad
• La aplicación debe ser accesible para todos los
usuarios o la mayoría de ellos, dependiendo el
contexto o la usabilidad que se pretender dar.
• Exiten estrategias de diseño, dependiendo de las
necesidades a cubrir.

38. Formas apropiadas para presentar resultados
Las formas de representar los resultados en una
aplicación tiene gran impacto sobre la usabilidad de
la aplicación. Los aspectos a tomar en cuenta son:
•La posición y el orden
•La consistencia
•Representación graficas conocidas
•Espacio vacíos dentro de la misma
•Simpleza