Interfaces Humano-Computadora

Instituto Tecnológico de Colima

Maestría en Sistemas Computacionales

D en C. Patricia Elizabeth Figueroa Millán

patricia.figueroa@itcolima.edu.mx

UNIDAD 1. INTRODUCCIÓN

Agenda

• Unidad 1.- Introducción
  • Concepto de Interfaz Humano-Computadora
  • Evolución de las interfaces de usuario y tecnologías de IHC
  • Características de las interfaces humano-computadora.
  • Tipos de Interfaces.
  • Estilos de Interacción.
    • Lenguaje de comandos.
    • Menús.
    • Manipulación directa.
    • Navegación.
    • Realidad Virtual.
    • Agentes.
  • Aspectos humanos (cognitivos, percepción, modelos mentales, metáforas, sociales, organizacionales).

INTRODUCCIÓN

Los Sistemas Humano-Máquina son sistemas compuestos por humanos y máquinas para llevar a cabo algunas funciones a través de la interacción entre éstos, utilizando interfaces y un entorno en el que está ubicado el sistema [1].

Sistema Humano-Máquina = Humanos + Máquinas + Interfaces + Interacción en un  Entorno

introducción

• La interacción entre humanos y máquinas  se ha convertido en el diálogo de comunicación entre  usuarios y computadoras, a través de una interfaz de usuario y dispositivos con una gran cantidad de habilidades "percibidas" como: tecnologías de rastreo, identificación de voz, retroalimentación inteligente, etc [1]
• Idealmente los términos "interacción humano-computadora" e "interfaces humano-computadora" son definidos  separadamente para denotar la comunicación entre humanos y un sistema computacional y el medio para dicha comunicación [2].

interacción humano-computadora

La Interacción Humano-Computadora (IHC) es el estudio interdisciplinario* de la interacción entre usuarios humanos y computadoras [3], es decir, es el dialogo de intercambio en dos vías de símbolos y  acciones entre humanos y computadoras [2].

interfaz humano-computadora

La Interfaz Humano-Computadora es un medio en la comunicación, una plataforma en el flujo de información y retroalimentación   y una forma de interacción. A esta se le conoce comúnmente como "interfaz de usuario" [4].

Text

*Ciencias Computacionales, Psicología, Ciencias Cognitivas, Factores Humanos, Diseño, Sociología, Ciencias de la Información, IA, etc.

Conceptos

Conceptos

• Sin embargo, ambos términos están cercanamente relacionados en el proceso de desarrollo; por lo cual, en la literatura se utilizan como sinónimos.

EVOLUCIÓN DE LAS INTERFACES HUMANO-COMPUTADORA Y TECNOLOGÍAS IHC

¿Por qué estudiar la historia de la Interacción Humano-Computadora?

En décadas anteriores, la interacción involucraba tarjetas perforadas de 80-columnas,  cintas de papel, pantallas de 1920 caracteres, diskets de 1 megabyte u otras especies extintas.

EVOLUCIÓN DE LAS INTERFACES HUMANO-COMPUTADORA Y TECNOLOGÍAS IHC

¿Son hoy en día relevantes los problemas de interacción de esos tiempos?

No.

Sin embargo, gran parte de lo que se aprendió sobre los procesos perceptivos, cognitivos, sociales y emocionales al interactuar con tecnologías antiguas se aplica a las tecnologías emergentes.

EVOLUCIÓN DE LAS INTERFACES HUMANO-COMPUTADORA Y TECNOLOGÍAS IHC

EVOLUCIÓN DE LAS INTERFACES HUMANO-COMPUTADORA Y TECNOLOGÍAS IHC

DISCUSIÓN

EVOLUCIÓN DE LAS INTERFACES HUMANO-COMPUTADORA Y TECNOLOGÍAS IHC

CARACTERÍSTICAS DE LAS INTERFACES HUMANO-COMPUTADORA

CARACTERÍSTICAS DE LAS INTERFACES HUMANO-COMPUTADORA

INTERACCIÓN CON UN SISTEMA

INTERACCIÓN CON UN SISTEMA

INTERACCIÓN CON UN SISTEMA

Modelos de Interacción de Norman

• El modelo de Norman se enfoca en la vista o percepción del usuario  de la interfaz a través de dos componentes la ejecución y la evaluación.

7 fases:

• Usuario establece el objetivo.
• Formula la intención
• Especifica las acciones en la interfaz
• Ejecuta la acción
• Percibe el estado del sistema
• Interpreta el estado del sistema
• Evalúa el estado del sistema con respecto al objetivo

INTERACCIÓN CON UN SISTEMA

Modelos de Interacción de Norman

• Un usuario se enfrenta a dos restos principales para efectivamente interactuar con la tecnología:
  • Evaluación: entender el estado del sistema.
  • Ejecución: tomar acción para lograr un objetivo especifico.
• Estos retos son descritos como "abismo de evaluación" y "abismo de ejecución"; porque, sin elementos de diseño efectivos para apoyar a los usuarios, pueden convertirse en barreras insuperables entre los usuarios y sus objetivos.

INTERACCIÓN CON UN SISTEMA

Modelos de Interacción de Norman

• Evaluación exitosa:
  • No sólo percibir el indicador de estado del sistema.
  • Interpretar qué significa el estado del sistema.
• Ejecución exitosa:
  • Planeación de una acción basada en el entendimiento de cómo los controles trabajan.
  • Manipular los controles.

Determinar que algo esta "encendido" o "apagado" es un

ejemplo clásico de "abismo de evaluación".

INTERACCIÓN CON UN SISTEMA

Modelos de Interacción de Norman

Para un interruptor de bluetooth, es fácil ver el interruptor y la etiqueta, pero la visibilidad de estos elementos no necesariamente significa que pueden ser interpretados correctamente.

En el interruptor Bluetooth, presionar el interruptor hacia la etiqueta Desactivado cambia el estado del interruptor a Activado, que es lo opuesto a cómo funciona el interruptor deslizante con etiqueta físico.

INTERACCIÓN CON UN SISTEMA

Modelos de Interacción de Norman

Es necesario incluir elementos de diseño que permita a los usuarios establecer una interacción efectiva:

1. Identificando un diseño relevante con lo que los usuarios ya están familiarizados.
2. Crear similitudes visuales.
3. Crear similitudes funcionales.

Abowd and Beale Framework

INTERACCIÓN CON UN SISTEMA

Modelos de Interacción

• Extensión del modelo de Norman para incluir el sistema.
• 4 componentes:
  • Usuario.
  • Entrada.
  • Sistema
  • Salida.
• Cada uno tiene su propio lenguaje.
• Interacción implica traducción entre lenguajes.
• Problemas en la interacción = problemas de traducción

Abowd and Beale Framework

INTERACCIÓN CON UN SISTEMA

Modelos de Interacción

• El usuario inicia la formulación del objetivo/tarea.
• La tarea es articulada (articulation) a través del lenguaje de entrada,
• El lenguaje de entrada es traducido al lenguaje principal del sistema como operaciones de desempeño (performance).
• El sistema se transforma y se encuentra en un nuevo estado.
• El sistema renderiza (presentation) sus atributos a la salida.
• El usuario observa (observation) la salida y evalúa el resultado de la interacción.

Abowd and Beale Framework

INTERACCIÓN CON UN SISTEMA

Modelos de Interacción

• Intenciones del usuario.
  • Traducidas en acciones en la interfaz.
    • Traducidas en alteraciones del estado del sistema.
      • Reflejadas en un dispositivo de salida
        • Interpretadas por el usuario.

• Entorno de trabajo general para la comprensión de la interacción.
  • No restringido a sistemas computacionales.
  • Identifica los componentes principales involucrados en una interacción.
  • Permite la evaluación comparativa de sistemas.
  • Una abstracción

Medio para juzgar la usabilidadde un sistema interactivo

fRAMEWORK ACM SIGCHI

INTERACCIÓN CON UN SISTEMA

Modelos de Interacción

• Utilizado para situar diferentes áreas relacionadas como IHC.
• El campo de la ergonomía enfocado a cuestiones relacionadas con la interfaz del lado del usuario, cubriendo entrada y salida, así como el contexto inmediato del usuario.

fRAMEWORK ACM SIGCHI

INTERACCIÓN CON UN SISTEMA

Modelos de Interacción

• Diseño de diálogo (asociado al sistema) y estilos de interfaces son situados a lo largo de la rama de entrada del entorno de trabajo, enfocándose a la articulación y operaciones de desempeño.

fRAMEWORK ACM SIGCHI

INTERACCIÓN CON UN SISTEMA

Modelos de Interacción

• Presentación y diseño de pantalla están relacionadas a la rama de salida del entorno de trabajo. 
• El entorno por completo puede ser situado en un contexto social u organizacional afectando también la interacción

ergonomía

INTERACCIÓN CON UN SISTEMA

• Estudia las  características físicas de la interacción.
• También conocida como "factores humanos" - sin embargo, esto también puede referirse a mucho más en IHC.
• Permite definir estándares y pautas para restringir la forma en que se diseñan ciertos aspectos de los sistemas.
• EJEMPLOS:
  • Arreglo de controles y displays.
    • Controles agrupados acorde a su función y frecuencia de uso o secuenciabilidad.
  • Ambiente del entorno.
    • Asientos adaptables para hacer frente a tallas de usuario.
  • Problemas de saludo.
    • Posición física, condiciones ambientales.
  • Uso de coloreS:
    • Uso de rojo para advertencia, verde para aceptar, conciencia de daltonismo etc.

tipos de interfaces

tipos de interfaces

INTERFAZ DIRIGIDA POR MENUS

• Forman parte del programa difieren de los menús de ventanas.
• Opciones visibles.
• Selección a través de números, letras, teclas de flechas, mouse, o combinación de estos.
• Agrupados en jerarquía.
• Una forma restringida de un sistema WIMP

tipos de interfaces

INTERFAZ DE USUARIO TRIDIMENSIONAL (3D)

• Interfaz de usuario que involucra una interacción 3D
• El humano interactúa con una computadora u otro dispositivo con un aspecto de espacio tridimensional
• Puede ser un espacio físico real o un espacio virtual simulado en la computadora.
• El dispositivo de entrada debe conocer la posición relativa y distancia de la acción del usuario.
  

tipos de interfaces

INTERFAZ WIMP

• Actualmente el entorno más común para computación interactiva.
• Conocido como sistema de ventanas.
• Ventanas, Iconos, Menús y Punteros.
• También se le conoce como un paradigma de IHC, pero no se debe considerar como un "estilo de interacción"

tipos de interfaces

interfaz basada en formularios

• Consisten en formularios en pantalla o formularios basados ​​en la Web que muestran campos que contienen elementos de datos o parámetros que deben comunicarse al usuario.
•  También conocidas como método basado en formularios y formularios de entrada y salida

tipos de interfaces

Interfaz de usuario por voz

• Permiten la interacción a través de voz entre usuarios y dispositivos.
• Comparten un juego común de fundamentos de experiencia de usuario UX para permitir la usabilidad.

tipos de interfaces

INTERFAZ DE USUARIO TACTILES

• Permite la comunicación entre un usuario y un dispositivo electrónico mediante el sentido del tacto a través de una pantalla sensible.

tipos de interfaces

Interfaz de línea de comando

• Lenguaje de scripting.
• Nombre del comando + argumentos.
• Retroalimentación de la invocación del comando.
• Procesamiento estilo batch.

FUTURO DE LAS INTERFACES DE USUARIO

estilos de interacción

estilos de interacción

estilos de interacción

aspectos humanos

Jóvenes, viejos, mujeres, hombres, expertos, principiantes, diestros, zurdos, altos, bajos, fuertes, débiles,  rápidos, lentos, diestros, zurdos, discapacitados, ciegos...

aspectos humanos

aspectos humanos

A  mayor comprensión del humano mejor será la posibilidad de diseñar -interacciones- de sistemas interactivos que funcionen según lo previsto
 

• No se puede dar respuesta precisa a todas las pregunta.
• La metodología es:
  1. Reducir a un grupo definido de humanos
  2. Hacer una tarea en un sistema particular en un ambiente determinado
  3. Observar la interacción.
  4. Medir el comportamiento.

Se logrará responder a las preguntas en un amplio sentido si se realiza la suficiente investigación.

aspectos humanos

• La variable comúnmente más dependiente en la investigación experimental de IHC es el TIEMPO para que un usuario realice una TAREA.
• El modelo de escala de tiempo de Newell es relevante para la IHC, ya que refleja la naturaleza multidisciplinaria del campo.
• La investigación en IHC es a alto nivel y a bajo nivel!!

aspectos humanos

• Banda cognitiva:  tareas caracterizadas como actos deliberados, operaciones y tareas unitarias, discurso espontáneo.
  • Duración de unos pocos o cientos de milisegundos a unas pocas docenas de segundos.
  • Investigación sobre técnicas de selección, diseño de menú, retroalimentación auditiva o forzada, entrada de texto, entrada de gestos, etc.

aspectos humanos

• Banda racional:  tareas que abarcan minutos a horas, como resolución de problemas.
  • Duración abarcan minutos, decenas de minutos u horas.
  • Investigación en navegación web, estrategias de búsqueda, diseño centrado en el usuario, computación colaborativa, computación ubicua, navegación social y situada en la conciencia.

aspectos humanos

• Banda social:  tareas relacionadas con el comportamiento social.
  • Duración días, semanas o meses
  • Investigación en hábitos de trabajo, redes sociales, citas en línea, privacidad, espacios de medios, estilos y preferencias de usuario, teoría del diseño,e tco.

aspectos humanos

• Otra idea que proporciona el modelo de Newell se refiere a la metodología de investigación.
  • Banda biológica: naturaleza altamente cuantitativa, experimental y empírica a nivel de los impulso neurales.
  • Banda cognitiva: Métodos cuantitativos pero generalmente incluyen algunos métodos cualitativos.
  • Banda social: métodos cualitativos y no experimentales (entrevistas, observación, estudios de caso, escenarios, etc). Además incluye una evaluación cuantitativa.

Cuanti

Cuali

aspectos humanos

• Existen muchas formas de caracterizar al "humano" en un sistema interactivo.
  • Modelo del Procesador Humano de Card (1983)
  • Visión de los factores humanos del operador humano en un entorno de trabajo (Kantowitz and Sorkin)

aspectos humanos

• Modelo del Procesador Humano de Card (1983)

aspectos humanos

• Visión de los factores humanos del operador humano en un entorno de trabajo (Kantowitz and Sorkin)

El humano monitorea el estado de la computadora a través de sensores y muestra y controla el estado de la computadora a través de respondedores y controles a través de una interfaz donde tiene lugar la interacción.

aspectos humanos

• Los factores humanos se centran en tres componentes sensores, respondedores y cerebro

aspectos humanos

• Los sensores clásicos humanos son 5:
  • ​Visión
  • Audición
  • Tacto
  • Olfato.
  • Gusto

aspectos humanos

aspectos humanos

aspectos humanos

• Estimulos visuales:
  • Propiedades físicas de la luz.
    • Frecuencia.
    • Intensidad (luminancia)
  • Crear propiedades subjetivas de la visión:
    • Color.
    • Brillo
• La visión es más que la recepción humana de ondas electromagnéticas que tienen frecuencia e intesidad.

aspectos humanos

• A través de los ojos, los humanos miran y perciben el medio ambiente, al hacerlo los ojos participan en dos acciones primitivas: fijación y movimientos oculares sacádicos.
  • Fijación:
    • Ojos estacionarios.
  • Toman un detalle visual del entorno (200ms)
    • Movimientos sacádicos:
    • Posicionamiento rápido del ojo para fijar en una nueva ubicación (120ms)

aspectos humanos

aspectos humanos

• Incluso puede usar cámaras web y cámaras de teléfonos móviles estándar
• Por ejemplo, anunciantes podría querer saber sobre los patrones de visualización y, por ejemplo, cómo los hombres y las mujeres difieren en la visualización de contenido.

aspectos humanos

aspectos humanos

• Existen diferencias de género en los movimientos oculares (Pan et al., 2004), pero queda por demostrar cuán bajo nivel experimental
• Los resultados pueden informar y guiar el diseño.

aspectos humanos

aspectos humanos

aspectos humanos

• Audición: detección de sonido por los humanos.
• El sonido se transmite por el entorno a través de ondas de sonido (fluctuaciones cíclicas de presión en el aire)
• La audición ocurre cuando:
  • Las ondas sonoras alcanzan el oído humano, estimulando el tambor del oído para crear impulsos nerviosos que se envían al cerebro.
  • Un sólo sonido tiene cuatro propiedades físicas:
    • Intesidad (volumen)
    • Frecuencia (tono)
  • Crea propiedades subjetivas de audición:
    • Tono, volumen, timbre, ataque
• Los dos oídos ayudan a identificar la ubicación del sonido (dirección y distancia.

Los sonidos -> variedad de señales a los humanos

aspectos humanos

• Tacto: Parte del sistema  somatosensorial, el cual incluye receptores sensoriales en la piel, músculos, huesos, articulaciones y órganos que proporcionan una variedad de información sobre los fenómenos en los entornos físicos
  •  Incluye:  tacto, temperatura, dolor,  posición de la extremidades..
• La retroalimentación táctil en IHC se refiere a la información proporcionada a través del sistema somatosensorial.
• Todas las interfaces de usuario que implican contacto físico con las manos del usuario ( o otras partes del cuerpo ) incluyen retroalimentación táctil.
• Aumentar la experiencia del usuario a través de la retroalimentación táctil activa es un tópico de investigación común.

aspectos humanos

• Olfato y gusto:
  • ​Olfato capacidad para percibir olores.
  • Gusto capacidad de recepción química directa de dulce, salado, picoso y otras sensaciones a través de la lengua y la cavidad oral.
  • El sabor es un proceso perceptivo en el cerebro que ocurre a través de una asociación de los sentidos del olfato y el gusto.
  • Aunque el olfato y el gusto son conocidos intuitivamente por virtualmente todos los humanos, y con delicadeza experta, son  menos entendidos que lo visual y sentidos auditivos.
  • Mientras que los humanos usan el olfato y el gusto todo el tiempo sin esfuerzo, estos sentidos no son generalmente "diseñado en" a los sistemas.

aspectos humanos

• Olfato y gusto:
  • Muy pocos ejemplos en IHC:
    • Brewster y et al. (2006) estudiaron el olor como una ayuda en la búsqueda de álbumes de fotos digitales.
    • Bodnar y et al. (2004) quienes compararon las modalidades olfativas, auditivas y visuales para notificar a los usuarios de una interrupción por un mensaje entrante.

aspectos humanos

• Otros sentidos:
  • Muchos contextos para la palabra sentido:
    • ​Sentido de urgencia, un sentido de dirección, sentido musical,
      sentido intuitivo, sentido moral o incluso sentido común
  • Encapsulan como se sienten los humanos acerca de sus interacciones con las computadoras: satisfacción, confianza, frustración, etc
  • ¿Hay receptores que captan estos sentidos, como las células en la cavidad naval? Quizás.

aspectos humanos

• Los humanos controlan su entorno a través de los respondedores: 
  • Un dedo para escribir o apuntar.
  • Un pie para caminar o correr.
  • Ceja para fruncir el seño.
  • Cuerdas vocales para hablar.
  • Torso para inclinarse

aspectos humanos

• El motor homúnculo de Penfield:
  • Muestra los respondedores humanos y el área relativa de la corteza cerebral motora dedicada a cada uno .

aspectos humanos

• Ejemplos de respondedores.

aspectos humanos

• Se consideran usuarios diestros o zurdos.
• Las cuerdas bucales son respondedores.
  • Sonidos creados a través de la combinación de:
    • Movimiento en la laringe, presión pulmonar en los pulmones.
  • Dos tipos de sonidos vocalizados
    • Habla, No-habla
    • Ambos con potencial control computacional:
      • Habla + reconocimiento del habla.
      • No habla + detección de señales (ej. frecuencia, volumen, duracción, cambio de dirección).
  • El ojo como respondedor:
    • Como controlador, el ojo está llamado a hacer "doble tarea"
      • Sentir y percibir el entorno / computadora
      • Actuar como controlador a través de movimientos sacádicos y fijaciones

aspectos humanos

aspectos humanos

aspectos humanos

aspectos humanos

Las personas sobresalen en la percepción, en la creatividad, en la capacidad de ir más allá de la información dada, dando sentido a eventos caóticos. A menudo tenemos que interpretar los eventos más allá de la información disponible, y nuestra capacidad para hacerlo de manera eficiente y sin esfuerzo, por lo general sin siquiera saber que lo estamos haciendo, aumenta enormemente nuestra capacidad de funcionar.

Donald Norman

aspectos humanos

aspectos humanos

aspectos humanos

aspectos humanos

PROYECTO DE UNIDAD

• El alumno debe investigar y presentar en formato de artículo y exposición oral el estado del arte de la IHC, haciendo hincapié en la importancia de las interfaces.
  • -Redactar usando  la plantilla para artículos en formato IEEE.
  • -Realizar una presentación en power point apegada a la rúbrica de exposiciones y videos.
  • Fecha de entrega: Miercoles 4 de Septiembre.

referencias

• [1] G. Chao, "Human-Computer Interaction: Process and Principles of Human-Computer Interface Design," 2009 International Conference on Computer and Automation Engineering, Bangkok, 2009, pp. 230-233.
  doi: 10.1109/ICCAE.2009.23
• [2] Hartson, H. R., & Hix, D. (1989). Human-computer interface development: concepts and systems for its management. ACM Computing Surveys, 21(1), 5–92. doi:10.1145/62029.62031
• [3] Mayilvaganan, M., & Kalpanadevi, D. (2017). Recent trends in human computer interface to analysis the cognitive skill of students based on user interface. 2017 4th International Conference on Advanced Computing and Communication Systems (ICACCS). doi:10.1109/icaccs.2017.8014723
• [4] Gong, C. (2009). Human-computer interaction: The usability test methods and design principles in the human-computer interface design. 2009 2nd IEEE International Conference on Computer Science and Information Technology. doi:10.1109/iccsit.2009.5234724

gRACIAS

patricia.figueroa@itcolima.edu.mx