HCI DESARROLLO DE INTERFACES DE USUARIO TEMA1 INTRODUCCIÓN

HCI

DESARROLLO DE INTERFACES DE

USUARIOTEMA1

INTRODUCCIÓN

HCIINTRODUCCIÓN

• SOBRE QUE TRATA ESTE LIBRO– Principios de la informática– Tiempos de cambio– El legado de los investigadores– Una cuestion de control

HCIINTRODUCCIÓN

• EL MARCO DEL CONTEXTO– Gráficos– Factores humanos y de usabilidad– SW orientado a objetos

• objetos y clases

• herencia

• clases abstractas

– Herramientas comerciales

HCIINTRODUCCIÓN

• UNA VISTA AL INTERFACE DE USUARIO– El círculo interactivo

• ciclo de evaluación

• ciclo de ejecución

• modelo de suficiencia

– Los puertos interactivos• límites del espacio de representación

• límites de los focos de atención

HCIINTRODUCCIÓN

• UNA VISTA AL INTERFACE DE USUARIO– Proceso del diseño de la interface

• analizando la tarea

• diseño del modelo funcional

• diseño de presentaciones

• diseño de los puertos interactivos

• diseñando las acciones

• RESUMEN

HCISOBRE QUE TRATA ESTE

LIBRO• PRINCIPIOS DE LA INFORMÁTICA

• Al principio de los 70– Los ordenadores eran:

• grandísimos

• lentos

• extremadamente caros

• muy delicados

• y complejos


LIBRO• PRINCIPIOS DE LA INFORMÁTICA

• La programación:– Se realizaba por lotes– Mediante tarjetas perforadas– Out-line


LIBRO• ÉPOCA DE CAMBIO

• El futuro era oscuro para la humanidad– Supeditada a las máquinas debido a su alto costo

• Desarrollo de los micros y del silicio– Se abarata el HW– Se aumenta el rendimiento del HW– Mayor importancia del personal sobre las máquinas


LIBRO• EL LEGADO DE LOS INVESTIGADORES

• Los tiempos cambian– Las tarjetas ya no son importantes y si el teclado y el

monitor– Los ordenadores ya no son caros objetos de

laboratorio


LIBRO• EL LEGADO DE LOS INVESTIGADORES

• Se busca:– Sobrepasar la capacidad ofrecida por los sistemas– Aprovechar al máximo la capacidad que se nos ofrece

• Este es un problema no de Hw, ya que se esta doblando cada año la capacidad de las máquinas

• Es cuestión del SW principalmente


LIBRO• EL LEGADO DE LOS INVESTIGADORES• El problema de la secuencialidad

– Turbo Pascal: intento de solución• combinación de un editor con un compilador• eliminación de accesos al disco• aumento de la velocidad y usabilidad

– Pero en el fondo conservaba la secuencialidad del primer compilador de FORTRAN

• Usuario->información->ordenador->resultado


LIBRO• UNA CUESTIÓN DE CONTROL

• Muchos de los interfaces de usuario siguen este modelo por lotes

• La diferencia reside en– La cantidad de tiempo que la máquina tiene el control– El juego de instrucciones es variado y amplio– El control dominante lo tiene el usuario y no el

algoritmo

HCIEL MARCO DEL CONTEXTO

• GRÁFICOS

• El interface de usuario es construido alrededor de los gráficos y del sonido

• El tema central de los gráficos no lo centraremos en la renderización de imágenes fotorealistas, sino en la interface de usuario

• Estructura de control, actualización, comunicación e información


• GRÁFICOS

• Nos centraremos en:- primitivas básicas de dibujo como líneas y polígonos- dibujo de texto incluidas las fuentes y fuentes

internacionales- recortes de dibujos antiguos en 2D por partes- modelos de colores - transformaciones geométricas en 2D- mecanismos de recogida de datos interactiva- técnica de ventanas


• FACTORES HUMANOS Y DE USABILIDAD

• Una cuestión importante es como el usuario percibe el SW

• Los temas en los que profundizaremos serán- Principales factores humanos básicos de

visualización y mecanismos de recogida de datos.- Cuestiones generales de la memoria y percepción

humana.- Técnicas de evaluación de la usabilidad.


• FACTORES HUMANOS Y DE USABILIDAD• Construir SW no es solo programar• Los programadores necesitan de otros profesionales

que conozcan a los usuarios• El paradigma más utilizado es

– >Necesidades y problemas identificados– >Solución – >Prototipo– >Evaluación con el usuario, y vuelta a empezar


• FACTORES HUMANOS Y DE USABILIDAD

• Este es un bucle circular, que se suele considerar infinito

• Debe seguirse investigando y actualizando mientras el programa siga en mercado


• SW ORIENTADO A OBJETOS• Simula (60), Smalltalk, Java, C++...• Surge a partir del interface de usuario• En la interface de usuario, un objeto podría ser un

icono– Tendría “independenciaindependencia” del resto– Interactivo– Recibe y envía mensajes


• SW ORIENTADO A OBJETOS

• Objeto– Entidad singular que pertenece a una clase– Consta de campos donde se guarda información

• Clase– Comportamiento del objeto– Define el tipo de métodos aplicados a sus objetos


• SW ORIENTADO A OBJETOS

• Métodos– El conjunto de métodos define el comportamiento de

la clase– Nombre y cero o más argumentos

• Argumentos– Tipo


• SW ORIENTADO A OBJETOS• Lo más complicado es conseguir la actualización

mientras el objeto está cambiando• Por ejemplo podemos crear una clase botón

– Dentro de esta 3 botones: Negrita, Cursiva, Subrayado• Cada uno de estos con un método como por ejemplo

Poner_en_Cursiva– Que recibiría un argumento del tipo char, o de tipo cadena de

caracteres y otro del tipo botón_seleccionado


• HERENCIA

• Es un factor importante en los lenguajes orientados a objetos

• Si una clase hereda de otra esta clase tendrá todos los métodos y campos de su superclase

• Cualquier cosa hecha por un objeto de una clase puede ser hecha por objetos de sus subclases


• HERENCIA

• Existen muchos tipos de herencia – Múltiple o Simple– Las subclases puedan definir nuevos campos– Subclases puedan definir nuevos métodos– Que las subclases puedan redefinir métodos de

clases superiores


• CLASES ABSTRACTAS• Una de las ventajas de la herencia es la

reutilización de código, aunque no la única• Gracias a la herencia existe una gran permisividad

con respecto a la variedad de objetos• Un objeto no tiene porque preocuparse por si es de

un tipo u otro, sino solo de si tiene los campos y métodos correctos


• CLASES ABSTRACTAS• Por ejemplo

– Una clase abstracta alumno puede tener muchas subclases

• alum_primer_año, alum_último_año, alum_extranjero...

• Cada uno con sus campos adicionales además de los de alumno y los métodos añadidos o modificados

– Pero el sistema de registro no necesita saber si es un tipo particular de alumno, sino solo que es un alumno


• HERRAMIENTAS COMERCIALES• Como el marco de los interfaces ha crecido mucho,

tambien lo han hecho las herramientas para manejar estos interfaces y facilitar su uso

• Nuestra meta en este libro va a ser mostrar un marco de aprendizaje y manejo sobre la marcha con ejemplos de herramientas como Macintosh, Microsoft Windows, X Windows/Motif, NeXTSTEP y NeWS, entre otros

HCIUNA VISTA AL INTERFACE

DE USUARIO• EL CIRCULO INTERACTIVO• Círculo interactivo es la interrelación que existe

entre el usuario, el interface y el modelo• El usuario emite entradas al modelo a través del

interface que son computadas y respondidas de nuevo a través del interface, rápidamente

• El modelo se debe ajustar a los cambios realizados por el usuario (a su gusto y necesidades)


DE USUARIO• CICLO DE EVALUACIÓN• Don Norman identificó el ciclo de evaluación y el

ciclo de ejecución• Consiste en que el usuario ve y juzga si lo que ve es lo

que esperaba que sucediese• Varios factores pueden influenciar esto

– factores ergonómicos• falta de consistencia en el texto• bajo contraste en la información importante

– Items agrupados incorrectamente


DE USUARIO• CICLO DE EVALUACIÓN

• Son importantes las líneas de tiempo– La información debe aparecer en un tiempo

aceptable– La información debe ser evaluada sin

análisis tediosos– La información sobre estados relevantes debe

reflejarse en pantalla


DE USUARIO• CICLO DE EJECUCIÓN

• Sucede cuando el usuario no conoce la secuencia de sucesos para un objetivo

• Factores que lo producen– Los iconos no son representativos

– Una pobre retroalimentación puede producir que un camino correcto no lo parezca

– Usuario no entienda la secuencia de entradas que producen un resultado


DE USUARIO• MODELO DE SUFICIENCIA

• El usuario quiere que el programa se parezca a lo que el tiene en mente

• Quiere que haga lo que el quiere

• Hay que examinar si el modelo de nuestro programa es suficiente


DE USUARIO• LOS PUERTOS INTERACTIVOS• LÍMITE DE ESPACIO DE REPRESENTACIÓN

– La capacidad actual es de 640x480 pixeles– Solo los sistemas con múltiples monitores soportan el

gran mundo interactivo de 1200x1200 pixeles– Hay que intentar decrementar tanto el ciclo de

ejecución como el de evaluación– Conseguir un termino medio entre el enfoque global y

un enfoque más centrado en algo en particular


DE USUARIO• LOS PUERTOS INTERACTIVOS

• LIMITES DE LOS FOCOS DE ATENCIÓN DEL USUARIO– El foco de atención del usuario es muy pequeño

– El usuario debe poder cambiar su foco de atención sin problemas, sin cambios bruscos

– El usuario debe recibir la información de forma cómoda y agradable


DE USUARIO• PROCESO DEL DISEÑO DE LA INTERFACE• El proceso para la creación de una nueva

interface no es un proceso lineal• Este proceso es un desarrollo interactivo• Se deben evaluar las necesidades • Corregir los problemas que surjan en el diseño• Para ello iremos por partes


DE USUARIO• ANALIZANDO LA TAREA• El primer paso consiste en analizar lo que el usuario

necesita poder hacer y como le gustaría hacerlo• El sistema tiene que ayudar al usuario a realizar las

tareas que le interesan• Debe contener una información detallada de que va

a poder hacer y como lo tiene que hacer, así como de la terminología y símbolos


DE USUARIO• DISEÑO DEL MODELO FUNCIONAL

• Debemos diseñar un modelo que facilite al usuario conseguir estos objetivos

• Tiene que haber un término medio entre los gráficos y la funcionalidad del interface

• Se debe permitir que el usuario cambie información sobre el objeto, y explicar como debe hacerlo



• El modelo funcional debe representar la complejidad de las tareas a realizar

• Conforme aumenta la funcionalidad de un programa disminulle la capacidad de entendimiento del usuario

• Debemos intentar aunar conceptos de forma que tareas distintas sean representadas de la misma forma



• La simplificación sin embargo no debe olvidar la tarea que el usuario debe realizar

• El modelo es tan simple que no puede ser implementado y por lo tanto probado

• El único medio de resolver la cuestión de complejidad frente a elegancia es evaluar el modelo con el usuario repetidas veces


DE USUARIO• DISEÑO DE PRESENTACIONES• La presentación visual es crítica para reducir el ciclo

de evaluación• Se deben diferenciar claramente los datos

meramente informativos de los que el usuario puede manejar

• Diferenciación entre diferentes tipos de objetos• La percepción del usuario• Cantidad de vistas distintas de un objeto


DE USUARIO• DISEÑO DE LOS PUERTOS INTERACTIVOS• Diseñar como organizar la información para que

se mantenga en la pantalla• Desplazamiento de los objetos y el uso de

ventanas• Las acciones que puede realizar,mediante menús• Si tu puedes ver un objeto, puedes usarlo, pero si

no lo puedes ver, no podrá ser usado


DE USUARIO• DISEÑANDO LAS ACCIONES

• Las técnicas para la manipulación de los objetos– Presentación estática– Presentación dinámica (más real)

• También es importante la selección y uso de dispositivos interactivos de entrada

HCIRESUMEN

• SISTEMA INTERACTIVO– Representación de un modelo de aplicación– Interpretación de las entradas del modelo– El modelo debe reaccionar acorde con las entradas y variar

el modelo si así se requiere

• MODELO BASADO EN LAS NECESIDADES DEL USUARIO (USABILIDAD)

• MODELO DE FÁCIL ENTENDIMIENTO Y CON POSIBILIDAD DE CAMBIO

Documents

HCI DESARROLLO DE INTERFACES DE USUARIO TEMA1 INTRODUCCIÓN