Capacitaciones UX para diseñadores Agencia Digitaria, año 2012

1. CAPACITACIONES UX
metodología de trabajo
01. Diseño de Interacción

2. Capacitaciones UX
01. Diseño de Interacción
Rodrigo Vera | Jefe de Experiencia de Usuario
¿Diseño de interacción?
El Diseño de Interacción (IxD) define la estructura y comportamiento de
los sistemas interactivos. Los diseñadores de interacción se esfuerzan en
crear relaciones significativas entre las personas y los productos y servicios
que utilizan, desde los ordenadores a los dispositivos móviles a otros
aparatos y más allá.

3. Capacitaciones UX
01. Diseño de Interacción
¿Diseño de interacción?
1. El Diseño de interacción es sobre el comportamiento de las personas.
2. Es sobre la relación de las personas y sistemas o aparatos o entre personas.
3. No es excluivamente sobre entornos o aparatos digitales.
4. Es sobre facilidad de uso, personas y las emociones que provoca una buena o mala experiencia de uso.
5. Es una disciplina interdisciplinaria: Diseño, psicología cognitiva, comunicación, ergonomía, son algunas de los
Rodrigo Vera | Jefe de Experiencia de Usuario
campos que se cruzan en ID.

4. Capacitaciones UX
01. Diseño de Interacción
Temas Contenidos
Rodrigo Vera | Jefe de Experiencia de Usuario
Roles del
Usuario
Mapa de Roles
del Usuario
Roles
Casos de Uso
Mapa de Casos
de Uso
Modelo de
Contenido
Mapa de
Navegación
Wireframes
Interfaz
Modo Operacional (factores del entorno y contextuales)
Modelo de Dominio (glosario, data modelo o modelos de clases de objetos)
Modelo de Diseño Centrado en el Usuario, Constantine & Lockwood
Diseño visual y
de interacción
¿Diseño de interacción?

5. Capacitaciones UX
01. Diseño de Interacción
Rodrigo Vera | Jefe de Experiencia de Usuario
Roles del
Usuario
Casos y
Diagramas
de Uso
Roles y Tareas
Wireframes
Interfaz
Contenidos Diseño visual y de
interacción
A partir del target, definir el
perfil del usuario y los modos
en que participa en el sitio
!
Definir los niveles de participación
del usuario y los tipos de interacción
con el sitio (tareas básicas y
fundamentales)
Definir la estructura
interna del sitio
Diseño y estructura
visual del sitio
Partitura de
Interacción
Mapa de
Navegación
Diagrama
de Flujo
Diagrama
de Flujo
¿Diseño de interacción?

6. Capacitaciones UX
01. Diseño de Interacción
1. Determinar las necesidades del usuario, como tareas y
subtareas habituales, ocasionales y excepcionales.
2. Asegurar la fiabilidad, las acciones deben funcionar como se
especificaron, los datos deben ser fiables y las respuestas rápidas.
3. Considerar el contexto de uso y estimular la estandarización,
integración, consistencia y portabilidad adecuadas.
4. Crear metodología de análisis en las distintas etapas de los
proyectos mediante los puntos anteriores para asegurar la calidad
y eficacia en cada una.
Rodrigo Vera | Jefe de Experiencia de Usuario
¿Diseño de interacción?

7. Capacitaciones UX
01. Diseño de Interacción
Rodrigo Vera | Jefe de Experiencia de Usuario
Roles y Diagramas de Casos de Uso
Actor 1
Tarea A
Tarea B
Tarea C
Tarea D
Tarea E
Actor 2
Actor 3

8. Capacitaciones UX
01. Diseño de Interacción
Rodrigo Vera | Jefe de Experiencia de Usuario
Roles y Diagramas de Casos de Uso
Administrador
de Cursos
rol 1
Ver Cursos
Administrar los temas de los
cursos
Administrar la información de
los cursos
Ver el calendario de
los cursos
Ver los profesores
Administrar la información del
profesor
Asignar cursos a
los profesorews
Estudiante
rol 2
Profesor
rol 3
Ejemplo Sistema de Gestión de Cursos

9. Capacitaciones UX
01. Diseño de Interacción
Rodrigo Vera | Jefe de Experiencia de Usuario
Partituras de Interacción

10. Capacitaciones UX
01. Diseño de Interacción
Este lenguaje propone un sistema de notación que pueda acompañar el
proyecto desde la etapa de estrategia (alto grado de abstracción) hasta la
etapa final de implementación en código (alto grado de especificidad),
permitiendo a cada actor del proyecto (estrategas, diseñadores y
programadores) comprender el total y cuidar el cumplimiento de la visión
original. Se trata de un sistema que permite coreografiar y orquestar
cuidadamente el díagolo en continuidad entre la persona y el servicio.
”
Rodrigo Vera | Jefe de Experiencia de Usuario
Partituras de Interacción
Contacto directo: los elementos de interfaz que permiten al usuario ejecutar tales acciones
———————— línea de visibilidad ————————
Acciones del usuario: la intensionalidad del usuario expresada en sus acciones concretas
———————— línea de interacción ————————
“
Proceso: las funciones que permiten al sistema (servidor) dar respuesta en el diálogo con el usuario

11. Capacitaciones UX
01. Diseño de Interacción
Rodrigo Vera | Jefe de Experiencia de Usuario
Partituras de Interacción
Paso 1 Paso 2 Paso 3 Paso X

12. Capacitaciones UX
01. Diseño de Interacción
Asignar Finalizar
Rodrigo Vera | Jefe de Experiencia de Usuario
Partituras de Interacción
Buscar
Botón Buscar
Genera
Resultados
Seleccionar
Seleccionar
Profesor
Seleccionar
Cursos
Botón Mostrar
Asignaturas
Genera
Resultados
Escribir
Botón Asignar
Asignación
de Cursos a
Profesor
Confirmación de
Proceso Realizado
Ejemplo Asignar Curso a Profesor

13. Capacitaciones UX
01. Diseño de Interacción
• Identificar tipos de usuario y roles dentro del sitio
• Identificar las interacciones de procesos dentro del sitio
• Proporcionar mayor accesibilidad a los proyectos
• Ubicar de manera puntual las fallas detectadas en procesos
• Detectar problemas de usabilidad y rendimiento de los
proyectos en sus fases tempranas
• Posibilidad de ejecutar cambios anticipadamente,
evitando rediseñar sobre el producto final
Rodrigo Vera | Jefe de Experiencia de Usuario
Ventajas de la Optimización

14. Capacitaciones UX
01. Arquitectura de Información (AI)
Rodrigo Vera | Jefe de Experiencia de Usuario
¿Cómo llegamos a ella?
Gracias :)