HCI/IPO: La disciplina dedicada a diseñar, evaluar e implementar sistemas informáticos

interactivos para el uso humano, y a estudiar los fenómenos relacionados más significativos

¿Que hacer?
● Analiza lo que hace la gente con los computadores y las interfaces; entender las tareas
de los usuarios y los requerimientos.
● métodos de especificar cómo debería funcionar la interfaz, cómo debería responder,
y como debería aparecer.
● Diseño de interfaces computacionales de tal forma que se ajusten a las propiedades
y objetivos de las personas.
● Diseño herramientas que ayuden a los diseñadores a construir mejores interfaces.

Los malos diseños, cuestan vidas, tiempo, dinero. Cuando se diseña para las personas
debemos tener en cuenta que todos somos diferentes, por tanto, hay que seguir una serie
de pasos:
1. ¿Qué necesitan las personas? Se analiza.
2. Genera la idea.
3. Testea.
4. Evalúa (y vuelve al paso 1).

La accesibilidad se podría definir como el grado en que un producto puede ser usado por
una persona con algún tipo de discapacidad de forma equivalente a como lo usaría una
persona sin discapacidad.

USABILIDAD: El grado en el cual un producto puede ser usado por usuarios determinados
para lograr los objetivos específicos con efectividad, eficiencia y satisfacción en un contexto
especificado de uso.

Dos principales formas de verla:

- Sumativa: centrada en métrica
- Métricas asociadas a la medir la satisfacción, eficiencia y efectividad
(Estándares ISO)
- Formativa: centrada en la detección de problemas de usabilidad
- Proceso iterativo de diseño (Metodos de evaluacion de la usabilidad)

Característica por la cual puede ser usado un producto, sistema o servicio:

Por usuarios específicos.
● Para lograr unos objetivos específicos.
● Con efectividad, eficiencia y satisfacción.
● En un contexto de uso específico

Calidad de uso: Grado por el cual un producto o sistema puede ser usado por usuarios
específicos, para satisfacer sus necesidades con unos objetivos específicos, con
efectividad, eficiencia, libre de riesgos y satisfacción en contextos de uso específicos.

Factores humanos: se definen como la ciencia que se ocupa de la aplicación de lo que

sabemos sobre las personas, sus capacidades, características y limitaciones al diseño de
los equipos que utilizan, los entornos en los que se desenvuelven y los trabajos que
realizan.

La ergonomía es la disciplina que se encarga del diseño de lugares de trabajo, herramientas y

tareas, de modo que coincidan con las características fisiológicas, anatómicas, psicológicas y
las capacidades de los trabajadores que se @vverán involucrados.

● La ergonomía física: la ciencia del diseño de la interacción del usuario con el equipo y
los lugares de trabajo para adaptarse al usuario.

● ergonomía cognitiva: La ergonomía cognitiva es el campo de estudio que se centra en la

adecuación del uso de un producto a las capacidades cognitivas de los usuarios. Se
basa en el conocimiento de la percepción humana, el procesamiento mental y la
memoria

Sistemas sensoriales

Entrada (Sentidos):
●
● Vista
● Oído
● Gusto
● Olfato
● Tacto

Salida (actuadores):

● Extremidades
● Dedos
● Voz
● Temperatura
● Mirada
● Cabeza
● Pensamiento

Sensación

El cerebro reconstruye lo percibido y realiza una representación interna en función de sus

diferentes componentes.

Esta representación varía de una persona a otra.

Canales de entrada

● Sensación: Captación del estímulo físico a través del canal de entrada y transformación
en un impulso nervioso

● Percepción: Asignación de significado al estímulo que ha entrado en nuestro sistema

cognitivo
Se
nsación
Leyes de la Gestalt
● Proximidad
● Cierre
● Semejanza
● Figura y fondo
● Continuidad
● Simetría
● ...

Las leyes de UX

● Efecto de usabilidad estética: Los usuarios a menudo perciben el diseño

estéticamente agradable como un diseño más útil.
● Umbral de Doherty: La productividad se dispara cuando un ordenador y sus usuarios
interactúan a un ritmo (<400 ms) que garantiza que ninguno de los dos tiene que esperar
al otro.
● Ley de Fitt: El tiempo para adquirir un objetivo es una función de la distancia y el
tamaño del objetivo.
● Ley de Jacob: Los usuarios pasan la mayor parte de su tiempo en otros sitios.
Esto significa que los usuarios prefieren que su sitio funcione de la misma manera que
todos los demás sitios que ya conocen.
● Ley de Región Común: Los elementos tienden a percibirse en grupos si comparten un
área con un límite claramente definido.
● Ley de Pregnancia: Las personas percibirán e interpretarán las imágenes ambiguas o
complejas en la forma más simple posible, porque es la interpretación que requiere un
menor esfuerzo cognitivo.
● Ley de Proximidad: Los objetos que están cerca, o próximos entre sí, tienden a ser
agrupados por los usuarios.
● Ley de Similaridad: El ojo humano tiende a percibir elementos similares en un diseño
como una imagen, forma o grupo completo, incluso si esos elementos están separados.
● Ley de Conectividad Uniforme: Los elementos que están conectados visualmente se
perciben como más relacionados que los elementos sin conexión.

Errores humanos: Los errores son equivocaciones en la elección de un objetivo o en la

especificación de un método para alcanzarlo, mientras que los deslices son errores en la
ejecución de un método previsto para alcanzar un objetivo

Persuación: El diseño persuasivo es un área de la práctica del diseño que se centra en influir
en el comportamiento humano a través de las características de un producto o servicio.
Diseño Centrado en el Usuario

Enfoque del diseño y desarrollo de sistemas que tiene por objeto hacer que los sistemas
interactivos sean más utilizables, centrándose en el uso del sistema, aplicando factores
humanos/ergonómicos, conocimientos y técnicas de usabilidad.

● El diseño se basa en una comprensión explícita de las personas usuarias, las tareas y
los entornos
● Las personas usuarias participan en todo el diseño y desarrollo.
● El diseño es impulsado y perfeccionado mediante una evaluación centrada en la persona
usuaria.
● El proceso es iterativo.
● El diseño se refiere a toda la experiencia de la persona usuaria.
● El equipo de diseño incluye habilidades y perspectivas multidisciplinarias.
● Comprender y especificar el contexto de uso.
● Especificar los requisitos de usuario
● Producir soluciones de diseño para cumplir con estos requisitos.
● Evaluar los diseños con respecto a los requisitos.
3 pilares de la AI (arquitectura de la informacion)
● Ontología (Etiquetas): La catalogación de los elementos
● Taxonomía (Categorías): La clasificación de dichos elementos
● Coreografía (Estructura): Como ubicamos cada grupo según su importancia y las
relaciones entre ellas

Desarrollar la AI
● Estrategia: Comprender objetivos (producto/servicio)
● Alcance: Entender al usuario y modelar al usuario
● Estructura: Analizar funcionalidades y requisitos, contenidos
● Esqueleto:
○ Determinar estructuras de acceso (global y por navegación)
○ Organizar y clasificar la información (etiquetar)
○ Determinar la agrupación (niveles)
● Interfaz: Prototipar el producto o servicio

Cardsorting

Es una técnica de investigación bien establecida para descubrir cómo la gente entiende y
clasifica la información.

Tres tipos de clasificación de tarjetas:

● Abierta: Los participantes clasifican las tarjetas en categorías que tienen sentido para
ellos, y etiquetan cada categoría ellos mismos.
● Cerrada: Los participantes clasifican las tarjetas en las categorías dadas.
● Híbrida: Los participantes clasifican las tarjetas en categorías que les das, y pueden
crear sus propias categorías también.

Tree testing
La prueba “Tree testing” te dice cuán fácilmente la gente puede encontrar información en tu sitio
web, y exactamente dónde se pierde.

Características UI

● Elementos interactivos y consistencia

● Consistencia
○ Se respeta la jerarquía visual y también otros niveles de experiencia
(arquitectura de la información, interacción)
○ Los estados por los que pasan los elementos de la interfaz son coherentes y
consistentes
○ La misma oferta de contenido se replica en todos los dispositivos, con algunos
ajustes para acomodarse a las características de cada dispositivo.
○ Se debe ser consistente en el tono y el lenguaje, además de la consistencia
visual (color, tamaños, jerarquía, tipografía, iconografía).
● Elementos de ubicación
● Navegación
● Identidad
 ○ Todo sistema (aplicación debe tener elementos que permitan al usuario conocer
la identidad del mismo (un nombre, un logo, … algo que acerque al usuario a
saber qué hace y para qué sirve el sistema)

Elementos UI

● Espacio de interacción
● Color
● Tipografía
○ La buena tipografía soporta la estructura visual, transmite el mensaje con mayor
transparencia, complementa el diseño visual
● Iconos
● Menús
● Tono del mensaje
● Formularios

Wireframes & Mockups

Pasos de desarrollo de una aplicación web/app

1. Realización de un sketch
2. Creación de un wireframe
3. Creación de un mockup
4. Realizar un prototipo

Sketch (ideas generales del proyecto)

1. lementos más característicos como logos, etc.

2. Zona de navegación
3. Sistemas de ayuda para usuarios
4. Redes sociales
5. Áreas de contenidos y servicios

Wireframes (AI y estructura del proyecto)

● Son guías de los principales elementos de navegación y contenido de su página o
aplicación.

● Su objetivo NO es representar el diseño visual

Mockup
Son una representación más avanzada del diseño gráfico y comunicativo (desde una visión de
navegación y AI) de un proyecto

● Contenidos (pueden ser imágenes y textos genéricos que no van a ser finalmente
usados en el desarrollo)
● Paleta de colores
● Espacio: Áreas de contenido y servicios
● Iconografía
Prototipo
Es un modelo (representación, demostración o simulación) fácilmente ampliable y modificable de
un sistema planificado, incluyendo su interfaz y su funcionalidad de entradas y salidas.

Los patrones de diseño de la interfaz de usuario son soluciones recurrentes que resuelven
problemas comunes de diseño.