Transcript Directrices de diseño

Ciclo de Desarrollo de Aplicaciones Informáticas
I.E.S. “Agora”
Interacción Persona-Ordenador
Diseño de interfaces gráficas de usua
Ciclo de Desarrollo de Aplicaciones Informáticas
I.E.S. “Agora”
Principios fundamentales del diseño
Son conceptos de alto nivel que deberían ser empleado
Uno de los clásicos: reglas de oro de Mandel.
Agrupa los principios en función de tres objetivos:
 Colocar
a los usuarios en el control de la interfaz.
 Reducir la carga de memoria de los usuarios.
 Hacer una interfaz de usuario consistente.
Ciclo de Desarrollo de Aplicaciones Informáticas
I.E.S. “Agora”
Reglas de oro de Mandel: colocar a los us
□ Las











directrices a aplicar para conseguir el objetivo son :
Emplear los modos adecuadamente.
Permitir a los usuarios utilizar el teclado y el ratón.
Permitir a los usuarios cambiar la atención.
Mostrar a los usuarios mensajes y textos descriptivos.
Proporcionar retroalimentación.
Proporcionar acciones inmediatas y reversibles.
Proporcionar caminos significativos y salidas.
Acomodar a los usuarios con diferentes niveles de habilidad.
Hacer la interfaz de usuario transparente.
Permitir al usuario personalizar la interfaz.
Permitir al usuario manipular los objetos de la interfaz.
Ciclo de Desarrollo de Aplicaciones Informáticas
I.E.S. “Agora”
Emplear los modos adecuadamente
Ventanas modales y no modales.
No emplear ventanas modales de forma innecesaria.
Utilizarlas cuando:
 Se ha producido un error crítico que impide a la aplicación s
Ejemplo: no hay espacio en disco.
 El usuario solicite una acción y sea necesario proporcionar
 No utilizarlas cuando:
 Se produzca un error no crítico y que el usuario no pueda co
Ejemplo: cuadro de diálogo abrir.
Ciclo de Desarrollo de Aplicaciones Informáticas
I.E.S. “Agora”
Permitir a los usuarios utilizar teclado y ra
Aunque es posible optimizar la interfaz para usuario
Esto dotará a la interfaz de las siguientes ventajas:
 Facilidad para los usuarios que provengan de otros entornos.
 Facilidades a los usuarios con necesidades especiales.
 Continuidad ante fallos o inexistencia del ratón.
Este principio no aparece en diversas guías de estilo
Ciclo de Desarrollo de Aplicaciones Informáticas
I.E.S. “Agora”
Permitir a los usuarios cambiar la atención
Los usuarios deben poder interrumpir sus acciones actu
 Una vez lanzada una tarea larga y no crítica el usuario debería
La tarea deberá reclamar la atención una vez termine.
 Cuando sea una tarea en varios pasos no hay que obligar al us
 Dar la sensación de que el usuario lleva el control.
Ciclo de Desarrollo de Aplicaciones Informáticas
I.E.S. “Agora”
Mostrar a los usuarios mensajes y textos d
Mensajes claros, útiles descriptivos y fáciles de entende
Evitar el lenguaje excesivamente técnico.
Ciclo de Desarrollo de Aplicaciones Informáticas
I.E.S. “Agora”
Proporcionar retroalimentación
Es necesario informar de los procesos en curso.
Mediante mensajes en cuadros de diálogo.
Mediante mensajes en barras de estado.
Barras de progreso.
Adecuado cuando:
Se están realizando operaciones largas.
Se va a realizar un proceso irreversible.
Se debe proporcionar información clara e identificativa.
Ciclo de Desarrollo de Aplicaciones Informáticas
I.E.S. “Agora”
Proporcionar retroalimentación (II)
Ciclo de Desarrollo de Aplicaciones Informáticas
I.E.S. “Agora”
Proporcionar retroalimientación (III)
Los mensajes no deben ser intrusivos.
• No deben molestar con información intrascendente.
Ciclo de Desarrollo de Aplicaciones Informáticas
I.E.S. “Agora”
Proporcionar acciones inmediatas y rever
Es deseable que todas las operaciones realizadas con l
Otorga confianza al usuario.
Le anima a investigar sin miedo.
Opciones de "deshacer" y "rehacer".
Principio del esfuerzo proporcionado.
 Cuando un proceso es difícil de recuperar, también debe ser m
Ciclo de Desarrollo de Aplicaciones Informáticas
I.E.S. “Agora”
Proporcionar caminos significativos y sali
Permitir la navegación fácil a través de la interfaz.
Proporcionar un contexto que indique:
Dónde están.
Dónde han estado.
Dónde pueden ir.
Cómo abandonar.
En páginas web:
Mapas del sitio.
Indicadores en las cabeceras de páginas.
En aplicaciones de escritorio:
Barras de tareas, barras de herramientas.
Títulos de las ventanas.
Ciclo de Desarrollo de Aplicaciones Informáticas
I.E.S. “Agora”
Proporcionar caminos significativos y sali
Ciclo de Desarrollo de Aplicaciones Informáticas
I.E.S. “Agora”
Proporcionar caminos significativos y sali
Ciclo de Desarrollo de Aplicaciones Informáticas
I.E.S. “Agora”
Acomodar a los usuarios con diferentes n
No sacrificar a los usuarios expertos por una interfaz más
Es necesario proporcionar caminos rápidos para los usua
Atajos de teclado.
Lo ideal:
 Interfaces personalizables que permitan a los usuarios eleg
Ciclo de Desarrollo de Aplicaciones Informáticas
I.E.S. “Agora”
Hacer una interfaz de usuario transparen
Una interfaz transparente permite al usuario sentirse co
Buen ejemplo de transparencia:
Papelera de reciclaje.
Mal ejemplo de transparencia:
CTRL+ALT+SUPR para ejecutar el administrador de tareas.
Ciclo de Desarrollo de Aplicaciones Informáticas
I.E.S. “Agora”
Permitir al usuario personalizar la interfaz
Los usuarios se encuentran más confortables cuando pu
 Configurar la presentación (colores, fuentes, aspectos inte
 Configurar el comportamiento (acciones por omisión, boto
 Configurar la interacción (teclas de método abreviado, mne
Es interesante incluir también una opción que permita re
Ciclo de Desarrollo de Aplicaciones Informáticas
I.E.S. “Agora”
Permitir al usuario manipular los objetos d
Fomentar que el usuario manipule directamente los objetos de la p
Algunas veces las interfaces de manipulación directa fallan porque
 No queda claro qué cosas se pueden hacer al arrastrar y soltar objetos
 Es necesario hacer más obvias las manipulaciones.
Ciclo de Desarrollo de Aplicaciones Informáticas
I.E.S. “Agora”
Reglas de oro de Mandel: Reducir la carga
La reducción de la carga de la memoria facilitará el apre
 Permitirá al usuario recordar, más que aprender, el funcionamie
Algunos principios para lograr este objetivo:
Aliviar la memoria a corto plazo.
Confiar en el reconocimiento.
Proporcionar pistas visuales.
Proporcionar opciones por omisión.
Proporcionar atajos de teclado.
Promover la sintaxis objeto-acción.
Emplear metáforas del mundo real.
Emplear la revelación progresiva.
Promover la claridad visual.
Ciclo de Desarrollo de Aplicaciones Informáticas
I.E.S. “Agora”
Aliviar la memoria a corto plazo
El usuario realizar en el ordenador varias acciones al mi
 Es necesario incluir en la interfaz mecanismos que permita
Para este objetivo se puede recurrir a:
 Incluir
acciones de "deshacer" y "hacer".
Permiten retornar es estados anteriores sin necesidad de recordar
 Utilizar las opciones de cortar, copiar y pergar.
Permiten almacenar en la memoria del ordenador información que s
Ciclo de Desarrollo de Aplicaciones Informáticas
I.E.S. “Agora”
Confiar en el reconocimiento
Permitir recuperar información de la memoria a largo plazo mostr
 Es
más fácil seleccionar elementos que recordarlos.
Ciclo de Desarrollo de Aplicaciones Informáticas
I.E.S. “Agora”
Promocionar pistas visuales
 El usuario debe saber donde está, qué está haciendo y qué e
Ciclo de Desarrollo de Aplicaciones Informáticas
I.E.S. “Agora”
Proporcionar pistas visuales (II)
Ciclo de Desarrollo de Aplicaciones Informáticas
I.E.S. “Agora”
Proporcionar tareas por omisión
Es conveniente que el usuario pueda restaurar la interfaz a su esta
Es frustrante llegar a un punto de personalización del que es difícil
El restablecimiento de opciones por omisión permite restaurar de m
Ciclo de Desarrollo de Aplicaciones Informáticas
I.E.S. “Agora”
Proporcionar atajos de teclado
Los atajos de teclado economizan el número de pulsaci
Dos formas:
 Mnemotécnicos.
Teclas de método abreviado.
Ciclo de Desarrollo de Aplicaciones Informáticas
I.E.S. “Agora”
Promover la sintaxis objeto-acción
No es necesario diseñar una interfaz totalmente orientada a objeto
 Menús
contextuales.
Este tipo de sintaxis evitar tener que recordar todas las opciones p
Ciclo de Desarrollo de Aplicaciones Informáticas
I.E.S. “Agora”
Emplear metáforas del mundo real
 Una vez elegida una metáfora es necesario mantenerla
 Es
posible ampliarla, pero no cambiarla.
Ciclo de Desarrollo de Aplicaciones Informáticas
I.E.S. “Agora”
Emplear la revelación progresiva
 No
abrumar al usuario con las funciones de un producto.
 Mostrar
sólo lo que el usuario necesita cuando y dónde lo necesita.
Ciclo de Desarrollo de Aplicaciones Informáticas
I.E.S. “Agora”
Promover la claridad visual
Aplicar principios de diseño visual de la percepción humana.
 Agrupación.
 Numeración de elemento.
Establecer prioridades en la importancia de los elementos mostra
No disponer demasiados elementos en la pantalla.
Distribuir bien los elementos.
Ciclo de Desarrollo de Aplicaciones Informáticas
I.E.S. “Agora”
Reglas de oro de Mandel: interfaz de usuario
Una interfaz bien diseñada permitirá a los usuarios transfe
Debe ser consistente con otros programas que haya utilizado
Dentro de un programa será más fácil su aprendizaje si ex
Algunos principios que fomentan la consistencia:
Preservar el contexto de trabajo de los usuarios.
Mantener la consistencia dentro y entre productos.
Ciclo de Desarrollo de Aplicaciones Informáticas
I.E.S. “Agora”
Preservar el contexto de trabajo de los usu
Los usuarios deben ser capaces de completar trabajos s
Es incómodo tener que estar cambiando constantement
El cambio de estilo de entrada debe ser una decisión de
Ciclo de Desarrollo de Aplicaciones Informáticas
I.E.S. “Agora”
Mantener la consistencia dentro y entre pr
Presentación.
 Los usuarios deben ver la información y los objetos de la misma forma lógic
 Importancia de las guías de estilo.
 Dentro de la aplicación aplicar los mismos conceptos de diseño visual a los
Comportamiento.
 Un objeto debería trabajar siempre de la misma forma.
 El usuario no debe verse sorprendido por el comportamiento de los objetos
 Los usuarios tienden a cuestionar su comportamiento, más que el del produ
Técnicas de interacción.
Deben mantenerse a lo largo de aplicación y entre aplicaciones.
 Los mnemotécnicos y las teclas de método abreviado no deberían cambiar