Taller de partituras de interacción PiX realizado en ILA21 para usar PiX como método de codiseño online, mediante Miro, que promueve la inclusión de personas con discapacidad intelectual en procesos de ideación colectiva.

1. Una herramienta de diseño accesible para
servicios digitales
09 . 11 . 21| Workshop ILA 21 | Costa Rica
Expositores:KatherineExssCid&HerbertSpencerGonzález
PIX:PARTITURASDE
INTERACCIÓN

2. Cronograma
4:00 - (15 min)
4:15 - (35 min)
4:50 - (30 min)
5:20 - (25 min)
5:45 - (15 min)
6:00 - (20 min)
6:20 - (45 min)
7:05 - (30 min)
7:35 - (20 min)
7:45 ~ 8:00
Introducción y creación de grupos
Presentación: ¿Qué son las Partituras de Interacción PiX?
Actividad1: Creando una partitura de interacción(30 min)
Presentaciones grupales
Break
PiX como herramienta de codiseño accesible
Actividad 2: Codiseñando con PiX (40 min)
Presentaciones grupales
Próximos pasos de PiX, discusión
Término del taller
ILA 21 | PiX: Partituras de Interacción Accesibles

3. Roles UX(para los grupos)
01
02
03
04
05
Management, operaciones, KPIs del negocio
Marketing, contenidos, comunicaciones
AI, estudios de usuarios, usabilidad
Interfaz, HCI, comunicación visual y patrones
TI, Desarrollo, Arquitectura de software
ILA 21 | PiX: Partituras de Interacción Accesibles

4. ¿Qué es PiX?
PiX es unlenguaje visualdiseñado para modelar la interacción entre usuarios y
sistemas. Representa una secuencia de momentos de izquierda a derecha, y
sirve para coordinar los elementos que afectan la experiencia de los usuarios
mientras interactúan con servicios digitales
PiX se estructura en 3 capas:
1. La capa de la persona
2. La capa del diálogo
3. La capa del sistema
ILA 21 | PiX: Partituras de Interacción Accesibles

5. ILA 21 | PiX: Partituras de Interacción Accesibles
¿Cómo definimos conversación?

6. ILA 21 | PiX: Partituras de Interacción Accesibles
¿Cómo definimos conversación?

7. Título de la
partitura
Descripción o bajada
Anotaciones
comentarios
Compás, sección o página
donde ocurre la acción
Encabezado
Lenguaje visual de PiX ILA 21 | PiX: Partituras de Interacción Accesibles

8. Características de PiX
1. Se enfoca en la experiencia humana, en el flujo
del diálogo y su significado en el tiempo
2. Es específico en funcionalidades e implicancias
que afecten comportamiento del sistema
3. Es legible y comprensible por los participantes de
un proyecto (lenguajetransversal)
ILA 21 | PiX: Partituras de Interacción Accesibles

9. Origen
ILA 21 | PiX: Partituras de Interacción Accesibles

10. https://eadpucv.github.io/pix

12. Notaciones de UX
ILA 21 | PiX: Partituras de Interacción Accesibles

13. Microinteracciones
ILA 21 | PiX: Partituras de Interacción Accesibles

14. Primeras hipótesis de PiX
● Vivimos en una economía basada en la experiencia, más que en la
transacción de commodities y bienes
(Pine, Gilmore; 1998)
● La interacción persona-sistema se puede codificar de forma legible en
contextos transversales (multi-dominio)
● Esta codificación puede comprimir información relativa a las distintas
áreas involucradas (herramienta de codiseño)
○ marketing, diseño, desarrollo, etc
● Podemos modelar la propuesta de valor de los servicios con PiX
ILA 21 | PiX: Partituras de Interacción Accesibles

16. Codificación
Plano presentado por los
hermanos Wright para
obtener la patente de su
invento.
¿Es posible patentar el
diseño de una
experiencia?

17. Capa del Usuario
qué especifica➔ intenciones
➔ expectativas
➔ impresiones
cómo se informa➔ contexto social, tecnológico y económico
➔ modelos mentales
➔ investigación de usuarios en general
qué valor define valor simbólico
➔ arbitrario y subjetivo
➔ depende del contexto cultural
➔ se analiza desde el punto de vista comunicacional e implica una comprensión
del sentido social de la interacción
quién participa➔ Gerentes de Marketing y Experiencia del cliente
➔ Gerente de oferta o producto
➔ Encargado de contenidos
➔ Agencia
➔ RRSS (community managers)
➔ Usuarios finales

18. Capa del Diálogo
qué especifica➔ acciones del usuario en tipos de <input>
➔ respuestas del sistema en formas de <output>
➔ tiene distintos grados de resolución
cómo se informa➔ desde el marketing que sabe qué se proyecta y cual es el carácter de la marca
qué valor define valor como experiencia
➔ objetivo y subjetivo a la vez
➔ dentro de un contexto cultural determinado
➔ se analiza como punto de contacto entre persona y servicio y requiere una
comprensión o modelo de experiencia
quién participa➔ diseñador UX
➔ diseñador Front-end
➔ usuarios finales

19. Capa del Sistema
qué especifica➔ el estado de los datos
➔ funciones internas (procesos requeridos)
➔ comunicaciones con 3ª partes
cómo se informa➔ arquitectura global del servicio
➔ tecnología disponible
qué valor define valor como intercambio
➔ objetivo determinado por el precio
➔ por lo deseable de la transacción
➔ se analiza desde la situación de intercambio donde las cualidades del
producto o servicio deben ser visibles y claras
quién participa➔ Arquitecto de software
➔ Desarrolladores (senior / junior)
➔ Operaciones y/o logística

20. Actividad 1
Uso de PiX como herramienta de análisis
de un servicio existente
Objetivo
Comprender y apropiarse del lenguaje PiX
para levantar un servicio existente.
Escenario
Una joven argentina que está viajando por
Lima, se encuentra frente al mar, mirando al
morro y desea compartir con sus amigos y
familia lo que está viviendo.
Caso de uso
Subir una foto, video o historia a una
aplicación para compartir y almacenar
fotografías (ej. instagram)
Identificar los momentos asociados a las 3
capas:
1. Usuario
2. Diálogo
3. Sistema

21. 30 minutos

22. break 15 minutos

23. Codiseño con PiX
ILA 21 | PiX: Partituras de Interacción Accesibles

24. Nuevas hipótesis de PiX
ILA 21 | PiX: Partituras de Interacción Accesibles
La utilización de PIX como método de codiseño permite una
mejora en la cooperación entre equipos multifuncionales
mediante el trabajo con narrativas, facilitando la comprensión
común de los flujos de interacción entre personas y sistemas
digitales y ayudando con la cohesión del equipo y forjando la
colaboración hacia un objetivo común.

25. PiX accesible
Durante el 2020 se trabaja
en un proceso extendido de
ideación y codiseño con
personas con Discapacidad
Intelectual de la región de
Valparaíso, en Chile.

27. Talleres accesibles con PiX
● Estructura de 3 momentos:
○ Presentación de conceptos (asinc.)
○ Sesión de Codiseño (sinc)
○ Reflexión grupal (sinc)
● Gatillante de la interacción desde la narrativa (épicas de diseño)
● Las partituras como objeto representan la propuesta, el consenso
ILA 21 | PiX: Partituras de Interacción Accesibles

28. Accesibilidad desde la narrativa

30. Actividad 2
Uso de PiX como herramienta de codiseño
accesible de un servicio nuevo
Objetivo
Idear y co-crear una tecnología nueva
mediante método participativo de PiX
Escenario
Una pareja vive a distancia y ocupa un
artefacto tecnológico (no un smartphone)
para compartir sus emociones y expresar su
afecto hacia la otra persona.
Encadenación
1. Expresar cariño hacia otra persona
2. Recibir y responder ese afecto
Accesibilidad
Qué consideraciones podemos incorporar
pensando en un usuario con discapacidad
que utiliza este servicio

34. 45 minutos

35. Próximos pasos

36. Narrativas Pictográficas:
PiX como método para la elicitación
de la lectoescritura creativa

37. Muchasgracias.
09 . 11 . 21| PiX: Partituras de Interacción ILA 21 | Costa Rica
Katherine Exss Cid
Diseñadora PUCV, MA en Diseño de Información,
Universidad de Reading, UK. Doctoranda en Arquitectura y
Urbanismo, Universidad del Bío Bío, Chile. Miembro del
claustro del Magíster en Arquitectura y Diseño MAD e[ad].
Investigadora del Núcleo de Accesibilidad e Inclusión
PUCV. Fundadora y co-líder local IxDA Viña del Mar.
kexss@ead.cl // @alikathe
Herbert Spencer González
Diseñador PUCV, MDes en Diseño de Interacción CMU,
EEUU. Más de veinte años de experiencia docente y
profesional en el ámbito del diseño UX, investigación de
usuarios y gestión de proyectos digitales. Investigador del
Núcleo de Accesibilidad e Inclusión PUCV. Director del
Magíster en Arquitectura y Diseño MAD e[ad].
hspencer@ead.cl // @hspencer
http://eadpucv.github.io/pix/