1.
Introducción al DCU
Yuliana Puerta Cruz
CONTENIDO
1. La Interacción Persona Ordenador (IPO)
2. USABILIDAD
3. ACCESIBILIDAD
4. EXPERIENCIA DE USUARIO
5. DIFERENCIAS ENTRE USABILIDAD Y UX
1.La Interacción
Humano
Computador
¿QUÉ ES LA INTERACCIÓN HUMANO COMPUTADOR?
● IHC estudia el diseño, implementación y evaluación
de sistemas interactivos en el contexto de las
actividades del usuario.
● IHC se define como el entendimiento, diseño,
evaluación e implementación de sistemas interactivos
para el uso por humanos.
● “IHC es el diseño de sistemas computacionales que
apoyan a personas para que puedan llevar a cabo sus
actividades de manera eficiente y segura.” [Preece
et al., 1994].
¿QUÉ ES LA INTERACCIÓN HUMANO COMPUTADOR?
● “IHC es el estudio y práctica de usabilidad. Es sobre el entendimiento,
y creación de software y otras tecnologías que la gente querrá utilizar,
será capaz de utilizar y encontrará efectivo al usarla.” [Carroll, 2002]
● “No debemos de enfocarnos tanto en la interacción
humano-computadora, sino más en la interacción entre humanos a
través de la computadora.” [comentario de Terry Winogard]
COMPONENTES DE LA INTERACCIÓN HUMANO COMPUTADOR
● HUMANO
● DISPOSITIVOS
● INTERACCIÓN
https://www.youtube.com/watch?v=5iijl3Cf1sE
https://www.youtube.com/watch?v=5iijl3Cf1sE
EL HUMANO
En esta disciplina el término humano no se refiere necesariamente a un
individuo, sino que puede referirse a un grupo de individuos con un perfil
determinado o trabajando de manera colectiva, en secuencia o en paralelo.
EL HUMANO
¿Cuáles son las capacidades y procesos involucrados de los
Humanos al desarrollar tareas en el computador?
MEMORIA OÍDO
COGNICIÖN VISTA
TACTO
EL HUMANO
Modelo cognitivo general Reascos y Miño (2011)
EL HUMANO
La sensación es el proceso
mediante el cual ocurre la
recepción de los estímulos del
ambiente mediante los órganos
sensoriales
La percepción es la capacidad de
captar por medio de todos los
sentidos toda la información
disponible y seleccionar,
organizar e interpretar los
estímulos, para darle un
significado a esos elementos,
todo esto en relación al
conocimiento almacenado en la
memoria.
Actividades Cognitivas de un Usuario Reascos y Miño (2011)
LOS DISPOSITIVOS TECNOLÓGICOS
EL término computadora se
refiere a una amplia gama de
sistemas que pueden ir desde
una computadora de
escritorio, un teléfono
celular, un vehículo, un
horno de microondas, una
tostadora de pan, un sistema
embebido, hasta sistemas que
incluyan elementos no
necesariamente
computarizados como personas
o procesos.
LOS DISPOSITIVOS TECNOLÓGICOS
REALIDAD VIRTUAL VISUALIZACIÓN 3D
REALIDAD AUMENTADA
LA INTERACCIÓN
La interacción involucra todo lo que se relaciona con el diálogo entre el
humano y la computadora, utilizando dispositivos de entrada y salida, ya sea
de manera implícita o explícita. Por estas razones, cuando se habla de
computadoras en IHC se habla en realidad de sistemas interactivos.
LA INTERACCIÓN
Cañas y Waern (2001), plantearon una clasificación de la interacción entre los
tipos informáticos y los factores humanos en relación con ella, la cual se
describe a continuación:
ASPECTOS LAS TAREAS LAS TAREAS INDIVIDUALES
SOCIOCULTURALES COLABORATIVAS
ROL de la Tecnología en la Memoria, Razonamiento, Toma de
CSCW que corresponden a lo
Sociedad. decisiones, entre otros. Dentro de estos
que podríamos traducir en
temas, cabe destacar por su importancia a
español como trabajo
la hora del diseño de interfaces, los
La influencia que tiene la colaborativo apoyado por
Modelos Mentales. Es muy importante
sociedad en el diseño de computador
conocer cómo el usuario adquiere y
esta tecnología almacena en su memoria un modelo del
sistema con el que está interactuando
ASPECTOS QUE DETERMINAN LA INTERACCIÓN
PRIMITIVAS DE INTERACCIÓN
Posicionamiento: permite obtener una Selección: esta tarea básica consiste en la
determinada posición u orientación, la cual selección de un elemento de entre un
puede ser en cualquier dimensión (2D, 3D). conjunto (de órdenes, atributos, objetos,
Se puede usar para dibujo, situar ventanas, entre otros.). El conjunto puede ser: de
arrastrar elementos, entre otros. Implican las tamaño fijo: elementos invariables (órdenes)
siguientes acciones: mover un cursor e y de tamaño variable: elementos de la
introducir coordenadas. aplicación (objetos).
Introducir Valor/Texto: corresponde a la Arrastre: corresponde a la introducción de una
introducción de un dato cuantificable, el sucesión de posiciones que muestran un
cual puede ser: número, sea a través de determinado movimiento. Se utiliza
teclado numérico o a través de generalmente para describir de forma explícita
representaciones gráficas en las que se los manejos que se realizan sobre objetos
utilice el ratón; valores porcentuales y/o gráficos (rotar, mover, escalar).
información textual.
ASPECTOS QUE DETERMINAN LA INTERACCIÓN
METÁFORAS DE INTERACCIÓN
Representación de objetos o acciones, además se pueden definir como modelos
conceptuales que son similares en algunos aspectos a la entidad real que
representan,destacando que tienen sus propiedades particulares. Consideran el
conocimiento previo y lo relaciona con los nuevos conceptos.
ASPECTOS QUE DETERMINAN LA INTERACCIÓN
ESTILOS DE INTERACCIÓN
Líneas de órdenes: indica Menús y Navegación: grupo de
instrucciones al ordenador directamente alternativas visualizadas en la pantalla, que
mediante teclas de función, caracteres se pueden seleccionar de forma individual o
simples, que son más fáciles de recordar y grupal lo que da como respuesta la
comandos de palabras completa y ejecución de una orden subyacente que
abreviaturas que son más rápidas de provoca un cambio en el estado de la
producir. interfaz.
Manipulación Directa: las pantallas
gráficas de alta resolución y los Interacción asistida: asistente personal o
dispositivos apuntadores, como el ratón, agente que colabora con el usuario y este no
han permitido la creación de los entornos dirige la interacción, si no que trabaja de forma
de manipulación directa, estas interfaces cooperativa con el agente o agentes reduciendo
suponen un cambio de una sintaxis de el esfuerzo global
comandos compleja a una manipulación
de objetos y acciones con gran facilidad,
EJERCICIO 1:
1. Vamos a Revisar el Correo e Identifiquemos los
estilos de interacción que identificamos
PARADIGMAS DE INTERACCIÓN
● REALIDAD VIRTUAL
● COMPUTACIÓN UBICUA
● REALIDAD AUMENTADA
DISCIPLINAS QUE CONTRIBUYEN EN LA HCI
● Ciencia de la Computación: Algoritmos, estructuras de datos,
ingeniería de software.
● Psicología Cognitiva: Capacidades y limitaciones del usuario,
Interacción en grupo (distributed cognition), Estructura y
funciones de la organización, Apoyo a la toma de decisiones.
● Psicología Organizacional: Estructura y funciones de la
organización.
● Ergonomía: Diseño de hardware y software que no dañen al
usuario.
Desempeño y eficiencia.
● Lingüística: Diálogos (speech acts).
● Inteligencia Artificial: Hacer que la computadora haga lo más
conveniente, en el momento adecuado, de acuerdo al usuario
correspondiente.
● Antropología: Aspectos culturales del usuario y su grupo.
● Diseño: Diseño Gráfico y Diseño de información.
FACTORES QUE INCIDEN
Factores relativos al usuario.
● Factores de las capacidades y procesos cognitivos del
usuario.
● Factores de la interfaz del usuario.
● Factores referentes a la tarea del usuario.
Factores de las capacidades y procesos cognitivos del usuario.
● Motivación
● Gusto a las actividades
● Satisfacción
● Experiencia
● Capacidad de aprendizaje
FACTORES QUE INCIDEN
Factores de la interfaz del usuario
● Dispositivos de entrada
● Dispositivos de salida
● Estructura de los diálogos humano-computadora
● Uso de colores
● Iconos
● Comandos
● Gráficas
● lenguaje natural
● Realidad virtual
● Multimedios
FACTORES QUE INCIDEN
Factores referentes a la tarea del usuario
● Facilidad y complejidad
● Novedad
● Repetitividad
● Monitoreo
Factores referentes a la funcionalidad del sistema
● Hardware disponible y necesario.
● Software disponible y necesario.
ÁREAS DE HCI
Técnicas para construcción de sistemas
interactivos
• Diseño centrado en el usuario
• Prototipos de baja y alta fidelidad
• Modelado de tareas
• Modelado de la presentación
• Generación de nuevos estilos y paradigmas
de interacción
ÁREAS DE HCI
● Técnicas de evaluación de interfaces:
○ Usabilidad
○ Experiencia del usuario
○ Accesibilidad
○ Internacionalización
EL ROL DE HCI EN EL DISEÑO DE SISTEMAS
Mejorar la calidad de la interacción entre humanos y
computadoras. Para ello se requiere de la aplicación
sistemática de conocimiento sobre las metas humanas,
capacidades y limitaciones junto con el conocimiento
sobre las capacidades y limitaciones de la tecnología.
Este conocimiento debe relacionarse al entendimiento de
los aspectos sociales, organizacionales y físicos del
entorno de trabajo del usuario.
ORGANIZACIONES QUE PROMUEVEN HCI
EJERCICIO 2:
1. ESCOJAMOS UN SOFTWARE DE USO COMÚN
2. IDENTIFIQUEMOS CARACTERÍSTICAS DE INTERACCIÓN
ENTRE EL SISTEMA Y NOSOTROS.
2.La Usabilidad
https://www.lingscars.com/
http://arngren.net/
Cómo se sintieron?
SIN REGRESO!!
1. Uso complejo de la información.
2. La información se presenta de
forma confusa.
3. Se observan decenas de estímulos
visuales y elementos sin
jerarquizar.
4. Ausencia de recorrido visual.
5. Saturación.
6. Carga lenta.
Y ahora!!
Hablemos de Usabilidad...
Qué es la USabilidad?
Propiedad que tiene un
determinado sistema para
que sea «fácil de usar o de
utilizar y de aprender«;
tratándose de una propiedad
que no es sólo aplicable a
los sistemas software, sino
que, como muestra D. NORMAN
en (NOR90), es aplicable a
los elementos de la vida
cotidiana.
ISO 9241-11 (Guidance on Usability – 1998)
“La medida en que un
sistema, producto o
servicio puede ser
usado por usuarios
específicos para
alcanzar metas con
efectividad eficiencia
y satisfacción en un
contexto de uso
específico”
(Bevan,2008) y
(ISO,2009).
ISO 9241-11 (Guidance on Usability – 1998)
derá
SATISFACCIÓN: se enten
: precisión y d y la
EFECTIVIDAD EFICIENCIA: los recurso
s la ausencia de incomodida
n la que los o del
la p le n it u d c o empleados en relación co
n actitud positiva en el us
un
us u a ri o s a lc a nzan los
la precisión y plenitud co
n producto. Se trata, pues, de
ificados. n factor subjetivo.
objetivos espec que los usuarios alcanza
e Aprender
● Facilidad d los objetivos especificados
ores
● Tasa de Err
de recordar
● Facilidad
el sistema
Qué es la USabilidad?
Es un término
multidimensional. Indica que
un sistema usable debe
poseer los siguientes
atributos:
● Capacidad de aprendizaje,
● eficiencia en el uso,
● facilidad de memorizar,
● tolerante a errores
● subjetivamente SIN MUCHO QUE
satisfactorio [NIE93]. PENSAR!!!!!
POR LO TANTO!
no debemos confundir “implicar al usuario en el
diseño del sistema” con “realizar el diseño del
sistema pensando en el usuario”
https://mpiua.invid.udl.cat/usabilidad/beneficios/
centrarse en el usuario significa centrarse en todos los
usuarios , sin que ello indique que debamos incorporar a
todos los posibles usuarios de un determinado sistema, sino
que debemos contemplar todos los rasgos diferenciales entre
ellos, pensando incluso en aquellos que adolecen de alguna
discapacidad [STE95]
https://mpiua.invid.udl.cat/usabilidad/beneficios/
HABLEMOS DE ATRIBUTOS que debe
tener un sistema fácil de usar
...
Atributos de Usabilidad
ATRIBUTO DESCRIPCIÓN
Hace referencia a la necesidad de minimizar el tiempo necesario que
Facilidad de Aprendizaje se requiere desde el no conocimiento de una aplicación a su uso
productivo
El usuario tiene que poder evaluar el efecto de operaciones anteriores
en el estado actual. Es decir, cuando una operación cambia algún
Sintetizabilidad
aspecto del estado anterior es importante que el cambio sea captado
por el usuario.
La familiaridad de un sistema es la correlación que existe entre los
Familiaridad conocimientos que posee el usuario y los conocimientos requeridos
para la interacción en un sistema nuevo.
Un sistema es consistente si todos los mecanismos que se utilizan
Consistencia son siempre usados de la misma manera, siempre que se utilicen y
sea cual sea el momento en el que se haga.
Atributos de Usabilidad
ATRIBUTO DESCRIPCIÓN
hace referencia a la multiplicidad de maneras en el que el usuario y el sistema
Flexibilidad:
intercambian información.
Grado de facilidad que una aplicación permite al usuario para corregir una
Recuperabilidad:
acción una vez está reconocido un error.
Tiempo de Tiempo que necesita el sistema para expresar los cambios de estado del
Respuesta: usuario.
Los servicios que el sistema proporciona deben soportar todas las tareas del
Adecuación de
usuario, que deben estar adaptadas al modelo mental de éste y no al del
Tareas:
desarrollador.
Disminución de la Este aspecto condicionará enormemente la disposición y el diseño de los
carga cognitiva: distintos elementos interactivos que aparecerán en la interfaz.
Modelo de Calidad del Software ISO25010
La usabilidad es el atributo de calidad que
mide lo fácil que son de usar las interfaces
Web Jacob Nielsen
Principios Heurísticos de NIELSEN
1. Visibilidad del estatus del sistema
2. Relación entre el sistema y el mundo real
3. Control y libertad del usuario
4. Consistencia y estándares
5. Prevención de errores
6. Reconocimiento antes que recuerdo
7. Flexibilidad y eficiencia de uso
8. Diseño estético y minimalista
9. Ayudar a los usuarios a reconocer, diagnosticar y
recuperarse de los errores
10. 10. Ayuda y documentación
1. Visibilidad del Estatus del Sistema
No dejar al usuario pensando Dale un Feedback Constante
“¿qué estará pasando ahora?”
BARRAS DE PROCESO UTILIZA ANIMACIONES ENVÍA MENSAJES
2. RELACIÓN ENTRE EL SISTEMA Y EL MUNDO REAL
El sistema debe hablar al usuario en su lenguaje natural: Imagenes, Orden de las
Tareas, Como se presenta la Información.
Entre más claro mejor!!!!!
3. CONTROL Y LIBERTAD DE USUARIO
Cuando el usuario se equivoca,necesitarán una “salida de emergencia o rutas
alternativas” claramente marcadas para dejar el estado no deseado al que accedieron.
Apoyar las funciones de deshacer y rehacer. –
Evitar los “callejones sin salida”
No fuerces al usuario a seguir un camino determinado!!!!!
4. CONSISTENCIA Y ESTÁNDARES
Los usuarios no deberían cuestionarse las acciones, situaciones o palabras
diferentes significan en realidad la misma cosa.
● LOS MENÚS DEBEN
FUNCIONAR DE LA MISMA
FORMA
● USA SIEMPRE LAS MISMAS
FORMAS (COLORES, DISEÑOS)
● LA UBICACIÖN DE LOS
BOTONES
● LOS IDENTIFICADORES DE LOS
BOTONES
● LA UBICACIÓN DE LOS LOGOS
Habla siempre el mismo Idioma, o el usuario se confundirá
5. PREVENCIÓN DE ERRORES
Realizar un diseño cuidadoso que prevenga la ocurrencia de problemas.
Pidiendo confirmación al usuario.
Haciendo comprobaciones en tiempo real. Incluyendo información
contextual preventiva en el
Los errores se pueden prevenir!!
6. Reconocimiento antes que recuerdo
El usuario no debe verse obligado a usar su
memoria para seguir el hilo de la interacción. –
Ejemplo:
• ¿Cómo volver a la página anterior?
• ¿Cómo encontrar aquel producto que ya ha
visto y le interesaba?
La información siempre debe ser la misma!!
7. Flexibilidad y eficiencia de uso
Incluir “aceleradores” que les permitan realizar de
forma más rápida y directa esas acciones nes
frecuentes.
La interfaz debe ser rápida de usar!
8. DISEÑO ESTÉTICO Y MINIMALISTA
Las páginas no deben contener
información innecesaria. Cada
información extra compite con la
información relevante y disminuye
su visibilidad.
La información siempre debe ser la misma!!
9. Ayudar a los usuarios a reconocer, diagnosticar y
recuperarse de los errores
Los mensajes de error:
• Estar escritos en un lenguaje que el usuario pueda
entender.
• Sin tecnicismos.
• Deben siempre sugerir una solución o un camino de
salida.
– Ejemplo: ERROR 404 (página no encontrada)
• Debería ser sustituido por una pantalla amistosa
mostrando: “Vaya, la página que buscas no está aquí,
“utiliza este buscador” o “haz clic en este enlace para
volver a la página principal”.
La información siempre debe ser la misma!!
10. Ayuda y documentación
Es necesario ofrecer ayuda y
documentación, debería ser:
● Fácil de buscar
● Enfocada en las tareas del usuario.
● Lista concreta de pasos a desarrollar.
● No ser demasiado extensa
La información siempre debe ser la misma!!
ALguNOS PROBLEMAS FRECUENTES en páginas web
1. Arquitectura de la información confusa
2. Un diseño no responsive
3. Mala gestión de enlaces internos
4. Falta de mecanismos de búsqueda interna
5. URL no amigables
6. Falta de consistencia funcional en el diseño
7. No marcar el camino
https://www.youtube.com/watch?v=Y7nLeu4cY38
3.La ACCESIBILIDAD
Accesibilidad significa proporcionar flexibilidad para acomodarse a las necesidades de cada usuario y a sus
preferencias y/o limitaciones.
El poder de la web está en su universalidad.
Un aspecto esencial es el acceso para todo
el mundo sin importar la discapacidad. Tim
Berners-Lee, inventor de la World Wide Web
La accesibilidad web o de la interfaz, indica la
capacidad de acceso a la Web y a sus contenidos por
todas las personas, independientemente de la
discapacidad (física, intelectual o técnica) que
presenten o de las que se deriven del contexto de uso
(tecnológicas o ambientales). Esta cualidad está
íntimamente relacionada con la usabilidad.
World Wide Web Consortium (W3C)
Web Content
Accessibility
Guidelines
(WCAG)
PRINCIPIOS
Perceptible
● Directriz 1.1: Provea textos alternativos para contenido no textual, de tal forma
que pueda ser cambiado a formas que las personas puedan necesitar, como
texto de gran tamaño, braille, audio, símbolos o lenguaje más simple.
● Directriz 1.2: Medios basados en tiempo: Provea alternativas para medios
basados en tiempo.
● Directriz 1.3: Cree contenido que pueda ser presentado de diferentes formas
(por ejemplo una disposición más simple) sin pérdida de información o
estructura.
● Directriz 1.4: Haga más fácil para los usuarios el ver y escuchar el contenido,
incluso separando el frente del fondo.
PRINCIPIOS
Operable
● Directriz 2.1: Haga toda la funcionalidad disponible desde el teclado.
● Directriz 2.2: Provea a los usuarios suficiente tiempo para leer el contenido.
● Directriz 2.3: No diseñe el contenido de tal forma que es sabido que se
producirán cortes.
● Directriz 2.4: Provea formas que ayuden a los usuarios a navegar, encontrar el
contenido y determinar dónde están ubicados.
PRINCIPIOS
Entendibles
● Directriz 3.1: Haga el contenido textual legible y entendible.
● Directriz 3.2: Haga que las páginas web se muestren y operen de formas
predecibles.
● Directriz 3.3: Ayude a los usuarios a evitar y corregir errores.
4.La EXPERIENCIA DE
USUARIO
Experiencia de Usuario
Experiencia de Usuario
Experiencia de Usuario
Ejemplos Experiencia de Usuario
SKYPE
Ejemplos Experiencia de Usuario
SPOTIFY
Ejemplos Experiencia de Usuario
AIRBNB
Ejemplos Experiencia de Usuario
AMAZON
¿Qué diferencias hay entre
Usabilidad y UX?
Diferencias entre UX y USABILIDAD
1. La usabilidad busca que el usuario realice su objetivo de
forma fácil, mientras que el objetivo de la UX es que la
navegación del usuario sea agradable.
2. El equipo de Usabilidad Web deberá tener en cuenta,
principalmente, cómo el usuario concibe la interfaz,
mientras que la UX de un site exige un esfuerzo colectivo
de diferentes departamentos: informática, marketing,
diseño y concepción del interfaz, servicio postventa,
etc.
Diferencias entre UX y USABILIDAD
3. La Experiencia de Usuario encontramos diferentes
disciplinas: la usabilidad, como anteriormente hemos
detallado; la accesibilidad; el diseño y la ergonomía; la
utilidad; y el completo servicio que se le ofrezca al
usuario.
EJERCICIO 3:
En parejas
1. Elija un sitio Web y utilice los criterios de usabilidad
anteriormente identificados.
2. Redacte unas conclusiones sobre el grado de usabilidad del
sitio web elegido
BIBLIOGRAFÍA
[Carrol, 2002] Human-Computer Interaction in the new Millenium, John M. Carroll, Ed., Addison-Wesley, 2002.
[Preece et al., 1994] Human-Computer Interaction. Jenny Preece, et al., Addison-Wesley, 1994.
http://ict.udlap.mx/people/ingrid/Clases/IS438/IHC_1.htm
