Está en la página 1de 8

Interacción Interactuando con la computadora…

Interacción Humano-Computadora
(HCI - GUIs)
Hemos tenido en cuenta al usuario, por un lado, y a la
computadora con sus dispositivos de e/s por el otro.

Sin embargo, nuestro objetivo no es tenerlos en cuenta


aisladamente. El usuario utiliza la computadora como una
herramienta para llevar a cabo una determinada tarea.

Cuando esto ocurre, se produce un intercambio de


información entre el humano y la computadora, y a esto es a
lo que llamaremos interacción.

Sergio Martig – Martín Larrea Sergio Martig – Martín Larrea


Clase 1 - 1 Clase 1 - 2

… Interactuando con la computadora… … Interactuando con la computadora

Para considerar la interacción veremos:


El uso de modelos de interacción nos puede ayudar a
entender exactamente qué ocurre en la interacción y nos - Modelos de Interacción que nos permitirán
permite identificar la verdadera razón de las dificultades. identificar y evaluar las componentes de la
interacción así como los elementos físicos,
sociales y organizacionales que le dan contexto.

También nos provee un marco para comparar distintos - Diferentes Estilos de Interacción usados y
estilos de interacción y considerar los problemas que se considerar si son efectivos o no para soportar al
producen en la interacción usuario.

Sergio Martig – Martín Larrea Sergio Martig – Martín Larrea


Clase 1 - 4 Clase 1 - 5

Modelos de Interacción… Modelos de Interacción…


Ciclo de ejecución-evaluación (Norman)
Ciclo de ejecución-evaluación (Norman)
El ciclo interactivo puede dividirse en dos fases:
Es posiblemente el más intuitivo debido a su cercanía con - Ejecución
lo que entendemos por interacción usuario-computadora. - Evaluación

El usuario formula un plan de acción y éste se ejecuta. Estas pueden subdividirse en 7 pasos que, en este
modelo de Norman son:
Cuando el plan, o parte de éste, ha sido ejecutado, el - Establecer la meta
usuario observa la interfaz para evaluar el resultado de la - Formar la intención
ejecución del mismo. - Especificar la secuencia de acciones
- Ejecutar la acción
Así, determina cómo seguir. - Percibir el estado del sistema
- Interpretar el estado del sistema
- Evaluar el estado del sistema con respecto a las
metas e intenciones.

Cada paso es una actividad del usuario.


Sergio Martig – Martín Larrea Sergio Martig – Martín Larrea
Clase 1 - 6 Clase 1 - 7
… Modelos de Interacción… … Modelos de Interacción…
Ciclo de ejecución-evaluación (Norman) Ciclo de ejecución-evaluación (Norman)

Norman utiliza este modelo de interacción para El usuario y el sistema no usan los mismos términos para
demostrar por qué estas interfaces causan problemas describir el dominio y las metas.
a los usuarios.
El abismo de ejecución se refiere a la distancia entre las
Él describe esto en términos de metas del usuario y los medios de lograrlas utilizando
- Abismo de Ejecución el sistema; es decir que es la diferencia entre la
- Abismo de Evaluación formulación de las acciones por el usuario para
alcanzar la meta y las acciones permitidas por el
sistema.

El abismo de evaluación se refiere a la distancia entre el


comportamiento del sistema y las metas del usuario;
es decir que es la distancia entre la presentación física
del estado del sistema y lo que espera el usuario.

Sergio Martig – Martín Larrea Sergio Martig – Martín Larrea


Clase 1 - 8 Clase 1 - 9

… Modelos de Interacción… … Modelos de Interacción…


Modelo de Abowd y Beale
Ciclo de ejecución-evaluación (Norman) Intenta una descripción de la Interfaz incluyendo
explícitamente al sistema. Detalla 4 componentes
principales en la interacción:
El modelo de Norman es útil para entender la interacción.
Sin embargo, sólo considera al sistema desde la
interfaz. Output
(Salida)
Norman se concentra sólo en la vista de la interacción Sistema Usuario
que tiene el usuario y no intenta la comunicación con
el sistema a través de la interfaz.
Input
Abowd y Beale trataron este problema y propusieron una
(Entrada)
extensión al modelo de Norman.

Cada componente tiene su propio lenguaje


Sergio Martig – Martín Larrea Sergio Martig – Martín Larrea
Clase 1 - 10 Clase 1 - 11

… Modelos de Interacción Marco de la Interacción


Modelo de Abowd y Beale Así como discutimos los detalles de una interacción en
particular, es importante poner en un marco adecuado
Como la interfaz está entre el usuario y el sistema, hay 4
otros elementos importantes relacionados con la
pasos en el ciclo interactivo que corresponden a una
interacción.
traducción de un componente a otro:

presentación observación
Output
(Salida)

Sistema Usuario

Input
performance (Entrada) articulación
Cada una de estas áreas tiene importantes implicancias en
el diseño de sistemas interactivos.
Sergio Martig – Martín Larrea Sergio Martig – Martín Larrea
Clase 1 - 12 Clase 1 - 13
Evolución Evolución

Daremos la evolución de los sistemas interactivos con énfasis Los avances tecnológicos han incrementado la potencia de
en cómo estos incrementaron la usabilidad de las las máquinas y mejorado el ancho de banda de la
computadoras en general. comunicación entre computadoras y humanos. Sin embargo,
sólo el impacto de la tecnología no es suficiente para
En todo proceso de evolución los avances se van dando en mejorar la usabilidad
dos aspectos: Por un lado en lo teórico-científico y por el otro
en lo tecnológico. • Los paradigmas de interacción han sido dependientes
Ambos se interrelacionan, influenciándose y actuando unos de los avances tecnológicos y de su aplicación creativa, en
como disparadores de los otros y viceversa. su mayoría, en lo que se refiere al mejoramiento de la
interacción
Muchas veces las ideas inspiran a los diseñadores, demando
nueva tecnología. Otras, la tecnología existente en un • Los principios de interacción son independientes de la
momento dado permite su utilización con propósito distinto tecnología; dependen, en gran parte, de un profundo
del que había motivado su diseño. entendimiento del ser humano como elemento de la
interacción.

Sergio Martig – Martín Larrea Sergio Martig – Martín Larrea


Clase 1 - 14 Clase 1 - 15

Evolución Paradigmas
El problema con los paradigmas de interacción es que
Unidades de display de Video
raramente están bien definidos; no es claro cómo ayudan al • A mediados de los 50 se comenzó a experimentar con
usuario a llevar a cabo determinadas tareas. Como resultado, la posibilidad de presentar y manipular información en
es posible que el uso repetido de los mismos no resulte en un una computadora en forma de imágenes en una unidad
sistema más usable. de video.

La derivación de los principios de interacción proviene • Los display proveerían un medio adecuado para
usualmente de la necesidad de explicar el éxito o fracaso de un presentar información para rápida asimilación
paradigma de interacción. • Las primeras aplicaciones fueron militares

• En 1962, Ivan Sutherland presentó el programa


Los principios proveen definiciones abstractas y generales que
Sketchpad. Fue no sólo una herramienta para crear
no son muy útiles para el diseñador.
imágenes en los displays sino que fue un nuevo modelo
de operar las computadoras.
Un diseño exitoso se basa en una propuesta
complementaria.

Sergio Martig – Martín Larrea Sergio Martig – Martín Larrea


Clase 1 - 16 Clase 1 - 17

Paradigmas Paradigmas
Unidades de display y video Herramientas de Programación
Sketchpad demostró dos ideas importantes:
• Douglas Engelbart, alrededor de los 50, tenía como
- Las computadoras podían usarse para otras
ambición usar las computadoras como un medio para
aplicaciones que no sólo fueran el procesamiento de
complementar la actividad humana de resolución de
datos. Podían extender la habilidad de los usuarios
problemas, para enseñar a los humanos.
permitiéndoles abstraerse de algunos niveles de detalle,
visualizando y manipulando diferentes representaciones • El equipo de Engelbart desarrolló el mouse y el
de la misma información. La computadora podía hablar procesador de palabras, pero lo importante de este equipo
más humanamente. fue la metdología adoptada para crear sus poderosos e
innovativos sistemas interactivos, con la tecnología de ese
- Los esfuerzos de Sutherland demostraron cuán entonces.
importante podía ser la contribución de una mente
creativa para la historia de la computación. • La idea clave para producir sistemas que ayudaran al ser
humano en la actividad de resolución de problemas era la
de proveer la herramienta adecuada para tal fin.

Sergio Martig – Martín Larrea Sergio Martig – Martín Larrea


Clase 1 - 18 Clase 1 - 19
Paradigmas Paradigmas
Herramientas de Programación Computadora Personal
El equipo de programadores se concentró en el desarrollo • La década de los 70 vió surgir la computación para las
de un conjunto de herramientas interactivas que se masas.
requerirían posteriormente para construir sistemas
interactivos más complejos. • Una de las primeras demostraciones de las herramientas
poderosas que podían desarrollarse y ponerse a
La potencia de las herramientas de programación era disposición de novatos fue el primer lenguaje de
contar con componentes pequeños y bien entendidos que programación gráfico para chicos llamado LOGO (Seymour
pudieran componerse para crear otras herramientas. Una Papert, MIT).
vez que estas herramientas se entendieran podían a su vez
• Adaptando el lenguaje de programación a un modelo
componerse con otras y así seguir.
(tortuga) que los chicos pudieran entender y usar, Papert
demostró algo invalorable de los sistemas interactivos: no
Esto permitió que se aumentara la productividad de los
importa cuán poderoso pueda ser un sistema, siempre
entendidos. Pero el entendido no era la única meta de
será más poderoso si es sencillo para usar.
Engelbart.

Sergio Martig – Martín Larrea Sergio Martig – Martín Larrea


Clase 1 - 20 Clase 1 - 21

Paradigmas Paradigmas
Computadora Personal Sistemas de Ventana y la interface WIMP

• Alan Kay, profundamente influenciado por los sistemas de • Con el inmenso éxito comercial de las PC’s, se puso
Papert y Engelbart, vió que la potencia y el éxito de un énfasis en aumentar la usabilidad de la tecnología
sistema residía en ser accesible a los usuarios novatos tal centrada en el diálogo del usuario con la computadora.
como lo fue LOGO.
• El modelo de trabajo estándar no se corresponde con
• A principios de los 70, su visión del futuro de los sistemas forzar al usuario a llevar a cabo su tarea desde el
de cómputos se sintetizó en máquinas pequeñas y comienzo hasta el fin sin diversificarse. La PC debería ser
poderosas que fueran dedicadas a un solo usuario: eran las flexible en cuanto a permitir al usuario la posibilidad de
computadoras personales. cambiar de actividad.

• Kay y su equipo, en Xerox Palo Alto Research Center, • Además, si el usuario se dedicaba a más de un tipo de
trabajaron en la incorporación de un ambiente de actividad, era necesario presentar adecuadamente el
programación visual, simple y poderoso, Smalltalk, a una contexto de cada una de éstas de modo que pudiese
computadora personal que ya estaba disponible. distinguirlas.

Sergio Martig – Martín Larrea Sergio Martig – Martín Larrea


Clase 1 - 22 Clase 1 - 23

Paradigmas Paradigmas
Sistemas de Ventana y la interface WIMP La metáfora
• Un mecanismo para lograr este diálogo particionado es
• Las metáforas pueden usarse para enseñar nuevos
separar físicamente la presentación de las diferentes
conceptos en término de los que ya se conocen. En el
actividades de conversación en el display. La ventana es
desarrollo de LOGO, Papert usó la metáfora de la tortuga.
el mecanismo asociado con esta separación física y lógica
de los espacios de display. • Este mecanismo se reveló exitoso para introducir a los
novatos en técnicas de interacción relativamente
extrañas. Ejemplos son la metáfora del escritorio y la de
• Cada vez más usuarios usaban este tipo de interacción
las hojas de cálculo. El peligro de la metáfora se percibe
(WIMP)
luego de transcurrido un determinado tiempo. Metáfora de
la máquina de escribir. En la metáfora del escritorio, en la
• Estos dispositivos aparecieron por primera vez en el Mac, la papelera es usada indistintamente para sacar un
mercado en abril de 1981, cuando Xerox introdujo el diskette y para borrar un archivo.
sistema de información Star 8010. Engelbart y Kay habían
sido los precursores.

Sergio Martig – Martín Larrea Sergio Martig – Martín Larrea


Clase 1 - 24 Clase 1 - 25
Paradigmas Paradigmas
Manipulación Directa
La metáfora
• A principios de los 80 el precio del hardware gráfico de
• Otro problema que debe ser tenido en cuenta con las alta calidad bajó rápidamente y los diseñadores vieron
metáforas es la carga cultural; debemos tener en que sus productos ganaban popularidad si su contenido
cuenta que el software se ha internacionalizado y que visual aumentaba.
la metáfora subyacente se aplicará en muchos países
distintos. • De las interfaces de líneas de comandos se pasó a
interfaces que daban una gran realimentación haciendo
posible tener información por cada acción ejecutada por el
• Una metáfora sin sentido agregará complejidad usuario.
adicional entre el usuario y el sistema.
• En 1982, Ben Shneiderman delineó las características de
una interfaz de manipulación directa. Utilizó el término
manipulación directa para describir las características
atractivas que tenían los sistemas interactivos basados en
gráficos tales como el Sketchpad y el de Xerox Palo Alto,
el Star.

Sergio Martig – Martín Larrea Sergio Martig – Martín Larrea


Clase 1 - 26 Clase 1 - 27

Paradigmas Paradigmas
Manipulación Directa Manipulación Directa
• El primer suceso comercial que demostró la usabilidad
Las características delineadas por Shneiderman de una inherente de las interfaces de manipulación directa para el
interfaz de manipulación directa pueden resumirse como: público general fue el de la computadora personal de
Apple, en 1984.
- Visibilidad de los objetos de interés
- Acción incremental en la interfaz con realimentación • El paradigma WYSIWYG está relacionado con la
rápida de todas las acciones manipulación directa. Lo que se ve en la pantalla cuando se
- Reversibilidad de todas las acciones, que alienta a usa por ejemplo un procesador de texto, no es el
los usuarios a explorar sin penalidades severas documento actual que se producirá como documento final,
sino una representación de cómo se verá el documento
- Correctitud sintáctica de todas las acciones, de final. La implicancia con una interface WYSIWYG es que la
modo tal que cada acción de un usuario sea legal diferencia entre el final y la representación es mínima. Sin
- Reemplazo de complejos lenguajes de comando por embargo WYSIWYG no es una panacea en lo que se refiere
acciones que manipulan directamente los objetos a usabilidad. Figura en documento.
visibles.

Sergio Martig – Martín Larrea Sergio Martig – Martín Larrea


Clase 1 - 28 Clase 1 - 29

Paradigmas Paradigmas
Hipertexto Hipertexto
• En 1945, Vannevar Bush, estaba a cargo de más de • El memex era esencialmente un escritorio con la
6000 científicos que expandieron las fronteras del habilidad de producir y almacenar cantidades masivas de
conocimiento científico durante la 2º Guerra Mundial. copias fotográficas de información documentada. Además
Reconoció que el mayor problema de estos esfuerzos de de su capacidad de almacenamiento, mantenía enlaces
investigación tan prolíficos era mantenerse en contacto entre las diferentes partes de los documentos. Así, la info
con todo este cuerpo creciente de conocimiento científico almacenada se asimilaba con una vasta red de datos
en la literatura. En su opinión, las mayores ventajas de interconectados similar a cómo se percibe que la info está
esta revolución científica serían obtenidas por aquéllos almacenada en el cerebro humano.
que pudiesen mantenerse al tanto de este flujo de • En los 60, Ted Nelson comenzó con la creación de un
información creciente. revolucionario sistema de recuperación de información
• Describió entonces un aparato de recuperación y denominado Xanadu, basado en la idea de interconexión,
almacenamiento de información innovativo y futurista: el texto no lineal y otras formas de medios. Nelson acuñó el
memex. término de hipertexto a mediados de los 60 para reflejar
esta estructura de texto no lineal.

Sergio Martig – Martín Larrea Sergio Martig – Martín Larrea


Clase 1 - 30 Clase 1 - 31
Paradigmas Paradigmas
Trabajo cooperativo soportado por computadoras La World Wide Web

• Otro desarrollo de los 60 fue el de las pimeras redes de • Es probablemente el desarrollo reciente de mayor
computadoras que permitieron la comunicación entre significación.
distintas máquinas. • Ofrece facilidad de uso, interfaz predominantemente
• Un resultado de esta comunicación es la emergencia de gráfica, oculta la complejidad subyacente de los
colaboración entre distintos individuos vía la protocolos de comunicación, las direcciones y el
computadora. CSCW: Computer Supported Cooperative acceso remoto a los datos.
Work. • El proyecto WWW fue concebido en 1989 por Tim
• CSCW es un tópico emergente en la investigación actual Berners-Lee, que trabajaba en el CERN (Laboratorio
de la IHC. Estos sistemas se construyen para soportar Eropeo de Física de Partículas) con el objetivo de
usuarios que trabajan en grupos. distrbuir información científica generada en el CERN y
compartirla con físicos de todo el mundo.

Sergio Martig – Martín Larrea Sergio Martig – Martín Larrea


Clase 1 - 32 Clase 1 - 33

Paradigmas Paradigmas
La World Wide Web Multimodalidad

• En tanto Internet estuvo disponible alrededor de • Un sistema interactivo multimodal es el que se basa
1969, no fue un gran paradigma de interacción hasta en el uso de múltiples canales de comunicación
que surgieron interfaces gráficas (browsers) bien humana. Cada canal diferente corresponde a una
diseñadas para la Web. modalidad de interacción diferente.
• Estos browsers permitieron a los usuarios acceder • Los sistemas multimodales son tema de
fácilmente a información multimedia usando sólo un investigación hoy en día.
mouse para apuntar y cliquear.
• El gran impacto ha sido debido a la facilidad de uso
tanto de los browsers como del HTML.

Sergio Martig – Martín Larrea Sergio Martig – Martín Larrea


Clase 1 - 34 Clase 1 - 35

Paradigmas Paradigmas
Interfaces Basadas en Agentes La Computadora Omnipresente

• Los agentes humanos son personas que trabajan en pro • Los últimos 50 años de computación interactiva
o en nombre de alguien: hay agentes que compran y muestran que aún pensamos en una computadora como
venden propiedades, agentes de viajes, agentes de bolsa, confinada a una caja sobre un escritorio, en una oficina o
etc. Los agentes de software, del mismo modo, actúan en en un laboratorio. La interface ha sido transformada de
pro de los usuarios dentro del mundo electrónico. una ruidosa teletipo a un display gráfico con una interface
Ejemplo: agentes de mail que filtran el correo. WIMP o de lenguaje natural.
• Los agentes pueden llevar a cabo tareas repetitivas, • A fines de los 80, un grupo de investigadores de Xerox
observar y responder a eventos cuando los usuarios no PARC, conducidos por Mark Weiser, iniciaron un programa
están presentes y también pueden aprender de las de investigación con el obejtivo de alejar la IHC del
acciones de los usuarios. escritorio e introducirla en la vida diaria.
• Algunos agentes hacen exactamente lo que se les dice; • La intención es crear una infraestructura de cómputo que
otros, usan técnicas de IA para aprender basándose en las penetre nuestro mundo físico de modo tal que no notemos
acciones de los usuarios. más a la computadora, aunque esté siempre presente

Sergio Martig – Martín Larrea Sergio Martig – Martín Larrea


Clase 1 - 36 Clase 1 - 37
Paradigmas Ejemplo
El Sistema Xerox Star
Interfaces Tangibles:
En 1981 Xerox introdujo el Sistema de Información 8010
Star. Este sistema cambió la forma en que debían
Caso de estudio teórico del curso… diseñarse los sistemas interactivos.

Fue diseñado como un sistema de automatización de


oficinas.

La idea básica era que los profesionales en una


organización debían tener estaciones de trabajo en sus
escritorios y debían usarlas para producir, recuperar,
distribuir y organizar documentación, presentaciones,
memos y reportes.

Todas las estaciones de trabajo en la organización debían


estar conectadas y debían compartir acceso a los
servidores de archivos, las impresoras y otros recursos.
Sergio Martig – Martín Larrea Sergio Martig – Martín Larrea
Clase 1 - 38 Clase 1 - 39

Ejemplo Ejemplo
Los usuarios de Xerox Star Las características básicas de Xerox Star

Básicamente, la computadora debería ser tan invisible como Según Johnson et al. (1989) las características que la hicieron
fuese posible para los usuarios. única, caracterizadas de acuerdo a sus distintos niveles en la
arquitectura del sistema son:

Los usuarios podrían así enfocarse en su trabajo, olvidándose


• La máquina y la red
de tener que manejar conceptos de sistemas operativos,
programas, … • Las ventanas y los manejadores de archivo
• La interfaz de usuario

Otra característica importante era que se asumía que muchos de • El editor de documentos
los usuarios del Star serían ocasionales. Esto implicaba que el
sistema debía ser fácil de usar y de aprender.

Sergio Martig – Martín Larrea Sergio Martig – Martín Larrea


Clase 1 - 40 Clase 1 - 41

Ejemplo Ejemplo
La máquina y la red Las ventanas y los manejadores de archivo
Las facilidades distintivas de la capa por encima del sistema
Las características básicas eran: operativo y que le permiten soportar la interfaz de usuario son
básicamente:
• Computadores personales en un ambiente distribuido.
Éstas estaban conectadas a una red local para compartir • Ventanas. Permiten mostrar simultáneamente
recursos caros. información en áreas separadas de la pantalla y también
solaparla.
• El mouse como dispositivo apuntador y seleccionador • Aplicaciones integradas. En los documentos puede
relativo. mostrarse diferente tipo de información (gráficos, rexto,
• Display de mapa de bits. planillas, …).

Sergio Martig – Martín Larrea Sergio Martig – Martín Larrea


Clase 1 - 42 Clase 1 - 43
Ejemplo Ejemplo
La Interfaz de usuario
El Star fue el primer sistema de manipulación directa para aplicaciones El editor de documentos
de negocios en un ambiente de oficina. Uso de metáfora del escritorio
dándole al usuario un modelo de documentos electrónicos en un Al nivel más alto de la arquitectura Star están sus aplicaciones, la
escritorio simulado. más prominente de las cuales es el editor de documentos:
• Manipulación directa e interfaz gráfica.
• Comandos genéricos o universales. • Editor de documentos WYSIWYG (What you see is what you
get).
• Íconos y manejo icónico de archivos.
• Uso de hojas de propiedades u opciones para especificar la • Conjunto de caracteres extendido para soportar distintos
apariencia de los objetos. idiomas.
• Descubrimiento progresivo • El documento es el corazón del sistema. El uso primario del
sistema es crear y mantener documentos.
• Un alto grado de consistencia

La alta calidad de la interfaz no se debió sólo a una década de diseño


creativo sino también al prototipado de ideas, a los análisis de lápiz y
papel y a los experimentos de factores humanos con potenciales
usuarios.
Sergio Martig – Martín Larrea Sergio Martig – Martín Larrea
Clase 1 - 44 Clase 1 - 45

Bibliografía

• ACM CHI Proceedings


• Johnson, J., et al., The Xerox Star: A Retrospective, IEEE
Computer 22(9), pp. 11-29, September 1989.
• Preece, J., Rogers, Y., Sharp, H., Benyon, D., Holland, S.,
Carey, T., Human-Computer Interaction, Addison Wesley,
1997.

Sergio Martig – Martín Larrea


Clase 1 - 46