Webinar

¿Qué es Experiencia de Usuario

y cómo la construimos?

Lucía Bustamante
DISEÑADORA DE PRODUCTOS DIGITALES

@lubustaman
 Hablar cara a cara con la mujer de IT que reside en Uruguay.
Nuclear comunidades de mujeres en tecnología.
Fomentar la inclusión de la mujer en el ámbito tecnológico.
Difundir iniciativas que busquen o sean de mujeres.
Contar qué hacemos las mujeres.
Informar sobre búsqueda de speakers, voluntarias, etc

mujeresit.uy

Directorio de mujeres en IT de mujeresituy@gmail.com

Uruguay y Comunidades.
mujeresituy en Redes meetup.com/es/mujeresituy mujeresit.uy
Lucía Bustamante
Diseñadora de Productos Digitales (NoblyPOS UK)

Lead @mujeresituy | @DribbbleMeetupMvd

@lubustaman
 Mi camino hacia UX
2005

Diseño Diseño
2003
Gráfico
2007
interiores
2011 2012 2014 - Hoy

Tecnicatura
Informática Diseño
Diseño Diseño Producto
Web Industrial
Gráfico digital

Service
Ing Design
Front-
sistemas End

Product
Management
2016
2005
 HOY

49% 33% 18%

Informática Comercial, Sociales, Arte,
Administración Periodismo
 Ahora si….
¿Qué es Experiencia de Usuario
y cómo la construimos?
 ¿Qué es UX?

¿Qué es Experiencia de usuario?

UX es como el usuario
siente y vive su relación con
un producto o servicio.

@luciabustamante
@lubustaman
 ¿Qué es UX?

¿Qué es Experiencia de usuario?

Valor

UX es como el usuario
siente y vive su relación con Satisfacción

un producto o servicio.
Deseable

@luciabustamante
@lubustaman
 Producto Interfaz de usuario Experiencia

Lo que el usuario busca Lo que permite el acceso El consumo

 7 factores que afectan la experiencia

UTILIDAD

USABILIDAD DESEABILIDAD

VALOR

ENCONTRABLE ACCESIBILIDAD

Peter Morville (Inglaterra) CREDIBILIDAD

“Padre” de la arquitectura de la
información
¿Cómo se logra una
buena experiencia?
 ¿Qué es UX?

Diseño Centrado en el Usuario

(UCD: User Centered Design)

Soluciones específicas
y beneficios reales para el usuario
 ¿Qué es UX?

Diseño Centrado
en el Usuario
(UCD: User Centered Design)
 ¿Qué es UX?

Diseño Centrado en el Usuario

Identificar a los Identificar el

usuarios finales contexto de uso

Por qué Cómo

@luciabustamante
@lubustaman
 ¿Qué es UX?

El Diseño Centrado en el Usuario tiene el cuenta:

Hábitos
Género

Edad
Objetivos

Educación,
profesión
Expectativas
Estado y demandas
social Interaccion
es con el
producto

@luciabustamante
@lubustaman
 Principios del Diseño Centrado en el Usuario

Incorporar el Comprensión Participación Es un proceso de

feedback clara de los temprana y diseño iterativo.
del usuario para requisitos y las activa del usuario
definir los tareas. para evaluar el
requisitos y diseño del
el diseño. producto.
 Fases del proceso de Diseño Centrado en el Usuario

IDENTIFICAR OBJETIVOS
y EMPATIZAR ANALIZAR PROTOTIPAR TESTEAR
MEDIBLES
Las preferencias Observar y Establecer Crear prototipos Testear la
y necesidades estudiar las objetivos para la interfaz propuesta e
del usuario y su tareas de los medibles que se de usuario. iterar con
contexto. usuarios en su puedan aplicar usuarios reales
contexto. como criterios de
calidad.
¿El producto se va
a poder usar?
EL CLIENTE NOS PIDE

El diseño de un recipiente con el cual se

pueda servir líquidos calientes en tazas.
Del tipo vasija de metal o porcelana, con
tapa, pico y asa.

@luciabustamante
@lubustaman
El cliente nos pide

@luciabustamante
@lubustaman
¿Y ahora...?

@luciabustamante
@lubustaman
 ¿Qué es Usabilidad?

¿Qué es Usabilidad?

Facilidad con que las personas pueden

utilizar una interfaz, herramienta o cualquier
otro objeto con el fin de alcanzar un objetivo
concreto.

@luciabustamante
@lubustaman
 ¿Qué es Usabilidad?

Fecha de nacimiento

Día Mes Año

20 Enero 1978

@luciabustamante
@lubustaman
 ¿Qué es Usabilidad?

LA USABILIDAD, ES UN ATRIBUTO DE

CALIDAD

@luciabustamante
@lubustaman
¿Si es bonito es mejor?
 Diseño visual

Diseño visual agradable:

Relajación Credibilidad Confianza Tolerancia

Las personas tienden a creer que las cosas que

se ven mejor, funcionarán mejor

@luciabustamante
@lubustaman
 UX
Diseño Diseño visual
Centrado en el
Usuario Armonía
Confianza
Interacción Credibilidad
Tareas

Usabilidad
Funcionalidad
Previsibilidad
Facilidad
¿Qué papel juega
nuestra mente?
Ciencias
Cognitivas
Cómo se procesa la
información, a través de la
percepción y el conocimiento
adquirido.
 Modelos mentales

Modelos Mentales

Son las ideas que formamos en

nuestra mente en base a aprendizajes
de experiencias pasadas y son la forma
en la que entendemos el mundo.

@luciabustamante
@lubustaman
Modelos mentales
Modelos mentales
 Modelos mentales

Ejemplos:

@luciabustamante
@lubustaman
 AHORA...

Hablemos sobre nuestro cerebro

SISTEMA 1 SISTEMA 2
Intuición y memoria Recuperación
reciente y aprendizaje

Rápido Lento
Impulsivo Consciente
Automático Analítico
Inconsciente Racional
Modelos mentales Lógico
 Nuestro cerebro
Demasiados estímulos compitiendo por la atención.
Diseñando para todas las personas
 Accesibilidad

Accesibilidad

Es el grado en el que todas las personas

pueden utilizar un objeto o servicio,
independientemente de sus capacidades
cognitivas o físicas.

@luciabustamante
@lubustaman
 4 principios básicos de la Accesibilidad:
1
PERCEPTIBLE
Cualquier información que se muestre debe
presentarse a los usuarios de forma que pueda ser
percibida fácilmente.

Ejemplo: subtítulos y lengua de señas para hacer

accesible el contenido.
 4 principios básicos de la Accesibilidad:
1 2
PERCEPTIBLE OPERABLE
Cualquier información que se muestre debe La navegación debe ser manejable, es decir, se
presentarse a los usuarios de forma que pueda ser debe poder acceder al contenido desde cualquier
percibida fácilmente. dispositivo de apoyo.

Ejemplo: subtítulos y lengua de señas para hacer Ejemplo: asegurar que la funcionalidad se ejecute
accesible el contenido. desde el teclado.
 4 principios básicos de la Accesibilidad:
1 2
PERCEPTIBLE OPERABLE
Cualquier información que se muestre debe La navegación debe ser manejable, es decir, se
presentarse a los usuarios de forma que pueda ser debe poder acceder al contenido desde cualquier
percibida fácilmente. dispositivo de apoyo.

Ejemplo: subtítulos y lengua de señas para hacer Ejemplo: asegurar que la funcionalidad se ejecute
accesible el contenido. desde el teclado.

3 COMPRENSIBLE
El contenido debe ser claro y fácil de interpretar, sin
dar lugar a confusiones o equivocaciones.

Ejemplo: Ayudar a los usuarios a prevenir y corregir

los errores.
 4 principios básicos de la Accesibilidad:
1 2
PERCEPTIBLE OPERABLE
Cualquier información que se muestre debe La navegación debe ser manejable, es decir, se
presentarse a los usuarios de forma que pueda ser debe poder acceder al contenido desde cualquier
percibida fácilmente. dispositivo de apoyo.

Ejemplo: subtítulos y lengua de señas para hacer Ejemplo: asegurar que la funcionalidad se ejecute
accesible el contenido. desde el teclado.

3 COMPRENSIBLE
El contenido debe ser claro y fácil de interpretar, sin
dar lugar a confusiones o equivocaciones.
Ejemplo: Ayudar a los usuarios a prevenir y corregir
los errores.
ROBUSTO 4
El contenido y la navegación ha de ser interpretado
por los navegadores, dispositivos y tecnologías de
apoyo.
Ejemplo: lectores de pantallas para personas ciegas
como lo son Talkback, VoiceOver.
 Diseño
Interacción
Centrado en el Diseño visual
Usuario Armonía
Confianza
Interacción
Credibilidad
Tareas
CONSTRUCCIÓN Ciencias
DE LA cognitivas

Usabilidad EXPERIENCIA Accesibilidad

Funcionalidad Todas las personas
Previsibilidad pueden utilizar el
Facilidad producto
 Necesidades Atención al
Marketing
del negocio cliente
Diseño
Interacción
Centrado en el Diseño visual
Usuario Armonía
Confianza
Interacción
Credibilidad
Tareas
CONSTRUCCIÓN Ciencias
Performance
DE LA cognitivas
y plataformas
Usabilidad EXPERIENCIA Accesibilidad
Funcionalidad Todas las personas
Previsibilidad pueden utilizar el
Facilidad producto
Ergonomía
Adaptación Estrategia de Arquitectura de la
al contexto
contenido información
Organizar las
información para que
sea comprensible
 UX

Multidisciplinar y Co-creativa
Recursos UX
Inglés Herramientas para validar accesibilidad

https://www.nngroup.com/articles/ Validar el contraste

https://uxmag.com/ https://contrast-ratio.com/

https://www.uxmatters.com/ Evalúa el código

Español https://achecker.ca/checker/index.php

http://www.nosolousabilidad.com/ Simulador de trastornos de la vista

https://uxenespanol.com/ http://colororacle.org/

E-books gratis

https://www.uxpin.com/studio/ebooks/
Recordá siempre, que no sos el usuario.

Muchas gracias!
Lucía Bustamante
DISEÑADORA DE PRODUCTOS DIGITALES

@lubustaman

@luciabustamante