Resumen de la charla: Cómo impacta el rol del Diseñador UX en el resultado del desarrollo y cómo deben trabajar los equipos para producir experiencias de calidad. Para conocer un poco más de la trayectoria de Lucía Bustamante: Diseñadora de Productos Digitales con más de 6 años de experiencia en la industria del software, es también Diseñadora Industrial por lo cual tiene una constante visión centrada en el usuario. Actualmente trabaja para una startup de UK como Product Designer, siempre buscando crear soluciones que agreguen claro valor al negocio y a los usuarios y una mirada enfocada a desarrollo de equipos y mejora de procesos. Lidera las comunidades MujeresIT y Dribbble Meetup Montevideo. LinkedIn: https://www.linkedin.com/in/luciabustamante/ Twitter: @lubustaman Abstracta en redes: YouTube: https://www.youtube.com/c/AbstractaUS Twitter Abstracta Tech Talk: https://twitter.com/AbstractaTech Twitter Abstracta Company: https://twitter.com/AbstractaUS LinkedIn: https://www.linkedin.com/company/abstracta/

1. Design QA
Las grandes experiencias
no ocurren por accidente
Lucía Bustamante
Product Designer

2. Lucía Bustamante
Product Designer (NoblyPOS - UK)
Lead @mujeresituy | @DribbbleMeetupMvd
@lubustaman

3. DesarrolloDiseño UX DevOps QA
El rol de todos afecta la experiencia del cliente/usuario
especialmente el rol del UX
@lubustaman - Design QA

4. Entrega de assets
Requerimientos
Diseño
Implementación
Verificación
Mantenimiento
@lubustaman - Design QA

5. Desarrollo DevOps QA
@lubustaman - Design QA
Los
desarrolladores
diseñan a su
forma
Hacer parte de
las tareas del
Diseñador UX
Reportar errores
de usabilidad y
de experiencia
de usuario
¿El
comportamiento es
el adecuado?
No existe una
guía de
componentes
ni criterios

6. Consecuencias de subestimar el Diseño UX
Inconsistencias
Mala calidad en el producto
Aumento del trabajo innecesario
Aumento de riesgos
Mayores costos de producción

8. La co-creación se trata de trabajar con
personas y para personas.
La experiencia de usuario se realiza
entre equipos multidisciplinarios.
Todos contribuimos a la innovación desde
diferentes puntos de vista.
El Diseño es co-creativo
@lubustaman - Design QA

9. Cambio cultural
Colaboración
Diseño centrado
en el usuario
Equipos
multidisciplinarios
Procesos
@lubustaman - Design QA
Todos participamos

10. Modelo de madurez de
UX en una empresa
Renato Feijó, Diseñador especializado UCD

11. 1 Ignorado
“UX no es importante”
Modelo de madurez de UX
en una empresa

12. 1 Ignorado
“UX no es importante”
2 Interesado
UX es importante pero tiene pocos recursos
Modelo de madurez de UX
en una empresa

13. 1 Ignorado
“UX no es importante”
2 Interesado
UX es importante pero tiene pocos recursos
3 Involucrado
UX es muy importante y empiezan a emerger prácticas
Modelo de madurez de UX
en una empresa

14. 1 Ignorado
“UX no es importante”
2 Interesado
UX es importante pero tiene pocos recursos
3 Involucrado
UX es muy importante y empiezan a emerger prácticas
4 Dedicado
UX es crítico y los ejecutivos están activamente involucrados
Modelo de madurez de UX
en una empresa

15. 1 Ignorado
“UX no es importante”
2 Interesado
UX es importante pero tiene pocos recursos
3 Involucrado
UX es muy importante y empiezan a emerger prácticas
4 Dedicado
UX es crítico y los ejecutivos están activamente involucrados
5 Comprometido
UX es uno de los pilares de la estrategia de la empresa
Modelo de madurez de UX
en una empresa

16. 1 Ignorado
“UX no es importante”
2 Interesado
UX es importante pero tiene pocos recursos
3 Involucrado
UX es muy importante y empiezan a emerger prácticas
4 Dedicado
UX es crítico y los ejecutivos están activamente involucrados
5 Comprometido
UX es uno de los pilares de la estrategia de la empresa
6 Asimilado
UX es parte de la cultura de la empresa
Modelo de madurez de UX
en una empresa

17. ¿Por qué razones el
Diseño se desestima?

18. ¿Por qué razones el Diseño se desestima?
Los equipos o las empresas
no entienden o valoran el
diseño lo suficiente como
para crear un proceso que
fomente buenos resultados.
"la feature funciona"
@lubustaman - Design QA

19. ¿Por qué razones el Diseño se desestima?
La gente no ve la diferencia
entre un diseño y una
versión mal codificada del
mismo.
"me parece lo
suficientemente
bueno"
@lubustaman - Design QA
Los equipos o las empresas
no entienden o valoran el
diseño lo suficiente como
para crear un proceso que
fomente buenos resultados.
"la feature funciona"

20. El enfoque de los equipos
está en la velocidad y la
entrega de funciones,
y la integridad visual es
más fácil de sacrificar que
la codificación.
"no tenemos
tiempo para eso"
@lubustaman - Design QA
Los equipos o las empresas
no entienden o valoran el
diseño lo suficiente como
para crear un proceso que
fomente buenos resultados.
"la feature funciona"
La gente no ve la diferencia
entre un diseño y una
versión mal codificada del
mismo.
"me parece lo
suficientemente
bueno"
¿Por qué razones el Diseño se desestima?

21. A veces se olvida que el
trabajo del diseñador no
termina en el momento
en que se comparte un
enlace de Zeplin.
Darle una lista de problemas
a un ingeniero puede ser
incómodo.
Pueden sentir que los estamos
calificando en su tarea.
La velocidad en la entrega de
a menudo puede superar la
calidad y el diseño.
No se comprende la importancia
de la consistencia de la interfaz
dentro de los productos
digitales.
Otras razones

22. Los usuarios interactúan con la interfaz,
no con el código.

23. Fixes
Fixes
Diseñador UX
El modelo de trabajo común
muchas features tendrían que codificarse nuevamente para solucionar problemas
de interacción y de interfaz de usuario

24. Design QA

25. Es el proceso de revisión de diseños visuales,
micro-interacciones y redacción de textos mediante la
verificación del diseño desarrollado frente al diseño entregado
antes de la producción para encontrar inconsistencias.
El objetivo de un control de calidad de diseño es garantizar que
la calidad y el resultado de diseño esperado se implementen
durante la producción.
¿Design QA, qué es?

26. Revise la versión codificada de la UI antes de realizar las pruebas.
Trabaje con los desarrolladores para realizar ajustes de la interfaz
de usuario en el código.
Observe cualquier inconsistencia y trabaje con el equipo para
priorizar y hacer las correcciones necesarias.
@lubustaman - Design QA
Design QA es una oportunidad para que el Diseñador:

27. Integrar DesignQA al workflow

28. La prueba es el último paso en el proceso de desarrollo,
mientras que el Control de Calidad se ejecuta
en todo momento.

29. Diseñador UX
El diseñador presente desde el inicio
Lograr la
CALIDAD en
el Diseño

30. SEMANA 1-2 SEMANA 3-4 SEMANA 4-6 SEMANA 7-8
Diseño Equipo técnico
SEMANA 1-2 SEMANA 3-4 SEMANA 4-6 SEMANA 7-8
Agile
Tradicional

31. Beneficios del Design QA

32. Beneficios del Design QA
1. Mantiene al Diseñador al tanto
de problemas técnicos
Si el diseñador prueba las features a medida
que se desarrollan, habrá una mayor
comprensión de los problemas técnicos que
surjan y también ayudará a educarlos y evitar
estos problemas en el futuro.
@lubustaman - Design QA

33. 2. Aumenta la colaboración
y la comunicación
Siendo conscientes de los problemas
a medida que surgen, aumenta la
colaboración para encontrar una solución.
@lubustaman - Design QA
Beneficios del Design QA

34. @lubustaman - Design QA
3. Ayuda a construir la interfaz correcta
a medida que el producto se desarrolla
Si DesignQA es parte del proceso, el producto
se desarrolla y aprueba parte por parte; en
lugar de crear toda la funcionalidad y luego
volver a realizar cambios al final del desarrollo.
Beneficios del Design QA

35. 4. Descubrir errores imprevistos
Arreglar un problema puede causar otros
errores. Al documentar los problemas desde
el principio, se podría descubrir problemas
invisibles potencialmente más grandes.
@lubustaman - Design QA
Beneficios del Design QA

36. P1: Este es un bloqueador y debe repararse antes de su lanzamiento. (blocker)
P2: Si la solución no se puede hacer en este sprint, está bien, pero asegurémonos de
agregarlo en el siguiente. (major, medium)
P3: Una solución aquí sería una excelente opción. (low, minor)
Priorizando los issues/bugs según el impacto ✍
Incluir capturas de pantalla, anotaciones, URL y potencialmente datos como navegador, tamaño
de ventana, etc, todo en una misma ubicación.
@lubustaman - Design QA

37. Design debt (deuda de diseño)
Son todas las partes del de diseño o soluciones que fueron omitidas para alcanzar
objetivos a corto plazo o por cambios bruscos en el scope.
... ... ... ...
SPRINTS
Diseño original
+Design Debt +Design Debt +Design Debt +Design Debt
...
Diseño implementado

38. Afecta la calidad de la experiencia de usuario

39. UX + QA
Trabajando juntos

40. ● Amplio conocimiento del producto
● Habilidades para comunicarse
● Creatividad
● Pensamiento holístico
● Pensamiento crítico
● Conocimiento de desarrollo
● Se rige por por resultados
QA
UX
Skills compartidas
@lubustaman - Design QA

41. Busca si se cumplen todos los
criterios de aceptación.
Por ejemplo, cuando el usuario
hace clic en este botón,
¿aparece el modal?
El Diseñador examina:
¿cómo aparece el modal?
¿Se anima demasiado rápido o lentamente?
¿Se desliza desde abajo cuando debería aparecer
desde la izquierda?
¿El diseño parece coherente en todos los
dispositivos?
QA UX
La calidad vista desde diferentes ópticas

42. No fue testeado por un UX Fue testeado por un UX

43. Más formas de asegurar
la calidad

44. Inicio del Proyecto
(kick-off)
Discovery Implementación Testing
Monitoreo
UX Tester
UX
Tester UX
Tester
UX Tester
Refinamiento continuo
Product
Manager
Testers y Diseñadores desde el inicio
Expectativas de la calidad
Planificación de las pruebas
Entender los problemas,
los usuarios, el negocio y
el contexto, etc
Aprender del uso de
usuarios reales para
mejorar la calidad

45. Incluir desarrolladores en el proceso de diseño:
Discutir juntos los requisitos
de una feature antes de
comenzar el diseño para
obtener detalles técnicos que
puedan afectar las decisiones
de diseño.
Esbozar las soluciones
de diseño iniciales
juntos.
Compartir diseños
con desarrolladores
durante todo el proceso
para obtener feedback.
@lubustaman - Design QA

46. Trabajo en
equipo y
colaboración
Diseñadores,
testers, y
desarrolladores
trabajando juntos,
desde la etapa
conceptual.
@lubustaman - Design QA
Integrar
DesignQA
como parte del
workflow de
trabajo
En definitiva

47. Conclusiones

48. @lubustaman - Design QA
El proceso de control
de calidad NO debe
ser responsabilidad
EXCLUSIVA del QA.
Al trabajar en un
producto digital, el
Diseñador UX
debe VERIFICAR
que los diseños se
implementaron
según lo previsto.
El Diseñador UX
debe participar de
las pruebas de
calidad para
ASEGURARSE de
que su trabajo se
refleje en el
resultado final.
Al trabajar junto con
desarrollo durante la
producción,
Design QA puede
ayudar a enviar el
producto de manera
EFICIENTE.

49. @lubustaman - Design QA
El proceso de control
de calidad NO debe
ser responsabilidad
EXCLUSIVA del QA.
Al trabajar en un
producto digital, el
Diseñador UX
debe VERIFICAR
que los diseños se
implementaron
según lo previsto.
El Diseñador UX
debe participar de
las pruebas de
calidad para
ASEGURARSE de
que su trabajo se
refleje en el
resultado final.
Al trabajar junto con
desarrollo durante la
producción,
Design QA puede
ayudar a enviar el
producto de manera
EFICIENTE.

50. @lubustaman - Design QA
El proceso de control
de calidad NO debe
ser responsabilidad
EXCLUSIVA del QA.
Al trabajar en un
producto digital, el
Diseñador UX
debe VERIFICAR
que los diseños se
implementaron
según lo previsto.
El Diseñador UX
debe participar de
las pruebas de
calidad para
ASEGURARSE de
que su trabajo se
refleje en el
resultado final.
Al trabajar junto con
desarrollo durante la
producción,
Design QA puede
ayudar a enviar el
producto de manera
EFICIENTE.

51. @lubustaman - Design QA
El proceso de control
de calidad NO debe
ser responsabilidad
EXCLUSIVA del QA.
Al trabajar en un
producto digital, el
Diseñador UX
debe VERIFICAR
que los diseños se
implementaron
según lo previsto.
El Diseñador UX
debe participar de
las pruebas de
calidad para
ASEGURARSE de
que su trabajo se
refleje en el
resultado final.
Al trabajar junto con
desarrollo durante la
producción,
Design QA puede
ayudar a enviar el
producto de manera
EFICIENTE.

52. ““Complex digital products are like symphonies —
they need an orchestra full of different musicians —
a multidisciplinary team”
wearebrain.com

53. ¡Muchas gracias!
@lubustaman