53
UNIDAD I DISEÑO DE INTERFAZ DE USUARIO Ing. Alejandro Solís

Disenio de Inrerfaz de Usuario

Embed Size (px)

DESCRIPTION

contenido dentro de la materia para l diseno de intefaces de usuario

Citation preview

Page 1: Disenio de Inrerfaz de Usuario

UNIDAD IDISEÑO DE INTERFAZ DE USUARIOIng. Alejandro Solís

Page 2: Disenio de Inrerfaz de Usuario

• Aun cuando los diseñadores y programadores de software son usuarios competentes en la tecnología utilizada en la implementación de las interfaces, como las clases Swing de Java o XHTML, las interfaces de usuario que desarrollan a menudo son poco atractivas e inapropiadas para sus usuarios objetivo.

Principios en el diseño de interfaces

Page 3: Disenio de Inrerfaz de Usuario

• Un diseño cuidadoso de la interfaz de usuario es parte fundamental del proceso de diseño general del software.

• Un buen diseño de la interfaz de usuario es crítico para la confiabilidad del sistema.

• Muchos de los llamados «errores de usuario» son causados por el hecho de que las interfaces de usuario no consideran las habilidades de los usuarios reales y su entorno de trabajo.

Page 4: Disenio de Inrerfaz de Usuario

• Una interfaz de usuario mal diseñada significa que los usuarios probablemente no podrán acceder a algunas características del sistema, cometerán errores y sentirán que el sistema les dificulta en vez de ayudarlos a conseguir cualquier objetivo para el que utilizan el sistema.

Page 5: Disenio de Inrerfaz de Usuario

Factores importantes1. Las personas tienen una memoria limitada a corto plazo: si a

los usuarios se les presenta demasiada información al mismo tiempo, es posible que no puedan asimilarla.

2. Todos cometemos errores, especialmente cuando tenemos que manejar demasiada información o estamos estresados. Mensajes de aviso y alarmas.

Page 6: Disenio de Inrerfaz de Usuario

Factores importantes3. Poseemos un amplio rango de capacidades físicas. Unas

personas ven y escuchan mejor que otras, otras son daltónicas, y otras son mejores en manipulaciones físicas.

4. Tenemos diferentes preferencias de interacción. A algunas personas les gusta trabajar con imágenes, a otras con texto.

Page 7: Disenio de Inrerfaz de Usuario

Factores importantes• Estos factores humanos son la base para los principios de

diseño de interfaces.• Estos principios generales se aplican a todos los diseños de

interfaces de usuario

Page 8: Disenio de Inrerfaz de Usuario

PRINCIPIOS DE INTERFAZ DE USUARIO

Page 9: Disenio de Inrerfaz de Usuario

Familiaridad de usuario• Si un sistema se diseña para ser utilizado por controladores

del tráfico aéreo, los objetos deben ser aviones, trayectorias de vuelo, aerofaros, etcétera.

• Las operaciones asociadas podrían ser incrementar o reducir la velocidad del avión, ajustar la posición del avión y cambiar de altura.

Page 10: Disenio de Inrerfaz de Usuario

Uniformidad• Significa que los comandos y menús del sistema deben tener

el mismo formato, los parámetros deben pasarse a todos los comandos de la misma forma, y la puntuación de los comandos debe ser similar.

• Las interfaces uniformes reducen el tiempo de aprendizaje del usuario.

Page 11: Disenio de Inrerfaz de Usuario
Page 12: Disenio de Inrerfaz de Usuario

Mínima sorpresa• Es apropiado debido a que las personas se irritan demasiado

cuando el sistema se comporta de forma inesperada.• Si una acción en algún contexto provoca un tipo de cambio

particular, es razonable esperar que la misma acción en un contexto diferente cause un cambio comparable.

Page 13: Disenio de Inrerfaz de Usuario

Recuperabilidad• Se deben incluir recursos que permitan a los usuarios

recuperarse de sus errores. Éstos pueden ser de tres tipos:• Confirmación de acciones destructivas• Proporcionar un recurso para deshacer• Generar puntos de control

Page 14: Disenio de Inrerfaz de Usuario

Asistencia al usuario• Un principio relacionado es el de asistencia al usuario.• Las interfaces deben proporcionar asistencia al usuario o

características de ayuda.• Éstas se deben integrar en el sistema y proporcionar

diferentes niveles de ayuda y asesoramiento.

Page 15: Disenio de Inrerfaz de Usuario
Page 16: Disenio de Inrerfaz de Usuario

Diversidad de usuarios• Señala que, para muchos sistemas interactivos, pueden existir

diferentes tipos de usuarios.• Algunos son usuarios casuales y otros son usuarios

potenciales.• Los usuarios casuales necesitan interfaces que los guíen, pero

los usuarios potenciales requieren métodos abreviados de forma que puedan interactuar con el sistema tan rápido como sea posible.

Page 17: Disenio de Inrerfaz de Usuario
Page 18: Disenio de Inrerfaz de Usuario

Ejercicios• Analiza la interfaz de usuario de un cajero automático y

redacta una critica acerca de como cumplen con cada principio de interfaz de usuario vistos anteriormente.

• Realiza la misma critica con la interfaz de usuario de Windows.

Page 19: Disenio de Inrerfaz de Usuario

Usabilidad• La usabilidad de un sistema software tiene dos componentes:

• Las acciones u operaciones que el sistema realiza• Cómo los usuarios pueden usar esta funcionalidad

• Un sistema es usable si los usuarios pueden hacer rápida y fácilmente sus tareas

Page 20: Disenio de Inrerfaz de Usuario

Usabilidad• La usabilidad descansa en cuatro puntos:

• Una aproximación al usuario: usabilidad significa centrarse en el usuario• Un amplio conocimiento del contexto de uso: las personas utilizan los

productos para incrementar su productividad• El producto ha de satisfacer las necesidades del usuario: los usuarios son

personas ocupadas que tratan de realizar tareas• Son los usuarios, y no los diseñadores o desarrolladores, quienes

determinan cuándo un producto es fácil de usar

Page 21: Disenio de Inrerfaz de Usuario

Usabilidad• Ejemplo de problemas debidos a una mala usabilidad:

Etiquetas que parecen botones

Controles difíciles de recordar

Colocación de controles

Page 22: Disenio de Inrerfaz de Usuario

Usabilidad• Software usable: fácil de aprender y fácil de utilizar

• Fácil de utilizar: realiza la tarea para la que se usa• Fácil de aprender: permite realizar las tareas rápidamente y sin errores

• Una aplicación usable es la que permite al usuario centrarse en su tarea, no en la aplicación

Page 23: Disenio de Inrerfaz de Usuario

Usabilidad• La usabilidad debe ser considerada en todo momento, desde

el comienzo del desarrollo:• Antes de iniciar el proyecto es esencial tener una idea acerca de

las características de los usuarios y de los aspectos del producto de mayor interés y necesidad

• Durante todo el desarrollo se han de realizar pruebas para comprobar que se está considerando la usabilidad del producto

• Incluso una vez que el producto está en el mercado se debería preguntar a los usuarios acerca de sus necesidades y actitud respecto del mismo

Page 24: Disenio de Inrerfaz de Usuario

Principios de usabilidad• Principios generales de usabilidad:

• Facilidad de aprendizaje• Flexibilidad• Consistencia• Robustez• Recuperabilidad• Tiempo de respuesta• Adecuación de las tareas• Disminución de la carga cognitiva

Page 25: Disenio de Inrerfaz de Usuario

Facilidad de aprendizaje• El tiempo requerido desde el no conocimiento de una

aplicación hasta su uso productivo debe ser mínimo• Debe proporcionarse ayuda a usuarios intermedios para que

alcancen un nivel de conocimiento y uso del sistema máximos• Para que un sistema sea fácil de aprender debe ser:

• Sintetizable• El usuario debe poder evaluar el efecto de operaciones anteriores en

el estado actual• Familiar

• Debe existir una correlación entre los conocimientos que posee el usuario (interacción con el mundo real y con otros sistemas) y los conocimientos requeridos para la interacción en un sistema nuevo

Page 26: Disenio de Inrerfaz de Usuario

Flexibilidad• Multiplicidad de maneras en que el usuario y el sistema

pueden intercambiar información• Parámetros que miden la flexibilidad:

• Control del usuario• El usuario es quien conduce la interacción

• Migración de tareas• Posibilidad de transferir el control de las tareas entre el usuario y el sistema (ej:

corrector ortográfico)• Capacidad de sustitución

• Permitir que valores equivalentes puedan ser sustituidos unos por otros (ej: margen de una carta)

• Adaptabilidad• Adecuación automática de la interfaz al usuario (ej: detección de la repetición de

secuencias de tareas

Page 27: Disenio de Inrerfaz de Usuario

• Cómo dar control al usuario:• Permitir deshacer• Dar a los usuarios control para empezar y terminar las operaciones siempre

que sea posible• Cuando un proceso no se pueda interrumpir, advertir al usuario y visualizar

mensajes apropiados durante el proceso• Permitir suspender una acción y comenzar otra para atender un trabajo

inesperado• Proporcionar atajos de teclado para las tareas frecuentes

Page 28: Disenio de Inrerfaz de Usuario

Consistencia• Es un concepto clave en la usabilidad• Un sistema es consistente si todos los mecanismos que

se utilizan son siempre usados de la misma manera, siempre que se utilicen y sea cual sea el momento en que se haga

• Consejos para diseñar sistemas consistentes:• Seguir guías de estilo siempre que sea posible• Diseñar con un ‘look & feel’’ común• No hacer modificaciones si no es necesario hacerlas• Añadir nuevas funcionalidades al conjunto preexistente en vez de cambiar

las ya conocidas

Page 29: Disenio de Inrerfaz de Usuario

RecuperabilidadEl sistema debe permitir al usuario corregir una acción una vez que ésta ha sido reconocida como errónea

Page 30: Disenio de Inrerfaz de Usuario

Disminución de la carga cognitiva

Debe favorecerse en los usuarios el reconocimiento sobre el recuerdoLos usuarios no deben tener que recordar abreviaturas y códigos complicados

Page 31: Disenio de Inrerfaz de Usuario

Ejercicio• Elabora un mapa conceptual acerca de los principios del

diseño de interfaces.• Elabora un mapa conceptual acerca de la usabilidad.

Page 32: Disenio de Inrerfaz de Usuario

ESTÁNDARES

• Un estándar es un requisito, regla o recomendación basada en principios probados y en la práctica. Representa un acuerdo de un grupo de profesionales oficialmente autorizados a nivel local, nacional o internacional.

• Pueden ser: locales, nacionales o internacionales

Page 33: Disenio de Inrerfaz de Usuario

ESTÁNDARES

• El objetivo de los estándares es hacer las cosas más fáciles, definiendo características de objetos y sistemas que se utilizan cotidianamente.

• El diseño de un teclado de teléfono es un estándar que se utiliza continuamente.

• El teclado QWERTY es otro estándar importante que nos permite interactuar con cualquier ordenador.

• Los estándares software se aplican generalmente a características básicas de la interfaz de usuario.

Page 34: Disenio de Inrerfaz de Usuario

BENEFICIOS

• Una terminología común• Esto permite que los diseñadores sepan que están

discutiendo los mismos conceptos, con lo que se pueden hacer valoraciones comparativas.

• El mantenimiento y la evolución• Porque todos los programas tienen la misma estructura y el

mismo estilo.• Una identidad común

• Lo que hace que todos los sistemas sean fáciles de reconocer.

Page 35: Disenio de Inrerfaz de Usuario

BENEFICIOS

• Reducción en la formación• Los conocimientos son más fáciles de transmitir de un

sistema a otro si por ejemplo, las teclas de órdenes están estandarizadas.

• Salud y seguridad• Si los sistemas han pasado controles de estandarización es

difícil que tengan comportamientos inesperados.• Hay dos tipos de estándares: estándares de iure y

estándares de facto.

Page 36: Disenio de Inrerfaz de Usuario

ESTÁNDARES IURE

• De derecho (de iure del latín 'por ley'), que son los promulgados por asociaciones reconocidas. Son fruto de un acuerdo formal entre las partes implicadas, después de un proceso de discusión, consenso y generalmente votación. Se adoptan en el seno de una organización que normalmente está dedicada a la definición de estándares. Ejemplos:(ISO, AENOR).

Page 37: Disenio de Inrerfaz de Usuario

ESTÁNDAR DE IURE

• Los estándares de iure son generados por un comité con estatus legal y están avalados por el apoyo de un gobierno o institución para producir estándares.

• Para hacer un estándar de iure se ha de seguir un proceso complejo.

• Primeramente, se confecciona un documento preliminar que se ha de hacer público, después cualquier persona o empresa puede presentar enmiendas de los borradores del documento.

Page 38: Disenio de Inrerfaz de Usuario

ESTÁNDAR DE IURE

• Estas enmiendas han de ser comentadas y resueltas.

• Después de un cierto tiempo, a veces años, se consigue un consenso y se acepta el nuevo estándar.

• En informática existen una serie de comités que han participado en la creación de muchos estándares de iure.

Page 39: Disenio de Inrerfaz de Usuario

• La ISO con sede en Ginebra, es una federación mundial de cuerpos de estándares nacionales de más de 130 países.

• Fundada en 1947, ISO es una organización no gubernamental cuya misión es promover el desarrollo de la estandarización y actividades relacionadas a nivel mundial, con la intención de facilitar el intercambio internacional de bienes y servicios, y para desarrollar la cooperación en el ámbito económico, científico, tecnológico e intelectual.

Page 40: Disenio de Inrerfaz de Usuario

• IEC: Comisión Electrotécnica Internacional• Fundada en 1906 su misión es preparar y publicar

estándares internacionales de temas relacionados con la ingeniería eléctrica y electrónica, y tecnologías relacionadas.

Page 41: Disenio de Inrerfaz de Usuario

• ANSI: Instituto Nacional Americano para Estándares• El Instituto Nacional Americano para Estándares

(American National Standards Institute, ANSI) se dedica desde hace más de 80 años a administrar y coordinar la estandarización voluntaria del sector privado de la industria de los Estados Unidos.

• Su principal misión consiste en ampliar la competitividad de las empresas de los Estados Unidos a través de la generación de estándares.

Page 42: Disenio de Inrerfaz de Usuario

• El Instituto de Ingenieros Eléctricos y Electrónicos Americano (Institute of Electrical and Electronics Engineers, IEEE) es una asociación profesional técnica, sin ánimo de lucro.

• La actividad de IEEE en relación con los estándares es desarrollar y publicar estándares generalmente aceptados, que promoverán la teoría y la práctica de la ingeniería eléctrica, electrónica e informática, así como del resto de ramas de la ingeniería o artes y ciencias relacionadas.

Page 43: Disenio de Inrerfaz de Usuario

• El Consorcio para World Wide Web (World Wide Web Consortium, W3C) fue creado en 1994 por TIM BERNERS–LEE (inventor de la Web) en el Instituto Tecnológico de Massachusetts (MIT, EE.UU.) y con la colaboración del Instituto Nacional de Investigación en Informática y Automática (INRIA, Francia) y la Universidad Keio de Japón.

• Su objetivo es llevar el World Wide Web a su pleno potencial, desarrollando protocolos comunes que promueven su evolución y aseguran su interoperabilidad.

Page 44: Disenio de Inrerfaz de Usuario

• W3C está constituido por más de 500 organizaciones alrededor del mundo, y contribuye

• a estandarizar las tecnologías Web produciendo especificaciones (llamadas ‘recomendaciones’) que describen los bloques de construcción de la Web.

• El consorcio tiene grupos de trabajo que crean recomendaciones en áreas relacionadas con las interfaces de usuario tales como la accesibilidad, la internacionalización, etc.

• Estas recomendaciones y otros informes técnicos están disponibles de forma totalmente gratuita.

Page 45: Disenio de Inrerfaz de Usuario

ESTÁNDARES DE FACTO

• De hecho (de facto del latín 'del hecho') que son una consecuencia de una aceptación generalizada por los usuarios. Ocurren cuando un determinado producto o modo de comportamiento se extiende en una comunidad determinada sin una planificación previa, hasta el punto de que ese producto o modo de comportamiento se considera 'normal' dentro de esa comunidad. Los estándares de facto ocurren de forma natural y progresiva, sin una planificación previa ni un proceso formal que los refrende. Ejemplo:(TCP/IP).

Page 46: Disenio de Inrerfaz de Usuario

ESTÁNDAR DE FACTO

• Son estándares que nacen a partir de productos de la industria que tienen un gran éxito en el mercado, o bien a partir de desarrollos hechos por grupos de investigación de universidades y que tienen una gran difusión.

• Estos productos o proyectos de investigación llegan a tener un uso muy generalizado, convirtiéndose, por tanto, en estándares de facto.

Page 47: Disenio de Inrerfaz de Usuario

ESTÁNDAR DE FACTO

• Su definición se encuentra en los manuales, libros o artículos. Son técnicamente muy valiosos y muy utilizados.

• Por ejemplo TCP/IP, el sistema QWERTY, el formato MP3, HTML, formato PDF.

• La idea sugiere que los estándares de facto una vez establecidos comienzan el proceso de legitimación para convertirse en estándares de iure.

Page 48: Disenio de Inrerfaz de Usuario

Guías DE ESTILOO Una Guía de estilo es un documento que

recoge normativas y patrones básicos relacionados con el “aspecto” de un interfaz para su aplicación en el desarrollo de nuevas “pantallas” dentro de un entorno concreto.

O Las Guías de Estilo, generalmente se centran en el “aspecto”.

Page 49: Disenio de Inrerfaz de Usuario

Guías COMERCIALESO Son guías de estilo diseñadas por las empresas

de software. Están basadas en principios y contienen directrices que se concretan a muy bajo nivel.

O Las guías de estilo más relevantes son en las que están basadas los entornos operativos más importantes: Macintosh, Windows y LINUX.

O Estos sistemas son propiedad de las empresas informáticas más importantes y cada una de ellas ha publicado su guía de estilo propia.

O En general son estándares de facto.

Page 50: Disenio de Inrerfaz de Usuario

Guías de estilo para la webO Popularizadas desde el nacimiento del

fenómeno del Internet.O Una característica importante de la Web es

la falta de interfaces de usuario comunes, ya que normalmente la prioridad es conseguir una interfaz atractiva, diferenciada de las otras, para que los usuarios visiten el sitio Web y lo vuelvan a visitar.

Page 51: Disenio de Inrerfaz de Usuario

Guías de estilo corporativasO Se centran en presentaciones comunes,

comportamientos y técnicas que deben ser implementadas por todos los productos en una compañía.

O Un objetivo de las guías de estilo corporativas es mantener y reforzar la identidad corporativa, esto es, el uso de colores, gráficos, e iconos que presenten una imagen visual consistente del logotipo de la compañía a través de todas las interfaces de los productos.

Page 52: Disenio de Inrerfaz de Usuario

Java look and feelO El lenguaje y la plataforma Java permiten la

ejecución de un mismo programa en diferentes plataformas, y para cada una de ellas Java utiliza la interfaz gráfica de la plataforma sobre la que se está ejecutando.

O Así, los que se ejecuten en Windows tendrán esa apariencia y los que se ejecuten en UNIX tendrán apariencia Motif. Esto ocurre siempre que los componentes empleados para construir la interfaz gráfica del programa sean AWT (Abstract Window Toolkit).

Page 53: Disenio de Inrerfaz de Usuario

Java look and feelO Sin embargo, la aparición del conjunto de

componentes Swing, como parte de una nueva librería de clases llamada JFC (Java Foundation Classes), permite la selección de esta apariencia gráfica, independientemente de la plataforma en la que se esté ejecutando. Tanto es así que, la apariencia por defecto de los componentes Swing se denomina Metal y es propia de Java.