Marisol Escorza

High-Fidelity prototyping

Facilitando encuentros creativos – App para reservar espacios en Spotify

Alcance

Diseño de interacción
Sistema visual
Escenarios de flujo
Prototipado
Testeo con usuarios

En Spotify, la música conecta personas. Pero ¿qué hay de las reuniones que hacen posible esa magia tras bambalinas?
Este proyecto nació con una idea clara: mejorar la forma en que los equipos de Spotify encuentran, reservan y usan sus espacios de trabajo colaborativo.
Más que una app, es una extensión del ecosistema colaborativo de Spotify. Una experiencia fluida, funcional y coherente con la identidad de una de las marcas más influyentes del mundo.

¿Cómo puede una app permitir encuentros creativos en el momento justo, el lugar adecuado y con los recursos necesarios para potenciar la cultura colaborativa?

El desafío era técnico, pero también humano: diseñar una interfaz que no interrumpa el flujo de trabajo, sino que lo potencie.

Proceso de diseño

Microprototipado inicial: entender la interfaz desde dentro

El proyecto comenzó replicando un flujo mínimo de la pantalla de reproducción de Spotify. Este ejercicio me permitió interiorizar principios clave como jerarquía visual, retroalimentación inmediata y uso de microinteracciones. 

 Audio © 2024 Courtney Barnett. Contains a sample of "Start Somewhere." All rights reserved.

ESCENARIO 1

Un usuario busca una sala de reuniones para un momento futuro, con unos requisitos concretos de capacidad y características: proyector, pizarra, karaoke, canción de bienvenida, iluminación, etc

ESCENARIO 2

El usuario encuentra una sala y la reserva, indicando el número y nombre de asistentes, y confirmando las características que necesita.

ESCENARIO 3

A la hora de la reunión, el usuario es capaz de confirmar que está usando la sala, o cancelarla para liberarla, indicando quién está presente.

Antes de proyectar los tres escenario, con un flujo más complejo y con un nivel de fidelidad realista en base al lenguaje de Spotify, elijo iniciar la tarea trabajando a baja fidelidad ya que me permitirá explorar e identificar de forma ágil diferentes caminos, conectar mejor con un enfoque en la experiencia del usuario, y la posibilidad de detectar errores sin invertir tiempo y recursos en el desarrollo completo del producto.

Replicar para sistematizar: una aproximación técnica al lenguaje visual de Spotify

Diseñé un UI Kit interactivo basado en los estilos y componentes fundamentales de Spotify: tipografía, color, espaciado y patrones de interacción.
Aplicar los principios del diseño atómico me permitió descomponer la interfaz en unidades funcionales y comprender cómo la marca construye coherencia visual. Desde esa base, desarrollé componentes reutilizables y escalables, alineados con el producto y listos para adaptarse a nuevos flujos de diseño.

Diseñar el flujo completo

Con el sistema ya consolidado, construí un prototipo interactivo de alta fidelidad basado en tres escenarios clave: búsqueda, reserva y gestión en tiempo real de salas de reuniones.

Mejoras incorporadas tras la evaluación con usuarios (Método Thinking Aloud)

High-Fidelity prototyping

El desarrollo de este prototipo ha permitido construir una solución coherente con el ecosistema interno de Spotify, poniendo en valor principios de usabilidad, claridad y personalización. Cada escenario ha sido diseñado considerando la continuidad del flujo y la lógica de uso real, minimizando fricciones y apoyando al usuario en todas las fases del proceso. Este caso no solo representa un ejercicio funcional de diseño, sino también un ejemplo de cómo el prototipado puede servir como herramienta para alinear visión de producto, necesidades de usuario y capacidades técnicas. El resultado es un sistema pensado para crecer con los equipos y sus dinámicas colaborativas.

Evaluación con usuarios

Diseñar también es escuchar

Evaluación de tres tareas claves, asociadas a los escenarios definidos.

Objetivo: 

Técnica:

Usuarios:

Detectar fricciones reales en los flujos de búsqueda, reserva y confirmación de una sala de reuniones.

Pensamiento manifiesto (Thinking aloud)

5 participantes usuarios de la app Spotify.

HALLAZGOS

Durante las sesiones de prueba con usuarios, la fricción más significativa fue la falta de confirmación tras ejecutar ciertas acciones clave. Al completar tareas como seleccionar asistentes o establecer una franja horaria, los participantes no recibían señales claras que validaran sus decisiones. Esta ausencia de feedback generaba incertidumbre sobre si la acción había sido procesada correctamente, especialmente al volver a pantallas anteriores. Otro punto crítico fue la ambigüedad sobre cuándo y dónde configurar la hora de la reunión, lo que evidenció la necesidad de una estructura más intuitiva y flexible. Además, el flujo presentaba pasos redundantes que ralentizaban la experiencia y debilitaban la eficiencia del proceso.

SOLUCIÓN

Ante estos hallazgos, las iteraciones aplicadas se centraron en reforzar la comunicación entre sistema y usuario. Se incorporaron botones de confirmación en los puntos donde el usuario realiza una selección relevante, así como descripciones contextuales que informan del estado actual de la acción (por ejemplo, un ícono o mensaje tras confirmar una sala o un horario). También se simplificó el flujo eliminando pasos innecesarios y se rediseñó el calendario, clarificando visualmente los espacios disponibles y ocupados mediante un sistema de codificación más intuitivo. (Soluciones implementadas en "Diseñar el flujo completo")

REFLEXIÓN

Esta experiencia subraya un aprendizaje clave: diseñar con familiaridad no reemplaza diseñar con claridad. Confiar en patrones reconocibles no garantiza que el usuario entienda qué hacer (brecha de ejecución) o si lo ha hecho bien (brecha de evaluación), según el modelo de Donald Norman.

Asumir que un usuario entiende cómo “debería funcionar” una interfaz, especialmente si se basa en una plataforma conocida como Spotify, es caer en un sesgo. El diseño debe adaptarse a una diversidad de modelos mentales, validando constantemente cada interacción y asegurando que el sistema hable el mismo idioma que el usuario. Incorporar confirmaciones, feedback visual y caminos claros no es solo una buena práctica: es una muestra de consideración hacia quien usa el producto.