Research UX / UI

Creación de la sección seguimiento

Empresa: Kiddo Climbs

Tiempo: 3 Sprint

2023

Herramienta

Documentación

- Benchmark
- Documentación de negocio
- Design system

Testing

- Encuesta
- Entrevista
- Test heurístico

Requerimiento

El área de negocio requiere realizar un módulo llamado “Seguimiento” el cual permitirá a los usuarios profesores crear casos de seguimiento a los alumnos, estos casos pueden tener múltiples razones, desde problemas con otros compañeros, conductas anormales, hasta posibles agresiones físicas que presente el alumno.

El equipo de negocios me entrega una serie de campos que debe contener este módulo, pero se requiere que a nivel UX/UI que se evalúen para así validarlos y asegurar que son los necesarios.

MVP

Para este primer MPV, se requiere que la herramienta cumplas con las siguientes funciones.

Sprint 1

Investigación y análisis

En esta fase, realizamos un benchmark para analizar plataformas similares y entender las mejores prácticas y tendencias en el diseño de módulos de seguimiento, esto nos proporciona una base sólida para identificar oportunidades de mejora y diferenciar nuestro producto.

Paralelamente, involucramos a los usuarios finales, en este caso, los profesores, para comprender sus necesidades y expectativas. A través de entrevistas y encuestas, recolectamos datos valiosos que nos permiten validar y ajustar los campos definidos por el negocio, asegurando que el diseño final sea altamente funcional y centrado en el usuario.

Benchmark

Identificar las mejores prácticas y características clave en sistemas de seguimiento de alumnos o similares para diseñar una solución eficiente y efectiva para los profesores.

Metodología

  1. Selección de Herramientas:
    • Se analizaron tres herramientas principales de seguimiento de alumnos: Gradelink SIS, Classe365, y iGradePlus.
  2. Criterios de Evaluación:
    • Facilidad de uso.
    • Funcionalidades específicas para el seguimiento de casos.
    • Interfaz de usuario y experiencia de usuario.
    • Accesibilidad y compatibilidad con dispositivos móviles.
Herramienta Fortalezas Debilidades
Gradelink SIS Interfaz intuitiva, integración con sistemas de gestión escolar, y notificaciones automáticas. Falta de personalización en los formularios de seguimiento y limitaciones en reportes visuales.
Classe365 Alta personalización de casos, opciones avanzadas de reporte y análisis, y soporte para múltiples idiomas. Curva de aprendizaje elevada y diseño visual menos atractivo.
iGradePlus Diseño moderno y atractivo, excelente accesibilidad móvil, y fácil integración con otras herramientas. Funcionalidades básicas en la gestión de casos y soporte limitado para personalización.

Entrevistas

Resultados

La investigación ha proporcionado una visión clara de las mejores prácticas y funcionalidades necesarias para desarrollar un módulo de seguimiento efectivo y eficiente. Implementar una interfaz intuitiva, accesibilidad web y móvil, herramientas de comunicación, seguridad de datos y capacidades de documentación avanzada.

Las entrevistas con los profesores han confirmado la importancia de una interfaz intuitiva y fácil de usar, accesibilidad móvil, comunicación eficiente, seguridad de datos y la capacidad de generar reportes personalizados. Estos hallazgos están alineados con los resultados del benchmark y refuerzan la necesidad de implementar estas características en el diseño final del módulo de seguimiento.

Características a seguir

Interfaz intuitiva, fácil de usar:

la investigación de Gradelink SIS y iGradePlus destacan por su interfaz intuitiva y fácil de usar, lo que facilita la navegación y la eficiencia en la gestión de casos.

 

Implementación: Nuestro diseño debe priorizar la simplicidad y claridad en la interfaz, asegurando que los profesores puedan crear y gestionar casos sin complicaciones.

Accesibilidad y compatibilidad con móviles:

Tanto Gradelink SIS como Classe365 ofrecen soporte para dispositivos móviles, lo que permite a los usuarios acceder a la plataforma desde cualquier lugar y en cualquier momento.

 

Implementación: Es crucial que nuestro módulo sea completamente responsivo y optimizado para dispositivos móviles, garantizando accesibilidad constante para los profesores.

Comunicación eficiente:
Gradelink SIS proporciona herramientas para la comunicación entre profesores y padres, mejorando la colaboración y el seguimiento de los casos.


Implementación: Integraremos funcionalidades de comunicación, como el envío de correos electrónicos y mensajes directos desde la plataforma, para mantener a todas las partes involucradas informadas y coordinadas.

Seguridad y privacidad de los datos:
Classe365 asegura una plataforma segura para la gestión de datos, lo cual es vital para manejar información sensible sobre los alumnos.


Implementación: Nuestro diseño debe incorporar robustas medidas de seguridad para proteger los datos de los alumnos y cumplir con las regulaciones de privacidad, sobre todo en el tema de permisos y niveles de usuario.

Reportes detallados y documentación continua:
iGradePlus permite la generación de informes personalizados, lo que ayuda a los profesores a seguir y documentar los casos de manera eficiente.


Implementación: El módulo debe incluir capacidades avanzadas para la creación de reportes detallados y personalizados, facilitando el seguimiento y análisis de los casos de seguimiento, integrando la capacidad de agregar imágenes y documento para complementar los casos.

Sprint 2

Wireframe y prototipos iniciales

En esta fase, utilizamos los datos recolectados y los insights obtenidos durante la investigación para crear wireframes de baja, media y alta fidelidad. Estos wireframes permiten visualizar la estructura del módulo de seguimiento y asegurar que los elementos clave estén bien organizados.

A partir de estos, desarrollamos prototipos iniciales que reflejan los requisitos y expectativas de los usuarios. Estos prototipos son iterados rápidamente, permitiendo plasmar y ajustar las ideas de diseño basadas en el feedback continuo de los profesores y stakeholders, garantizando así un diseño funcional y centrado en el usuario.

Propuesta de bocetos

Junto al equipo de negocio y desarrollo, se realizaron a mano alzada una serie de bocetos o wireframe de baja para comenzar en diseño base sé la sección de seguimiento que se va a desarrollar, también en este punto el equipo de desarrollo pudo identificar los servicios que deben construir, y los diferentes aspectos técnicos que van a considerar tanto para el backend como para el frontend.

User Flow

Wireframe media

Propuesta de diseño

Tomando en cuenta la investigación preca, y los bocetos antes dibujados y siguiendo los lineamientos de diseño del Design System, realizo los primeros wireframe que usaremos para visualizar de manera eficiente el flujo de la herramienta de seguimiento.

Con estos wireframe, vamos a explorar los diferentes campos, formas de cargar el contenido y de como se visualizara cada caso y el seguimiento de los mismos para los profesores o usuarios que use la herramienta.

Resultado

Luego de explorar con más detalle cada paso, cada campo del flujo de una forma más concreta, diseño el primer flujo en alta fidelidad que vamos a usar para las pruebas con usuarios.

Siguiendo el Design System previamente desarrollado para asegurar consistencia y coherencia visual en todas las pantallas, se crean los wireframe de alta fidelidad, resultado del proceso de estudio exhaustivo que nos han permitido refinar y mejorar la experiencia del usuario.

Estos diseños finales incorporan todos los insights y feedback obtenidos, ofreciendo una interfaz optimizada y centrada en las necesidades del cliente, lista para ser implementada por el equipo de desarrollo.

Sprint 3

Pruebas de usuario, ajustes y entrega

Las pruebas de usabilidad se realizan con la participación de product owners, el equipo de desarrollo, diseño y clientes “friend and family”. Estas pruebas permiten detectar patrones efectivos sobre el uso de la herramienta.

Utilizamos métodos como encuestas, entrevistas y test heurístico para obtener feedback detallado. Esta fase es crucial para identificar y solucionar problemas de usabilidad, asegurando que el diseño final sea intuitivo y eficiente para los usuarios finales.

Entrevistas

Encuestas

Se envió un correo con el flujo y una encuesta NPS a 26 personas del equipo de trabajo que estuvieron relacionados con el levantamiento y definición de los detalles del módulo, para que revisaran, evaluaran y luego ponderaran del 1 al 10 con la siguiente pregunta.
 
Pregunta: ¿Luego de navegar el flujo de seguimiento, y conociendo la investigación antes realizada, consideras que el módulo se ajusta a lo solicitado?

Test Heurístico

Para evaluar si el módulo de seguimiento cumple con los 10 puntos del test heurístico de Jakob Nielsen, se revisó el flujo desarrollado a una IA y aplicaremos cada uno de los principios:
Feature list
1er Revisión
2da Revisión
  • Visibilidad del estado del sistema

    Cumple: El sistema muestra claramente el estado de los casos, con indicaciones de progreso, comentarios, y estatus abiertos o cerrados.

  • Concordancia entre el sistema y el mundo real:

    Cumple: Utiliza terminología y flujo que los usuarios, en este caso, los profesores, encontrarán familiar y comprensible, como “Agregar observación”, “Cerrar seguimiento”, etc.

  • Control y libertad del usuario

    Cumple: Los usuarios pueden navegar fácilmente y regresar a pantallas anteriores con botones de “Volver” y “Cerrar seguimiento”, proporcionando control sobre sus acciones.

  • Consistencia y estándares

    Cumple: Los botones, menús y la disposición de la información son consistentes en todas las pantallas, lo que facilita su uso y aprendizaje.

  • Prevención de errores

    Cumple parcialmente: Aunque no se observan mensajes de error específicos, el diseño parece estar enfocado en evitar errores con selecciones y campos obligatorios.

  • Reconocimiento antes que recordación

    Cumple: Los elementos son fácilmente reconocibles con iconos y etiquetas claras, minimizando la necesidad de recordar información de una pantalla a otra.

  • Flexibilidad y eficiencia de uso

    Cumple: El sistema permite agregar observaciones, adjuntar archivos y cerrar casos de manera eficiente, cubriendo las necesidades de usuarios principiantes y avanzados.

  • Estética y diseño minimalista

    Cumple: El diseño es limpio y minimalista, mostrando solo la información relevante sin sobrecargar al usuario.

  • Ayudar a reconocer, diagnosticar y recuperarse de los errores

    No Cumple: No se observan claramente mensajes de error ni ayudas contextuales, lo cual podría ser un área de mejora.

  • Ayuda y documentación

    No cumple: No se observa documentación o ayuda integrada en las pantallas mostradas. Sería útil contar con una sección de ayuda o tooltips que guíen al usuario.

Resultado entrevista

Estas entrevistas muestran que los profesores encuentran el diseño final del módulo de seguimiento alineado con sus necesidades y fácil de usar, lo cual es crucial para su adopción y efectividad en un entorno educativo.

Resultado encuesta

La encuesta muestra que el 70% de los participantes considera que el módulo de seguimiento cumple adecuadamente con lo solicitado (calificaciones 9 y 10). Esto indica una aceptación general positiva, aunque hay espacio para mejoras según el feedback de los participantes que dieron calificaciones más bajas. Estos resultados sugieren que, si bien el diseño es bien recibido, se podrían considerar algunos ajustes adicionales para satisfacer plenamente a todos los usuarios.

Resultado test heurístico

En general, el diseño del módulo de seguimiento cumple con la mayoría de los principios heurísticos, especialmente en términos de visibilidad del estado del sistema, consistencia, y estética minimalista. Sin embargo, hay áreas que podrían mejorarse, como la prevención de errores y la inclusión de ayuda y documentación para los usuarios.

Cierre

Entrega del Proyecto

Tras realizar una exhaustiva investigación y validación con los usuarios finales, el flujo de seguimiento obtuvo una aceptación y aprobación del 80% según los resultados de las pruebas realizadas.

Basándonos en estos resultados positivos, el negocio ha solicitado iniciar el desarrollo utilizando las pantallas ya diseñadas. Se ha decidido que cualquier mejora adicional se llevará a cabo durante la fase de pruebas con el equipo de desarrollo, debido a los tiempos ajustados que requieren comenzar el desarrollo de inmediato.

Además, nos han felicitado al por haber alcanzado la meta dentro del plazo estipulado. La dedicación y el esfuerzo invertidos en el proyecto han sido fundamentales para lograr esta aprobación tan elevada. Esta validación refuerza la confianza en que el diseño propuesto se alinea con las necesidades y expectativas de los usuarios finales, permitiendo que el desarrollo avance con una base sólida.