Construcción de Interfaces a Usuario:

Construcción de Interfaces a Usuario:

Introducción

http://www.exa.unicen.edu.ar/catedras/ui_devlp/

Contenidos

 Objetivos del curso

 HCI

 Sistemas Interactivos

 Importancia IU

 Complejidad diseño e implementación

 Evolución Histórica

 Estilos de interacción

Objetivos

 Introducción a los aspectos relacionados con el desarrollo de sistemas interactivos

– aspectos computacionales y de software – nivel de detalle intermedio

• no generalidades

• no específico de ninguna plataforma o configuración de hardware particular

• no describe ninguna herramienta ni metodología particular

• se citan:

– los enfoques existentes, con ventajas y desventajas – los aspectos a considerar

– la forma de funcionamiento de las arquitecturas gráficas

Objetivos

 Foco del curso:

– interfaces convencionales actuales

• 2D

• WIMP (‘Windows, Icons, Menues and Pointing’)

• Dispositivos convencionales (mouse, teclado, pantalla)

Objetivos

 Programadores, Analistas, Diseñadores

–

comprender los aspectos relacionados con la implementación de un sistema interactivo

–

conocer los distintos enfoques y paradigmas actuales para la construcción de interfaces

 Investigadores

–

conocer los fundamentos de la construcción de las interfaces actuales

conocer las tendencias de trabajo actuales en interfaces

• problemática de cada tipo de interacción particular

 Administradores de proyecto:

–

conocer la importancia de la consideración de la usabilidad de una interfaz

–

comprender los distintos pasos en el diseño de interacciones

Objetivos

 Principales contenidos

– Actividades y principios en el diseño de una interfaz – Funcionamiento de los sistemas actuales

• sistemas de ventanas

• construcción de presentaciones

• tratamiento de eventos

• toolkits

– Organización del software

• modelos arquitectónicos

– Formas de construcción

• métodos y paradigmas existentes

• herramientas actuales

• líneas de investigación

– Tendencias

Objetivos

 Evaluación?

‘Human Computer Interaction’ (HCI)

 Disciplina acerca del Diseño, Implementación y

Evaluación de Sistemas Computacionales Interactivos para su utilización por seres humanos.

Diseño

Evaluación

Implementación

Motivación HCI

1950 1990 2030

Capacidades Humanas Capacidades

Computacionales

HCI

HCI

 Uso y contexto

• Problemas de adaptación a los computadores, su utilización y el contexto social de su uso.

– Trabajo y Organización social

• Interacción social en el trabajo

• Modelos de actividad humana

– Áreas de Aplicación

• Características de los dominios de aplicación

• Estilos más comunes:

– Producción de documentos, comunicaciones, diseño, tutoriales y ayudas, atlas multimediales, control de procesos,etc.

HCI

 Uso y contexto

– Compatibilidad y adaptación hombre-computador

• Mejora la compatibilidad entre el objeto diseñado y su uso

– Selección y adopción de los sistemas

– Adaptación de los sistemas a los usuarios (‘customization’)

– Adaptación de los usuarios al sistema (entrenamiento, facilidad de aprendizaje)

– Guías al usuario (ayudas, documentaciones, manejo de errores)

HCI

 Características Humanas

• Comprensión de los seres humanos como sistemas de procesamiento de información, formas de comu- nicaciónn entre humanos, requerimientos físicos y sicológicos

– Procesamiento humano de la información

• Características del hombre como procesador de información – Memoria, percepción, atención, resolución de problemas,

aprendizaje y adquisición de experiencia, motivación

– Lenguajes, comunicación e interacción

• Aspectos del lenguaje de interacción

– Sintaxis, semántica, pragmática, interacción conversacional, lenguajes especializados

HCI

 Características humanas

– Ergonomía

• Características antropométricas y fisiológicas, relación con los ambientes de trabajo

– Disposición de pantallas y controles, limitaciones sensoriales y cognitivas, efectos de la tecnología, fatiga y salud,

amoblamiento e iluminación, diseño de ambientes, diseño para usuarios con disminuciones físicas

HCI

 Sistemas computadorizados y arquitectura de la interfaz

• Componentes especializados para la interacción

– Dispositivos de input y output

• Tecnología y características de los dispositivos particulares de

hardware, rendimiento (del uso humano y del sistema), dispositivos virtuales

– Técnicas de diálogo

• Técnicas para llevar a cabo la interacción – ej. estilos de interacción

– Género del diálogo

• Metáforas de contenido e interacción

HCI

 Sistemas computadorizados y arquitectura de la interfaz

– Gráficos por computador

• Conceptos básicos de manipulación de gráfícos por computador

– Arquitectura del diálogo

• Arquitectura de software y estandares para interfaces

– ej. construcción de presentaciones, administradores de ventanas, toolkits de interfaz, arquitecturas multi-usuario, look&feel,

estandarización

HCI

 Proceso de desarrollo

• construcción y evaluación de interfaces

– Enfoques de diseño

• ej. Bases del diseño gráfico (tipografía, color, etc.), ingeniería de software, análisis de tareas

– Técnicas y herramientas para la implementacion

• ej. técnicas de prototipación, toolkits de diálogos, métodos OO

– Técnicas y métodos de evaluación

• ej. productividad, test de usabilidad

– Sistemas ejemplo y casos de estudio

• diseños clásicos utilizados como ejemplos de diseño de interfaces

Qué es una Interfaz con el Usuario (IU)?

 “Sistema interactivo” (SI)

– Programa computadorizado que desempeña sus tareas interactuando con un operador humano (“usuario”).

 “Interfaz con el usuario” (IU)

– Porción de un sistema interactivo que administra la presentación de datos y las acciones realizadas por el usuario.

– Aspectos sintacticos y léxicos de la interacción

 “Aplicación” o “Núcleo Funcional”(NF)

– Porción del sistema interactivo que no incluye la interfaz con el usuario

– Semántica de la aplicación

Sistemas Interactivos

Sistema Interactivo

Interfaz Aplicación

Aspectos sintácticos y léxicos

Aspectos semánticos

Operador

Niveles de Abstracción de un SI

Núcleo Funcional

Control del Diálogo

Objetos de Interacción

Sistema de Ventanas Drivers

Control de los Control de los

recursos E/S Control de los

obj. de interacción

Control del secuen- ciamiento de las acciones del usuario Conocimiento

del dominio

Incremento en el nivel de abstracción

Importancia de las IU

 Algunos estudios sobre desarrollo de IUs :

– 48 % (promedio) código

– 50 % (promedio) tiempo de implementación

Importancia de las IUs

 Facilidad de uso

– Los usuarios no desean leer manuales extensos ni consumir tiempo aprendiendo la forma de operar un sistema

 “Paradoja de la productividad”

– Las grandes inversiones tecnológicas no han producido los incrementos de productividad esperados

• ej. re-entrenamiento constante de los usuarios ante nuevos productos y/o nuevas versiones (‘upgrades’) de SIs

“Usabilidad” del software

 “Utilidad”

– La funcionalidad del SI provee las operaciones necesarias

 “Usabilidad”

– Grado de facilidad en el uso del SI – Decrementa los costos

• Previene cambios en el software antes de su uso

• Elimina parte del entrenamiento necesario

– Incrementa la productividad

• Menores tiempos para realizar las tareas

• Menos errores

Diseñadores de Interfaces

 Porqué tener diseñadores especializados en HCI?

– Producen interfaces con menos errores

– Interfaces permitiendo una ejecución más rápida

– Los programadores no piensan de igual forma que los operadores

• Los programadores poseen un modelo del sistema, no un modelo del usuario

– Diferentes clases de interfaces y problemas

Roles en una IU

 “Operador” / “usuario” / “usuario final”

• Persona que utilizará el sistema interactivo.

 “Diseñador del sistema”

• Desarrolla la arquitectura global de un SI

– Especifica las tareas que serán efectuadas dentro de cada módulo

 “Diseñador de la interfaz a usuario”

• Define la IU con la cual interactuará el operador – Utiliza la especificación de tareas

• Necesita comprender:

– Tareas a ser resueltas – Necesidades del operador

– Costos y beneficios de las UI particulares

» En términos del operador y los costos de implementación y mantenimento

Roles en una IU

 “Diseñador del núcleo funcional” o “programador de la aplicación”

• Crea la estructura de software necesaria para implementar las tareas semánticas de la aplicación (no incluidas en la IU)

 “Diseñador del software de la interfaz a usuario”

• Diseña la estructura del software que implementará la interfaz definida por el diseñador de la IU.

 “Implementador de herramientas”

• crea herramientas para la construcción de interfaces

– No todos los actores se encuentran presentes en el proceso de

desarrollo de un SI

Roles en una IU

Operador

Núcleo Funcional

Software de la IU

Look

&Feel

Sistema Interactivo

Requeri- mientos

Especif.

Diseñador NF

Diseñador software IU

Diseñador Implem.

Herram.

Herram.

Construcc.

Importancia HCI

 Campo de investigación actual en industrias, universidades y gobiernos

– proyectos financiados por ARPA, NSF, Comunidad Europea (proyecto ESPRIT)

 Identificado como uno de los aspectos con mayor

impacto en el futuro de las ciencias de la computación

Recursos en HCI

 SIGCHI

 Publicaciones específicas

– TOCHI, Interactions (ACM) – Interacting with Computers

– Intl. Journal of Human Computer Interaction – Behavior & Information Technology

– Human-Computer Interaction

 Conferencias más importantes

– CHI, Interact, UIST, EHCI, DSVIS

– conferencias en tópicos específicos (WWW, CSCW, IV, DIS, ...)

Complejidad del diseño de IUs

 “Es fácil hacer las cosas difíciles. Es dificil hacer las cosas fáciles”

– Dificultades de los diseñadores para comprender las tareas del usuario

– Especificaciones iniciales incompletas o ambiguas

• La comprensión completa de un SI se adquiere a través de su uso.

– La interfaz debe satisfacer las necesidades, experiencia y expectativas de los usuarios previstos.

– Amplia diversidad de usuarios, con diferentes características.

– Los programadores tienen dificultades en pensar como los

usuarios

Complejidad del diseño de IUs

 Complejidad inherente de las tareas y los dominios

– Es dificil lograr SI fáciles de usar, si las aplicaciones poseen muchas funciones

– ej. MS Word, con aprox. 300 comandos.

– ej. algunos programas CAD poseen cerca de 1000 funciones.

– Requerimientos específicos del dominio

– ej. distintos requerimientos de los programas CAD, de acuerdo al dominio asistido (mecánica, electrónica, arquitectura, ...)

Complejidad del diseño de IUs

 Diversos aspectos del diseño involucrados

• Estandares

• Documentación

• Internacionalización

• Rendimiento

• Detalles de distinto nivel

• Factores externos

• Aspectos legales

• Tiempo de programación y testeo

• Otros ....

– Es imposible optimizar todos estos criterios a la vez.

• Deben privilegiarse los aspectos más importantes en cada caso, y obtener un balance entre ellos

Aspectos diseño IUs

 Estándares

– Las IUs deben adherirse a los estandares requeridos por su plataforma

• ej. guías de estilo de Macintosh o Motif.

– Deben satisfacerse los estandares establecidos en versiones anteriores del producto, o productos relacionados de la

competencia

– Criterios de diseño gráfico

• Disposición espacial, colores, diseño de íconos, fuentes de texto.

• Generalmente realizado por diseñadores gráficos profesionales

Aspectos diseño IUs

 Documentación, mensajes y textos de ayuda

– La provisión de buenos mensajes de ayuda y manuales incrementa la usabilidad del SI

• Su influencia es mayor que la modificación de la interfaz

• El grupo del proyecto debiera incluir buenos escritores técnicos

 Internacionalización

– Los productos pueden ser utilizados por usuarios con diferentes lenguajes

• No implica solamente la traducción de cadenas de texto

• Puede incluir diferentes formatos de fechas u horas, rediseños de

‘layouts’, diferentes esquemas de colores, nuevos íconos, etc.

Aspectos diseño IUs

 Rendimiento

– Los usuarios no toleran interfaces que operen lentamente

• ej. primeras versiones de Xerox Star no aceptadas por usuario – productividad más alta

– tiempos de respuesta muy largos

 Detalles de alto y bajo nivel

– Una interfaz con un modelo global incorrecto será inutilizable

– Los detalles de bajo nivel deben ser perfeccionados para satisfacer al usuario

• Si la colocación de un botón o un item de un menú no es aceptada por los operadores, éstos desecharán la interfaz

Aspectos diseño IUs

 Factores externos

– Las causas de las fallas de muchos sistemas son independientes del diseño del software (razones políticas, organizativas o sociales)

• ej. si los usuarios perciben que el SI amenaza su trabajo, pueden boicotear el desarrollo del sistema

 Aspectos legales

– La copia de un diseño exitoso es ilegal.

• ejs. inconvenientes entre Lotus, Apple y Microsoft

Aspectos diseño IUs

 Tiempo de programación y testeo

– El refinamiento iterativo mejora la calidad de una interfaz, pero incrementa el tiempo de desarrollo.

 Otros

– Pueden existir requerimientos especiales de aplicaciones orientadas a determinados tipos de usuarios

• colaboración entre múltiples usuarios

• usuarios con discapacidades

Complejidad del diseño de IUs

 Las teorías, principios y guías actuales suelen no ser suficientes

– Diversidad de metodologías, teorías y directivas diseñar UIs – La experiencia y práctica de los diseñadores es la principal

contribución a la calidad de la IU, no un método o teoría.

– No siempre es conveniente su utilización

– ej. reglas de consistencia o metáforas

– Suelen ser demasiado específicas y/o demasiado generales

• cubren solo aspectos limitados del comportamiento, y no siempre pueden ser generalizadas.

Complejidad del diseño de IUs

 Dificultad del diseño iterativo

–

El 87% de los proyectos de desarrollo utilizan alguna forma de diseño iterativo [Myers & Rosson 92]

–

La intuición del diseñador acerca la solución de un problema observado puede ser errónea

• La nueva versión del sistema puede ser peor que la anterior

–

Aunque una iteración puede mejorar un diseño, éste nunca obtendrá la calidad de una IU originalmente bien diseñada.

–

Es dificil obtener usuarios “reales”, para efectuar los tests.

• Los participantes en los tests suelen ser seleccionados por iniciativa propia

– poseen mayor predisposición e interés que los usuarios reales.

• Cada iteración debería involucrar diferentes usuarios.

–

El diseño iterativo puede ser largo y costoso

• Los tests formales pueden tomar hasta 6 semanas

Complejidad del diseño de IUs

 Inclusión de aspectos más sofisticados

– Información multimedial

– Multimodalidad en la interacción – Interacciones 3D

– Trabajo colaborativo

Complejidad de implementar IUs

 Dificiles de diseñar, requiriendo una implementación iterativa

– No siguen el modelo en “cascada”: especificar, diseñar, implementar, testear, liberar

• Dificultades en la planificación y administración del proceso de desarrollo

Complejidad de implementar IUs

 Programación Reactiva

– Programación “de adentro hacia fuera”

• La aplicación no posee el control de la ejecución

• Aplicación estructurada como subrutinas invocadas ante acciones del operador

• Las subrutinas pueden tener restricciones temporales

– ej. deben completarse antes de que el operador introduzca el siguiente comando

– Programación basada en eventos

• Programación más dificultosa para los programadores

– Dificultades con la modularización

Complejidad de implementar IUs

 Multiprocesamiento

– La programación reactiva requiere una múltiples procesos

• Administración simultánea de los distintos procesos de un sistema de ventanas.

• El software de la IU debe estar diseñado para aceptar comandos en cualquier momento, aún mientras se ejecutan otros comandos

• Las operaciones prolongadas deberían ser implementadas como procesos separados

– ej. impresiones, repaginados

Complejidad de implementar IUs

 Multiprocesamiento

– el usuario puede participar simultánemente en múltiples diálogos

– ej. operación con diferentes ventanas

• Debe mantenerse el estado acerca de las acciones realizadas por el usuario

• Los diálogos debieran poder interactuar entre sí.

– Problemas comunes del multiprocesamiento:

• Sincronización

• Mantenimiento de consistencia

• ‘Deadlocks’

Complejidad de implementar IUs

 Requerimientos de tiempo real

– Las interfaces de manipulación directa deben proveer un alto

‘feedback’ ante las acciones del usuario

• ej. movimiento de objetos o ‘rubberbanding’.

• el ‘feedback’ debería finalizar en aprox. 16 milisegundos – Operaciones más sencillas y rápidas

» ej. ‘XORs bounding boxes’

» Macintosh

• Mantenimiento de la posición del mouse.

– Información temporal: video, sonido, animaciones

Complejidad de implementar IUs

 Robustez del software

– Aceptación de todos las acciones del usuario

• Ante cualquier input, la IU debe continuar operando (‘no crashing’)

– Errores

• Provisión de mensajes de error significativos

• Permitir una recuperación sencilla y segura de los errores

– Soporte de ‘abort’ y ‘undo’ de todas las acciones

• Todas las acciones deben ser implementadas de tal forma que permitan su interrupción y reversión luego de su terminación

– Pueden requerir estructuras de datos y estilos de programación especiales.

Complejidad de implementar IUs

 Débil soporte de los lenguajes de programación actuales

– No contienen las características apropiadas para las IUs

• Primitivas para input y output gráfico (ej. printf, scanf)

• No proveen facilidades para servicios generales ( ‘undo’, ayudas)

• Generalmente, las capacidades de E/S de los lenguajes son ignoradas – Utilización de rutinas de bibliotecas externas

– No proveen soporte para programación reactiva y/o multiprocesamiento.

– Los lenguajes OO son adecuados para la implementación de IUs

• No todos los lenguajes proveen un sistema de objetos apropiado – Apple desarrolló ObjectPascal, para MacApp

– Motif y OpenLook utilizan un sistema de objetos en C (Xtk)

Complejidad de implementar IUs

 Dificultades en el uso de las herramientas de desarrollo de IUs.

– Manuales inmensos, con cientos de procedimientos

– ej. Macintosh Toolbox (6 libros)

– Aprendizaje de un lenguaje de programación de propósito especial

– ej. UIL

– Flexibilidad insuficiente para obtener determinados efectos

– ej. Macintosh y Motif, no permiten implementar en forma sencilla aceleradores de botones.

– Generalmente, la utilización de los paquetes gráficos subyacentes es dificil

Complejidad de implementar IUs

 Dificultades en la modularización del software de IUs

– Una modularización apropiada facilita la creación y mantenimiento

– La porción del software que implementa la IU debiera estar separada del resto del software

• “Independencia del Diálogo”

• Posibilita el diseño iterativo

• Dificultades para obtener una separación real.

– Cambios en la IU generalmente requieren cambios en la aplicación, y viceversa.

– ‘Feedback’ semántico

– La utilización indiscriminado de ‘callbacks’ dificulta aún más la

modularización

Complejidad de implementar IUs

 Inclusión de aspectos más sofisticados

– Información multimedial – Interacción Multimodal – Interfaces 3D

– Trabajo colaborativo

Entrada Salida Inicialmente Conecciones con cables

Cintas de papel y tarjetas perforadas

Teclado

Paneles de luces Papel

Actualmente Teclado

+ teclas cursor + mouse

+ micrófono

Terminales de caracteres Pantallas gráficas

Audio Futuro VR: ej. 'data gloves'

Lenguaje natural

VR: 'Head mounted displays' Agentes

Evolución histórica HCI

• Lecciones:

– Los teclados y terminales son solamente artefactos de la tecnología actual – Los nuevos dispositivos de E/S cambiarán las formas de interactuar

 (completar con paper Myers)

 Las lecciones:

ENIAC (1943)

 Primer computador electrónico

Mark I (1944)

 Lectores de cintas de papel perforadas

Stretch (1961)

 Panel de control de Stretch

‘Time-sharing’

 60’s

– Computadoras demasiado costosas para una única persona

 ‘Time sharing’

– Brinda al usuario la sensación de estar trabajando en su propia máquina

– Necesidad inmediata de proveer soporte para la interacción hombre-máquina

• Incremento dramático en la accesibilidad de las máquinas

• Lenguajes y sistemas interactivos, no ‘jobs’

SketchPad (Ivan Sutherland, 1963)

 Paquete de dibujo sofisticado

– Introdujo muchas de las ideas actuales de las IUs

• Estructuras jerárquicas, definiendo figuras y sub-figuras

• Operaciones recursivas: aplicadas a los componentes de los objetos jerárquicos

• Programación orientada a objetos: instancias de figuras

• Restricciones: especificación de relaciones a mantener por el sistema

• Iconos: figuras pequeñas que representan items más complejos

• Técnicas de input: uso eficiente del lápiz óptico (‘light pen’)

• ‘World coordinates’: separación de de las coordenadas de dibujo y pantalla

 Desarrollos paralelos en hardware:

• Terminales gráficas de bajo costo

El computador personal

 Xerox PARC (mediados 70’s)

– Estación de trabajo personal (‘Alto’)

• Procesador local, pantalla gráfica (‘bit-mapped’), mouse

– Interfaces gráficas modernas

• Edición de texto y dibujo, correo electrónico

• Ventanas, menúes, barras de desplazamiento, selección con el mouse, etc.

– Redes de area local (LANs) para estaciones de trabajo personales

• Utilización de recursos compartidos

Máquinas Comerciales: Xerox Star (1981)

 Primer computador personal comercial

 Primera GUI

• Utiliza varias de las ideas desarrolladas en Xerox Parc

• Modelo conceptual familiar para el usuario – Simulación de un escritorio

• Promueve el reconocimiento y apuntamiento, no “recordar y tipear”

• Plantillas de propiedades (‘property sheets’) para especificar la apariencia y comportamiento de los objetos

• ‘What you see is what you get’ (WYSIWYG)

• Conjunto pequeño de comandos genéricos globales para todo el sistema

• Alto grado de consistencia y simplicidad

• Interacción sin modos

Máquinas Comerciales: Xerox Star

(1981)

Máquinas Comerciales: Xerox Star (1981)

 Primer sistema basado en la “ingeniería de usabilidad”

• Prototipos en papel y análisis de uso

• Tests de usabilidad con usuarios potenciales

• Refinamiento iterativo de la interfaz

 Fallas comerciales

• Costo ($15,000)

• Funcionalidad limitada

– ej. no proveía planillas de cálculo

• Arquitectura cerrada

– Los vendedores de terceras partes no podían agregar aplicaciones

• Ejecución aparentemente lenta –

Maquinas comerciales: Apple

 Apple Lisa (1983)

• Basada en muchas ideas de Star; predecesor de Macintosh

• Algo más económica ($10,000)

• Tampoco tuvo éxito comercial

 Apple Macintosh (1984)

• “Ideas viejas”, pero bien hechas!

• Éxito, a causa de:

– Precio agresivo ($2,500)

– Errores de Lisa corregidos (“ideas maduras”)

– Permitía la incorporación de software de 3ras. partes no-Apple – Guías de estilo que alentaban la consistencia entre aplicaciones – Dominio en el mercado de publicaciones electrónicas (‘desktop

publishing’)

Consolidación

 ACM SIGCHI (1982)

• Grupo de interés en CHI

• Conferencias anuales, 2000 a 3000 asistentes

 MIT, Nicholas Negroponte (1969-1980+)

– Muchas innovaciones

• Pantallas en la pared

• Uso de discos de video

• Uso de inteligencia artificial en interfaces (agentes)

• Reconocimiento de voz conjuntamente con apuntamiento

• Síntesis de voz

• Hipermedia

Algunos tipos de aplicaciones

 Procesadores de texto

 Programas de dibujo o similares

 Correo electrónico

 Planillas de cálculo

 Documentos hipertextuales

 Navegadores de WWW

 Realidad virtual

 Multimedia

 Juegos interactivos, en tiempo real

Estilos de Interacción

 Formas particulares de obtener información o interactuar con un usuario

 Algunos estilos:

– 1. Preguntas y respuestas,

– 2. Comandos de caracteres simples y/o teclas función – 3. Lenguaje de comandos

– 4. Menúes

– 5. Cajas de Diálogos / Formularios – 6. Manipulación directa

– 7. WYSIWYG

– 8. Gestos

Estilos de IUs

 Las interfaces suelen proveer características de más de un estilo

• ej. lenguaje de comandos para expertos, y menúes para novatos

 El estilo apropiado depende del tipo de usuario y tarea

 Aspectos importantes:

• Quién tiene el control?

• Facilidad de uso para novatos

• Tiempo de aprendizaje para convertirse en un usuario experimentado

• Velocidad de uso (eficiencia) para un usuario experimentado

• Generalidad / Flexibilidad / Potencia (cuanto de la UI se cubre con esta técnica?)

• Capacidad de mostrar valores por omisión, valores actuales, etc.

• Experiencia requerida

“Preguntas y respuestas”

 El sistema efectúa preguntas, el usuario responde

– Utilizado por algunos programas simples, y también algunos sistemas expertos

• ‘Wizards’ (Microsoft)

• Interfaces telefónicas (“presione 1 para ventas, 2 para soporte,... ")

 Ventajas y desventajas:

 Fácil de implementar (‘writeln’, ‘readln’)

 Fácil para novatos

 No pueden corregirse errores previos

• Excepto en Wizards, donde suele haber un botón “Previo”

“Preguntas y respuestas”

Comandos de caracteres simples y/o teclas función

 Teclas de función rotuladas

 Ventajas y desventajas:

 Método más rápido para expertos.

 Es sencillo aprender como utilizarlo.

 Sencillo para proveer soporte telefónico

• “Ahora presione la tecla F1”

 Generalmente, sencillo de implementar.

 Dificil recordar las asociaciones tecla-función, si el uso es intermitente.

 Es fácil presionar una tecla por error

Lenguaje de comandos

 Instrucciones al SI por medio de un lenguaje formal

 Ventajas y desventajas

 Mayor flexibilidad.

 Soporta la iniciativa del usuario.

 Rápido para expertos.

 Capacidades para macros, ‘customización’, etc.

 Menos espacio en pantalla

 Muy duro para novatos.

 Requiere un entrenamiento sustancial y alta memorización.

 Las tasas de error son generalmente altas.

 Sintaxis generalmente muy estricta.

 Pobre manejo de errores.

 Dificil para el usuario decir lo que quiere hacer.

• La dificultad de la implementación depende de la disponibilidad de herramientas como Lex y Yacc, y de la complejidad del lenguaje.

Lenguaje de comandos

Menúes

 Ventajas y desventajas

 Necesitan muy poco entrenamiento

 Muestran las opciones disponibles

 Permite el reconocimiento (no necesitan la generación)

 Muestra de la selección por omisión o selección actual

 Capacidad para mostrar opciones deshabilitadas

 Pueden ser utilizados para ingresar comandos (y argumentos)

 Reduce la cantidad de presiones de teclas

 Estructura clara para la toma de decisiones.

 Usable sólo con pocas opciones

 Lento para usuarios experimentados (necesitan aceleradores)

 Si es una jerarquía grande, puede ser dificil hallar los comandos

 Utiliza espacio en pantalla

– Son más efectivos cuando se utilizan con un dispositivo de apuntamiento.

Menúes

Formularios

 Conjunto de campos numéricos o textuales, a completar por el usuario

– Generalmente utilizados en terminales de caracteres.

• ej. cajas de diálogo Macintosh y Windows

 Ventajas y desventajas (similar a los menúes)

 Simplifica la entrada de datos.

 Requieren muy poco entrenamiento

 Muestran las opciones disponibles

 Permiten el reconocimiento (no necesitan la generación)

 Capacidad para mostrar valores actuales y por omisión.

 Capacidad para mostrar partes no relevantes (en gris)

 Consumen espacio en pantalla.

 Costosos de internacionalizar.

– Son más efectivos cuando se utilizan con un dispositivo de apuntamiento.

Formularios

Manipulación directa

 Definición:

– “Modelo visual del mundo”

• Objetos visuales directamente manipulables

– Los resultados de las acciones se reflejan inmediatamente en los objetos

 “Orientada a objetos”, desde el punto de vista del usuario

– Contrasta con “orientada a funciones”

– Generalmente consiste en:

• Selección de un objeto

• Aplicación de un comando

Manipulación directa

 Ventajas y desventajas:

 Iniciativa del usuario

 Fácil de aprender, intuitiva

 Rápido de usar para objetos que están en la presentación

 Fácilmente potenciada con menúes y formularios

 Los errores pueden ser evitados

 Alta satisfacción subjetiva

 Puede ser inconveniente y lenta para objetos que no se encuentran visibles en la pantalla

 Poder limitado, no todas las acciones tienen una analogía en la manipulación directa

 Dificil proveer macros, u otras características extensibles o

customizables por el usuario

Manipulación directa

WYSIWYG

 ‘What you see is what you get’.

– en realidad, es una variante de Manipulación Directa

 Ventajas y desventajas (similar a manip. directa)

 Siempre puede indicar como será el resultado final

 La imagen en la pantalla puede ser dificil de leer o interpretar

• especialmente en pantallas con resoluciones demasiado bajas

 No puede mostrar la estructura oculta

• como fue realizado un dibujo?

 Puede ser lenta en la ejecución

• ej. corte de páginas

 Dificil de implementar

WYSIWYG

Interfaces ‘Non-Command’ o ‘Next- Generation’ [Nielsen 93]

 Interacción “natural”

–

interfaz “invisible”

–

generalmente implementadas por medio de:

• reconocimiento de gestos

• reconocimiento y síntesis de voz

 Algunas características

–

dispositivos especiales

–

manipulación de varios dispositivos en forma simultánea

interacción “inteligente”

–

interacción “por demostración”

 Aspectos:

–

interpretaciones erróneas de las acciones del usuario

Gestos

 Similar a la operación de un usuario operando naturalmente

– ej. escritura sobre papel

 Ventajas y desventajas:

 Puede ser natural para aprender

 Puede ser más rapida de ejecutar que otras técnicas

 Muchos gestos son dificiles de hacer con un mouse

 Los usuarios deben memorizar gestos

• No ‘affordances’

Lenguaje natural

 Subconjuntos de algun lenguaje convencional

 Puede incluir el procesamiento de voz

 Ventajas y desventajas:

 Teóricamente, es el más facil de aprender

 La voz es la técnica de output más rápida

 Algo lenta para ingresar datos

 Requiere que el diálogo sea bien claro

 Los sistemas generales son imposibles con la tecnología actual

 Algunas investigaciones muestran que la entrada por voz puede ser

más lenta y menos natural que el tipeo.

Bibliografía

 General

– Bass, Len. Coutaz, Joelle. Developing Software for the User Interface, Addison-Wesley, 1991

– Shneiderman, Ben. Designing the User Interface: Strategies , Third Edition, 1998, Addison-Wesley

– Olsen, Dan. R. Jr. Developing User Interfaces, 1998, Morgan

Kaufman

Bibliografía

 Otras referencias generales

– Foley, J. Van Dam, A. Feiner, S. Hughes, J. Computer Graphics:

Principles and Practice, Addison-Wesley, 1990

– Lee, Geoff Object Oriented GUI Application Development, 1993, Prentice Hall

– Thimbleby, Harold. User Interface Design, ACM Press, 1990 – Watson, Mark. Portable User Interface Programming in C++.

Mc Graw Hill

– Nielsen, Jacob Usability Engineering, Academic Press, 1992.

– Preece, D. Human Computer Interaction, 1995.

Bibliografía

 Cursos en WWW:

– CPSC 481, Foundations and Principles of Human Computer Interaction, University of Calgary, Saul Greenberg,

– CS05-830, User Interface Software, Carnegie Mellon University, Brad Myers

 Artículos:

– Myers, Brad. ”Why are Human-Computer Interfaces Difficult to Design and Implement?” ACM Interactions. 1(1). 1/94.

– Myers, Brad. Rosson, Mary. "Survey on User Interface Programming”, SIGCHI'92, 5/92

– Myers, Brad “User Interface Tools”, ACM TOIS, 3/95.

– Comm. ACM, Special Issue on Next Generation User Interfaces, 4/93

– otros ....