Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Testing Workshop: UX + WordPress = 💙

Testing Workshop: UX + WordPress = 💙

SPEAKER-PONENTE: Emerson Guerrero
La importancia de generar experiencias memorables en los usuarios se ha vuelto uno de los principales objetivos de grandes y pequeñas empresas. El entendimiento en la importancia y generación de valor que aporta el UX a los proyectos se hace cada vez más evidente. Conocer, entender y aprender cómo funciona la experiencia de usuario, nos ayudará a generar proyectos mucho más competitivos.

WordPress Medellín

September 10, 2019
Tweet

More Decks by WordPress Medellín

Other Decks in Design

Transcript

  1. UX + Wordpress
    Émerson Gutiérrez Guerrero

    View full-size slide

  2. ¡Hola!
    Émerson Gutiérrez
    Guerrero
    Líder UX en Pragma S.A.
    @emergugue

    View full-size slide

  3. Qué son, para qué las utilizamos
    y tipos de pruebas
    02
    ¿QUÉ ES UX? PRUEBAS CON USUARIOS
    01
    Resumen final y cierre
    CONCLUSIONES
    04
    TALLER PRÁCTICO
    Crearemos nuestra propia prueba
    para validar con usuarios
    03
    Definición y alcances de la
    experiencia de usuario

    View full-size slide

  4. Definición y alcances de la experiencia de usuario
    01.
    ¿QUÉ
    ES UX?

    View full-size slide

  5. EN GRUPOS, RESPONDAMOS LAS SIGUIENTES PREGUNTAS
    ¿QUÉ HACE UN
    PROFESIONAL UX?
    ¿QUÉ ES UX?
    5 Minutos

    View full-size slide

  6. Nielsen Norman Group
    “Abarca todos los aspectos de la interacción del usuario final con la
    empresa, sus servicios y sus productos.”
    ISO 9241-210 - Ergonomía de la interacción entre humanos y sistemas
    “Son todas la as percepciones y respuestas físicas o emocionales de una
    persona, que resultan antes, durante o después de la interacción con un
    producto, sistema o servicio”
    DEFINICIÓN
    FORMAL DE UX

    View full-size slide

  7. BASES DE LA EXPERIENCIA DE USUARIO
    NEGOCIO
    Entender qué problema tienen,
    qué es lo que esperan resolver y
    cuáles son sus objetivos.
    USUARIO
    Quiénes son, sus necesidades y
    su contexto.
    MERCADO
    Quién es mi competencia, qué
    está haciendo y cómo voy a ser
    mejor que ella.

    View full-size slide

  8. “Todo con lo que interactuamos diariamente nos está
    generando emociones y experiencias”

    View full-size slide

  9. ANTES DURANTE DESPUÉS
    LÍNEA DE TIEMPO AL INTERACTUAR CON UN
    PRODUCTO/SERVICIO DIGITAL
    ● Conocer el problema, usuarios
    y mercado
    ● SEO
    ● Estrategia de contenidos
    ● Pauta publicitaria
    ● Visión estratégica
    ● Wireframes
    ● Arquitectura de información
    ● Prototipado
    ● Flujos de usuario
    ● Diseño de la interfaz
    ● Pruebas con usuario
    ● Desarrollo back y front
    ● Medición de KPI
    ● Mejoras en la interfaz
    ● Soporte en línea
    ● Desarrollo de nuevas
    funcionalidades.

    View full-size slide

  10. Don Norman:
    El término UX

    View full-size slide

  11. Qué son, para qué las utilizamos y tipos de
    pruebas
    02.
    PRUEBAS
    CON
    USUARIOS

    View full-size slide

  12. ¿Qué son las pruebas
    con usuarios?
    Es una herramienta de investigación que
    permite entender, medir y validar una
    interacción de un usuario con un sistema

    View full-size slide

  13. TIPOS DE
    PRUEBAS DE
    USUARIO

    View full-size slide

  14. TREE TEST
    Validar etiquetado de sitemaps de sitios web o apps sin
    las distracciones de todos los elementos visuales
    ¿PARA QUÉ SIRVE?
    Ejemplo

    View full-size slide

  15. CARD SORTING
    Entender los modelos mentales de las personas al
    agrupar información de forma lógica.
    ¿PARA QUÉ SIRVE?
    Ejemplo

    View full-size slide

  16. FIVE SECOND TEST
    Se usa para determinar cuál es la información que el
    usuario logra retener al mirar por unos segundos una
    interfaz y optimizar así la claridad del diseño.
    ¿PARA QUÉ SIRVE?
    Ejemplo
    5 seg

    View full-size slide

  17. PRUEBAS DE USABILIDAD
    Se utiliza para evaluar la facilidad con la que un usuario
    puede realizar una tarea bajo un contexto específico.
    ¿PARA QUÉ SIRVE?
    Ejemplo

    View full-size slide

  18. PASOS PARA PREPARAR UNA
    PRUEBA CON USUARIOS
    Las hipótesis nacen de un problema identificado y
    surgen como posible solución al mismo.
    Deben ser:
    ● Específicas
    ● Concretas
    ● Medibles
    1. DEFINICIÓN DE HIPÓTESIS

    View full-size slide

  19. PASOS PARA PREPARAR UNA
    PRUEBA CON USUARIOS
    Nos ayudan a realizar recomendaciones o toma de
    decisiones basadas en datos, aportando objetividad a
    las conversaciones.
    Las métricas pueden ser objetivas (tiempo, cantidad
    de clics, número de errores, tasa de éxito) o subjetivas
    (respuesta al estrés, encuestas de satisfacción,
    métricas emocionales)
    2. DEFINICIÓN DE MÉTRICAS

    View full-size slide

  20. PASOS PARA PREPARAR UNA
    PRUEBA CON USUARIOS
    En este paso debemos seleccionar y filtrar a las
    personas que van a participar del test, garantizando
    que encajen correctamente en el perfil con el que
    debemos validar..
    3. RECLUTAMIENTO

    View full-size slide

  21. PASOS PARA PREPARAR UNA
    PRUEBA CON USUARIOS
    El guión es la herramienta interna donde
    recopilaremos toda la informaciòn que utilizaremos
    durante la ejecución de la prueba.
    Un buen guión está compuesto por:
    ● Información del test
    ○ Tipo de usuarios
    ○ URL del prototipo (si se tiene)
    ○ Hipótesis a validar
    ● Presentación y apertura del test
    ● Tareas y escenarios asociados a las hipótesis
    4. CREACIÓN DEL GUIÓN
    Ejemplo

    View full-size slide

  22. PASOS PARA PREPARAR UNA
    PRUEBA CON USUARIOS
    En este último paso, debemos ultimar detalles para la
    correcta ejecución de la prueba:
    ● Configuración de la herramienta a utilizar
    durante el test.
    ● Definición del espacio físico para realizar la
    prueba.
    ● Citación de los usuarios.
    5. PREPARACIÓN PARA LA PRUEBA

    View full-size slide

  23. Crearemos nuestra propia prueba para validar con
    usuarios
    03.
    Taller
    práctico

    View full-size slide

  24. CREEMOS NUESTRA
    PRUEBA CON USUARIOS
    En grupos, trabajarán el proyecto propuesto para
    crear la prueba. Por motivos de tiempo, éste ya
    tiene varios puntos adelantados.
    Revisaremos los 5 pasos para preparar un test
    con usuarios.
    Ejecutaremos el test con un usuario de otro
    equipo

    View full-size slide

  25. PASOS PARA PREPARAR UNA
    PRUEBA CON USUARIOS
    1. DEFINICIÓN DE HIPÓTESIS
    2. DEFINICIÓN DE MÉTRICAS
    3. RECLUTAMIENTO
    4. CREACIÓN DEL GUIÓN
    5. PREPARACIÓN PARA LA PRUEBA
    Ejemplo Guion:
    http://bit.ly/ejemplo-guion
    Plantilla:
    http://bit.ly/plantilla-guion
    Enlace pantallas para prototipo:
    http://bit.ly/pantallas-prototipo

    View full-size slide

  26. 04.Conclusiones

    View full-size slide

  27. ¡GRACIAS!
    ¿Alguna pregunta?
    @emergugue

    View full-size slide

  28. CREDITS
    La creación de esta presentación fue posible gracias a:
    ◂ Template de la presentación: Slidesgo
    ◂ Iconoes by Flaticon
    ◂ Imágenes e infográficos by Freepik

    View full-size slide