R4 | Prototipado y evaluación de la usabilidad y caso de estudio
Prototipo de alta fidelidad y flujos de interacción.
Validación e iteración-> Headspace (B2B)
Este proyecto parte del reto de diseñar y validar un prototipo funcional que permita a profesionales y organizaciones crear y gestionar contenidos dentro de un nuevo entorno B2B. A lo largo del proceso se ha trabajado tanto el planteamiento de los flujos como su validación mediante test de usabilidad, iterando sobre el prototipo para mejorar su claridad y coherencia.
Desde el inicio se propusieron cuatro flujos de interacción distintos para completar las tareas, con el objetivo de ofrecer alternativas y facilitar la experiencia a los participantes. Sin embargo todas las personas que participaron en el test siguieron el recorrido inicial de Crear cuenta y primeros pasos para completar las tareas. Esto indica que las primeras acciones dentro de la plataforma están bien guiadas y que los usuarios no sienten la necesidad de abandonar el flujo principal para buscar atajos o acciones complementarias.
A partir de la entrega del reto 2, los flujos y acciones se rehicieron para reducir la carga cognitiva, introduciendo pasos intermedios y aplicando el principio de progressive disclosure. Este ajuste se aprecia especialmente en la fase de Primeros pasos, donde el sistema acompaña al usuario de forma más gradual. En las imágenes del prototipo se puede observar cómo esta secuenciación ayuda a comprender mejor qué se espera del usuario en cada momento.
La construcción del prototipo permite una navegación fluida y bidireccional, haciendo posible volver atrás, corregir acciones y recorrer las pantallas sin bloqueos. El uso de los componentes y la jerarquía visual responden a criterios funcionales claros, lo que facilita la comprensión general del sistema incluso sin instrucciones previas.
Uno de los aspectos más complejos del proyecto ha sido adaptar el sistema visual de Headspace a un nuevo contexto. Respetar los principios de la marca y su manera de plantear los componentes ha requerido una selección cuidadosa, ya que el sistema ofrece múltiples alternativas. Se han escogido aquellas que mejor se adecuaban a cada situación, como el uso del switch button para cambiar el estado de las publicaciones o el radio button para la selección de categorías, siguiendo patrones ya presentes en la app, por ejemplo en la elección de idioma.
La replicación de animaciones y transiciones también ha supuesto una dificultad añadida, ya que la app combina distintos tipos de movimiento según el componente: transiciones lineales, cambios de opacidad o combinaciones de ambos. En el prototipo se ha buscado un equilibrio entre fidelidad visual y funcionalidad, priorizando siempre la comprensión del flujo.
Para evitar conflictos durante la simulación, el prototipo se ha iterado siempre sobre los mismos componentes, sin generar duplicados innecesarios. Esto ha llevado a concentrar el trabajo en una única página llamada Prototipo iterado, lo que ha permitido mantener un sistema más limpio y facilitar las actualizaciones. Gracias a esta decisión, las mejoras detectadas durante el test pudieron aplicarse de forma más ágil.
El test de usabilidad ha aportado datos significativos para detectar oportunidades de mejora. Algunas decisiones que desde el punto de vista del diseñador parecían evidentes no lo fueron tanto para los usuarios, lo que permitió resolver dudas previas, como la apariencia y funcionamiento del selector de carpetas.
Durante esta fase surgieron también inconvenientes técnicos derivados del uso del prototipo en smartphones, como la visualización incompleta de la interfaz o la aparición del mensaje “Missing font”. Este último tuvo un impacto notable en el diseño, ya que provocó que el componente de edición de la descripción del recurso se viera desproporcionado respecto al resto, al aumentar el tamaño del texto más del doble de lo asignado. Una vez identificado el problema, los ajustes pudieron realizarse con rapidez gracias a la correcta vinculación de los componentes.
Durante la preparación del video presentación se pudieron detectar pequeños ajustes en las interacciones y mejorar la coherencia del recorrido mostrado. Destacar en este punto la imposibilidad de realizar la presentación en los 3 min indicados planteando los objetivos, hallazgos, etc… que se piden en la rúbrica de evaluación. Un aspecto que no se aborda en la presentación es la opción de completar el perfil desde el apartado de configuración si el usuario no la había añadido previamente por el mismo motivo, priorizando explicar de dónde venían los cambios antes que mostrar todas las vías para desarrollar esta acción, que se mostró completada por todos los participantes desde ese flujo de primeros pasos.
A nivel personal, este proyecto ha servido para reflexionar sobre la importancia de no dar por supuestas ciertas decisiones de diseño y de validar siempre con usuarios reales. Las dificultades encontradas, tanto a nivel de sistema visual como técnico, han supuesto un aprendizaje relevante y han permitido sentar una base más sólida para futuribles fases del diseño de producto.
Link a la Presentación en video
Este es un espacio de trabajo personal de un/a estudiante de la Universitat Oberta de Catalunya. Cualquier contenido publicado en este espacio es responsabilidad de su autor/a.
Debatecontribution 0en R4 | Prototipado y evaluación de la usabilidad y caso de estudio