fundamentos de hci

Fundamentos de HCI

Lic. Ivana Harari. [email protected]

Lic. Andrea Keillif – Diego Paez

Universidad Nacional de La Plata

Licencia Creative CommonsFundamentos de HCI por Esp.Lic.Ivana Harari se encuentra bajo una Licencia Creative Commons

Atribución-NoComercial-CompartirIgual 3.0 Unported.

mailto:[email protected]

¿Qué es HCI-Interacción Hombre-Computadora?

Fundamentos de HCI Human Computer Interaction

Humano =•Un usuario•Un grupo de usuarios•Una organización•Público en general

Computadora =•Una PC•Una LAN•Una WAN•Una workstation•Dispositivo móvil

Diálogo o Interacción Hombre-Computadora

El Diálogo o Interacción Hombre-Computadora es el intercambio observable de información, datos y acciones entre un humano y la computadora o viceversa.

Bla Bla Bla Bla

HCI en todos los contextos


HCI para todos los usuarios


HCI como disciplinaHCI es la disciplina dentro de las Cs. de Computación que se encarga

del diseño, evaluación e implementación de sistemas de computación interactivos para el uso humano e incluye todos los fenómenos concernientes a ello.

HCI es

multidisciplinar



El HCI y el Contexto Muchos factores afectan la calidad de la interfaz del usuario: el

usuario, la tecnología, los requerimientos funcionales, el entorno, entre otros.


Importancia del HCI La interfaz se convirtió en un factor decisivo en la elección del software. Alto índice de “software chatarra”. Software desechado por causas de

proveer una interfaz de mala calidad. En el entorno de Internet, se agrava la cantidad de sitios que caducan.

Evolución del HCI Fuerte integración de la Informática a otras áreas disciplinas Aumento y heterogeneidad en el espectro de usuarios Avance tecnológico relativo a la interacción hombre-máquina Menor costo en hardware Fuerte estandarización Sistemas con gran componente funcional Inclusión de la computación en todos los ambientes El auge de Internet Multimedia, groupware, tele-conferencia, educación a distancia Comunicación en todos los entornos y en todos los momentos User tailorability


El HCI y los rolesVarios sujetos intervienen en la interacción (usuarios) y en su

construcción (distintos profesionales). Cada uno con su perspectiva, objetivos, contextos y finalidades diferentes.

Fundamentos de HCI Tipos de Diálogo

Tipos de diálogo humano-computadora [Hutchins 86]

En el Mundo Conversacional se pasa de una etapa de diálogo a la siguiente de una manera predecible.

Permite tanto a los desarrolladores del software como a los usuarios visualizar un secuenciamiento lógico y específico del comportamiento.

Por tal motivo el diálogo que genera se denomina Diálogo Secuencial. Este tipo de diálogo incluye interacción pregunta-respuesta (request-

response), lenguajes de comandos, comunicación oral, navegación a través de menúes y entradas de datos.



En el Mundo Modal el usuario final muestra qué hacer mediante el desplazamiento y manipulación de representaciones visuales de los objetos, o sea mediante Manipulación Directa.

Permite un Diálogo Asincrónico con muchas opciones al mismo tiempo y la secuenciación de cada camino es independiente de los demás.

Diálogo asincrónico o diálogo basado en eventos, con acciones del usuario que inician la secuencia del diálogos.

También se encuentran los diálogos multi-thread (no lineales) que se refieren a la multiplicidad de caminos de diálogo, de hilos de control, de acciones alternativas disponibles para el usuario en un determinado momento –Ej.box de diálogo-

Otro tipo de diálogo es el concurrente que es un diálogo multi-thread en el cuál más de un subdiálogo puede ser desarrollado paralelamente -Ej. un reloj funcionando mientras uno está dibujando-. Además de haber muchas alternativas de diálogo, estas están abiertas simultáneamente.



Ejemplo de diálogo secuencial en Python

nom=raw_input("Ingrese su Nombre o fin para finalizar:")nom=nom.lower()cantAdultos=0cantPers=0while nom!="zzz":

ape=raw_input("Apellido:")edad=input("Edad:")cantPers=cantPers+1if edad>=18:

cantAdultos=cantAdultos+1nom=raw_input("Ingrese otro Nombre o fin para finalizar:")

print "la cant de personas entrev es: ", cantPersprint "la cant de adultos es: ", cantAdultos



Ejemplo de diálogo basado en eventos en Python + Pilas

start=Pilas.Actor.Boton(“start.png”, x=100, y=200)start.conectar_presionado(fcionApretarBoton)start.conectar_sobre(fcionTocarBoton)start.cuando_hace_doble_click(fcionDobleCliquearBoton)

#previamente definir las funciones de los eventosdef fcionApretarBoton:

….def fcionTocarBoton:

….def fcionDobleCliquearBoton:

….

Fundamentos de HCI Tipos de Interfaz que soportan el HCI

Tipos de interfaces del usuario Interfaces Textuales

• Uso del texto como medio de visualización y expresión Interfaces Visuales e Icónicas

• Visualización y Programación Visual. –WYSIWYG, WIMP- Interfaces Hápticas

• Uso de varios sentidos para la visualización e interacción Interfaces Colaborativas

• Interacción multiusuario grupal done se incluye coordinación, comunicación y colaboración entre los mismos. –WYSIWIS-

Interfaces Adaptativas y Adaptables• Formas de interacción y visualización parametrizables

Interfaces Inteligentes- Interfaces Evolutivas• Mecanismos de inferencia, de evolución. Puede comportarse como

asistente humano Interfaces Web Fija y Móviles- Mobile user Interface

• HCI en la Web• HCI en dispositivos móviles

Fundamentos de HCI Independencia de Diálogo

Independencia de Diálogo Desarrollo del Diálogo entremezclado con la Lógica Computacional

atenta con la calidad de la Interfaz del Usuario

• La hace resistente a cambios

• La oculta con el resto del código

• El flujo de diálogo está controlado por el flujo de control

La Interfaz del Usuario cuenta con su propia filosofía de desarrollo

La Interfaz tiene sus propios objetivos, relacionados con Factores Humanos como ser Usabilidad / Calidad de Uso.

UI Semántica de Aplicación

“SELF-CORRECTING” CORRECTENESS-DRIVEN


Independencia de diálogo

La Independencia de Diálogo es una definición formal [Ehrich y Hartson, 1981] que se basa en la separación de la Interfaz del Usuario del Sistema de Aplicación desde el inicio del desarrollo.

La Componente de Diálogo o Interfaz del Usuario es el soft y hardware que soporta y permite que el diálogo hombre-máquina se lleve a cabo.

La Componente de Cómputos o Aplicación permite la transformación funcional o algorítmica de las entradas en salidas.


Independencia de Diálogo La Independencia de Diálogo se logra a través de la separación

explícita del Diálogo y de la Aplicación en todas las etapas de desarrollo.

La Independencia NO se logra únicamente separando el código de ambas componentes en la etapa de programación.

La evolución de la Interfaz como componente de software independiente fue similar a la Independencia de Datos [Senko 1971]

La Interfaz del Usuario es considerada una componente de software tan importante como la parte Aplicativa del sistema interactivo.

La Aplicación Semántica no tendrá mecanismos propios para dialogar con el usuario sino a través de la Interfaz del Usuario.


Independencia de Diálogo•Ventajas

Inclusión de Factores Humanos Modularización Toma de decisiones Modificabilidad Extensibilidad Multiplexación de la Interfaz (n a 1) Estandarización de la Interfaz (1 a n)

•Problemáticas Aumento del Grado de Comunicación e Interacción entre roles. El usuario como partícipe del desarrollo de la UI. “Posible” decrecimiento de la Performance del sistema final. El Esquema de Vincularización y los Protocolos de

Comunicación son crupciales para su efectividad


Independencia de Diálogo

Otras ventajas La Interfaz requiere de su propio Ciclo de Vida

Existen decisiones de diseño propias y un grado de participación de usuarios no existentes en el desarrollo de la Componente de Cómputos.


Arquitecturas de la interfaz del usuario Esquema de Albert Green [1985]

Dispositivos de entrada

Ventanas

Objetos de interacción

Es el diálogo interno

Vistas de Interfaz y Aplicación

Objetos exportados

Es el motor de la UI

Control de la lógica y sencuencia de interacción

Control de la sesión y navegación de diálogo

Manejo interno de objetos de interacción

Protocolos de comunicación

Actividades involucradas en el diseño

Determinar estilo de interacción, tipos de diálogo y de interfazDiseñar el look&feelHacer explícito el sistema, identificando los objetos de interacciónDeterminar el soporte de hardware interactivo

Diseñar el look&feelDiseñar control, secuenciación y lógica del diálogoDiseñar la navegaciónIdentificar los objetos computacionales tales como objetos sintácticosDiseñar servicios propios de interfaz del usr Modelar los datos propios de la interfaz del usuarioDiseñar el manejo y control del hardware interactivoEspecificar tipo de asistenciaDiseñar aspectos de adaptación, inteligencia, colaboración

Especificar tipos de mapeamiento entre objetos semánticos e interactivos


Arquitecturas de la interfaz del usuario. (Cont.)

Esquema de Deborah Hix [1987]


Arquitecturas de la interfaz del usuario. (Cont.) Esquema de Deborah Hix [1987]

Enfatiza sobre Roles

intervinientes

Muestra utilización de Herramientas propias

GREEN


Arquitecturas Monolíticas de la interfaz del usuario Descomponen a la UI en niveles lógicos o en capas, c/u con servicios

que provee a la capa superior y que requiere de la capa inferior.

La modularización en capas de abstracción permite ocultamiento de información e independencia.

Cada capa es cliente y servidora, y debe proveer un mapeo, un binding y un protocolo entre las capas inferior y superior de ésta.

Corazón FuncionalControl de

DiálogoObjetos de Interacción

Sistema de Ventanas

Manejadores de Dispositivos

Mayor nivel de Abstracción


Arquitecturas Monolíticas de la interfaz del usuario Son modelos linguísticos que analizan a la UI como un lenguaje de

interacción en vez de un lenguaje de programación.

Detectan el nivel léxico, sintaxis y la semántica entre las componentes de una interfaz.

Inicialmente se trató de transferir conocimiento de la generación automática de compiladores en generación automática de la interfaz.

Se dependía de un Análisis Secuencial de expresiones de entrada y de una Dicotomía diferenciada entre la Entrada y la Salida


Arquitecturas Monolíticas de la interfaz del usuario No son adecuadas para la Manipulación Directa, ni cualquier otro

diálogo asincrónico, donde:

• El usuario dialoga con componentes individuales más que con el sistema entero

• Una expresión de entrada puede evolucionar en paralelo con una expresión de salida

• El proveer Feedback Inmediato obliga a interactuar entre las capas en forma muy fluida, intensa y muy ligada entre sí.

• Se utilizan acciones físicas como arrastres, reacciones interactivas, efectos visuales que no tienen inherencia secuencial.

Se requiere de arquitecturas que descentralicen los niveles lógicos y que construyan una organización modular de la Interfaz, alrededor de la noción de Agentes.


Arquitecturas No Monolíticas: Modelos MultiagentesUn Agente es una entidad de procesamiento de información completa, incluye:

• receptores de eventos,• transmisores de eventos, • una memoria para mantener su estado, y• un procesador que iterativamente procesa eventos de entrada, actualiza su propio

estado y produce eventos de salida.

Separan los conceptos y las técnicas de interacción dentro de cada nivel de abstracción especificado por un agente.

Modelan la Interfaz mediante la organización de agentes y la distribución de responsabilidades entre los agentes cooperantes.

Estos agentes reaccionan antes estímulos externos que a su vez provocan reacciones. Funcionan con estímulo-respuesta.

Los agentes se comunican entre sí. Aquellos que dialogan con el usuario son denominados objetos de presentación o interactivos


Arquitecturas No Monolíticas: Modelos MultiagentesModelo MVC. Model-View-Controller. [Golberg 84]

• Versatilidad en el Manejo de los Objetos, por ej. N Views para 1 Model

• La componte de Presentación = View + Controller

• La componente de Control de Diálogo sería un Model especial

VM

C

Modela algún aspecto de la realidadCodifica la funcionalidad de la aplicación

Define la interfaz entre una aplicación específica y una clase de usuario vía un dispositivoPiden y dan a los Models información del usuarioSe responsabilida de la presentación

Recepciona las entradas del usuario

Provee un conjunto de funciones independientes del hardware


Arquitecturas No Monolíticas: Modelos MultiagentesModelo PAC. Presentación-Abstracción y Control [Coutaz 98]

• La componte de Presentación = Presentación del Agente

• La componente de Diálogo = Control del Agente

• El corazón funcional = Abstracción

A

C

P

Es el comportamiento observable del agente Codifica la entrada y salida

Es el corazón funcional del agenteImplementa el comportamiento del agente independiente de los mediosEs la representación de la imagen

Liga una abstracción a una presentaciónControla el comportamiento y el diálogoMantiene secuencia de acciones y de diálogoRecuerda el estado localPermite interrelación entre agentes


Arquitecturas No Monolíticas: Modelos Multiagentes

Modelo PAC. Presentación-Abstracción y Control [Coutaz 98]

• Este modelo estructura recursivamente un sistema interactivo como una jerarquía de agentes

• El nivel superior representa a la Componente de Aplicación

A

C

P Nivel Superior

Nivel Intermedio o de Interfaz

Nivel Inferior o Widgets


Fundamentos de HCI UX

Diseño de Experiencia de Usuario UX La Experiencia de Usuario se basa en la capacidad de

poder influir positivamente en el usuario de una interfaz; persuadir y establecer una conexión con él a través de un diseño y una forma comunicacional intencional para cada uno de los elementos de la misma.

Generalmente se diseña el producto pero no se diseña la experiencia de su uso. Se diseña su funcionalidad y su estética; su funcionamiento y su forma, pero no se diseña para garantizar que estos sean percibidos satisfactoriamente por el usuario en un contexto de interacción.

Fundamentos de HCI UX

UX y las áreas involucradasExisten varias áreas dentro de UX : Diseño de Interacción, Experiencia de Usuario, Diseño Visual, Diseño Gráfico, Estrategia de Contenidos, Arquitectura de la Información.

Fundamentos de DCU UX

Diseño de Experiencia de Usuario UX Todas las ramas del HCI se deben unir para lograr una

completa y funcional experiencia de usuario. Más allá de las perspectivas específicas a cada rama,

debe haber un objetivo común: optimizar UX (El paragüas de UX)

Fundamentos de DCU UX

Diseño de la Experiencia de Usuario Algunas componentes básicas de UX:Facilidad: ¿Cuan fácil es para los usuarios entender tu interfaz?Eficiencia: Una vez entendido el diseño, ¿Cuánto tardan en cumplir las tareas básicas?Recordabilidad: Cuando un usuario regresa después de un periodo de tiempo ¿Qué tan complicado les resulta volver a “conectarse” con la interfaz?Errores: ¿Cuántos errores comenten tus usuarios, cuán graves son? y qué tan fácil pueden corregirse?Satisfacción: ¿Qué tan bien y cómodos se sienten?Utilidad o Productividad: ¿Cuánto de la aplicación usan?

Fundamentos de HCI DCU

Diseño centrado en el usuario DCU El proceso de poner en práctica la creación de ese

“contacto/ enganche/engagement” del usuario, garantizado una experiencia UX eficiente, se llama DCU.

El concepto de DCU es: Tener en cuenta al usuario en todas las etapas metodológicas del desarrollo del producto interactivo.

Como dice Garrett: The implications of this simple concept, however, are surprisingly complex.

Fundamentos de HCI Usabilidad

Usabilidad Es la conjunción de cualidades u objetivos que debe

cumplir la interfaz del usuario de un producto


Usabilidad La Usabilidad es la medida de la calidad de la experiencia de

un usuario cuando interactúa con un producto o sistema. Se mide estudiando la relación entre las herramientas (de

un Sitio Web sería el el sistema de navegación, las funcionalidades, servicios y los contenidos ofrecidos) y quienes las utilizan, fijando la eficiencia en el uso de los diferentes elementos ofrecidos en las pantallas y la efectividad en el cumplimiento de las tareas que se pueden llevar a cabo a través de ellas.

La mejor forma de crear un Sitio Web usable es realizando un diseño centrado en el usuario, diseñando para y por el usuario


Objetivos de la Interfaz del Usuario Simplicidad

• Fácil aprendizaje y utilización

• Forma de expresión entendible para el usuario

Flexibilidad de la Interfaz• Se considera a los dos agentes interactuantes equiparables

• Forma de interacción preestablecida y planteada en términos del usuario, no de la aplicación

Confiabilidad• Consistencia en la presentación y expresión de conceptos

Transparencia• Visualización permanente del estado y comportamiento del sistema

Ergonomía• Adaptación al estilo y perfil del usuario

CALIDADde USO

Podemos definir la usabilidad como la medida en la cual un producto puede ser usado por usuarios específicos para conseguir objetivos específicos con efectividad, eficiencia y satisfacción en un contexto de uso especificado

Efectividad se entenderá la precisión y la plenitud con las que los usuarios alcanzan los objetivos especificados.

Eficiencia capacidad para lograr un fin empleando los mejores mecanismos, medios y recursos posibles.

Satisfacción se entenderá la ausencia de incomodidad y la actitud positiva en el uso del producto. Se trata, pues, de un factor subjetivo.

Usabilidad

Userfriendly

Usability Quality in use

1980 2005


Calidad de uso (Usabilidad) significa que la gente que utilice un producto pueda realizar rápida y facilmente sus tareas. Esta definición descansa en cuatro puntos:

(1) la usabilidad significa centrarse en el usuario; (2) que la gente que use un producto lo haga de forma productiva; (3) los usuarios son gente ocupada que tiene que hacer cosas; y (4) son los usuarios los que deciden cuando un producto es fácil de

usar. Janice (Ginny) Redish and Joseph Dumas,

A Practical Guide to Usability Testing, 1999, p. 4


Fundamentos de HCI ISO 9126

"La usabilidad se refiere a la capacidad de un software de ser comprendido, aprendido, usado y ser atractivo para el usuario, en condiciones específicas de uso"

ISO 9126-1

P R O D U C T O

Evaluacióncualitativa

Fundamentos de HCI ISO 9241-11

"Usabilidad es la efectividad, eficiencia y satisfacción con la que un producto permite alcanzar objetivos específicos a usuarios específicos en un contexto de uso específico"

ISO 9241-11

P R O C E S O

Evaluacióncuantitativa

ISO 9126-1: usability ISO 9241-11: usability

ISO 9126-4: quality in use

Fundamentos de HCI De Usabilidad a Calidad de Uso

•(ISO 9241-11, 1994)

Fundamentos de HCI Usabilidad- Métricas

•(ISO 9126-4, 2004)


•Principios de Nielsen Diálogo simple y natural

Lenguaje del usuario

Minimizar el uso de la memoria del usuario

Consistencia

Feedback

Salidas evidentes

Mensajes de error Prevención de errores

Atajos

Ayudas


8 Reglas de oro para el diseño de la interfaz (Shneiderman)

Consistencia Shortcuts Feedback informativo Buen diseño del diálogo Manejo de error simple Reversa de acciones Control por parte del usuario Minimizar memoria del usuario


First Principles of Interaction design (Tognazzini)

Anticipation Autonomy Color Blindness Consistency Defaults Efficiency of the user Explorable Interfaces Fitt’s law Human Interface Objects Latency reduction

• Track state

• Visible navigation

•Learnability

•Use of metaphors

•Protect users’ work

•Readability


1. Guidance 1.1. Prompting 1.2. Grouping / Distinction between items 1.2.1. Grouping / Distinction by location 1.2.2. Grouping / Distinction by format 1.3. Immediate feedback 1.4. Legibility 2. Work load 2.1. Brevity 2.1.1. Concision 2.1.2. Minimal actions 2.2. Information density 3. Explicit control 3.1. Explicit actions 3.2. User control 4. Adaptability 4.1. Flexibility 4.2. User experience 5. Error management 5.1. Protection to errors 5.2. Quality of error messages 5.3. Error correction 6. Homogeneousness / Consistency 7. Significance of codes 8. Compatibility

•(Bastien et al., 1993)


fundamentos de hci

Documents