Por qué este nombre
«Dedícalo Play» no es casual — cada palabra tiene peso.
El naming fue el primer reto estratégico. Necesitaba un nombre que cargara significado por sí solo antes de que el usuario abriera la app.
- Dedícalo — mantiene el equity de marca del ecosistema musical existente. Los usuarios que conocen Dedícalo.es entienden de inmediato el universo. No partimos de cero.
- Play — doble significado intencionado: play como reproducir música y play como jugar. Una sola palabra activa los dos pilares del producto.
- play.dedicalo.es — el subdominio refuerza la jerarquía de marca. Es un hijo del ecosistema, mejora el SEO de dominio raíz y genera coherencia total.
Identidad visual
Una paleta que comunica fiesta, música y competición.
Cada color tiene una función semántica. El sistema debe funcionar en entornos oscuros — discotecas, fiestas, reuniones nocturnas — donde se usa el producto.
Negro como fondo dominante
Refleja el entorno nocturno de uso. Maximiza el contraste y reduce la fatiga ocular en partidas largas. Referencia directa al vinilo.
ContextoNaranja + Rojo = acción
Naranja activa urgencia sin agresividad. Rojo señala acciones críticas: puntos, tiempo límite, eliminación. La combinación evoca energía musical y calor de fiesta.
UX emocionalVerde Spotify = confianza
Reutilizo el verde de Spotify de forma deliberada. Cuando el usuario lo ve, asocia música real, streaming y legitimidad de marca.
AsociaciónAnálisis y proceso UX
Primero entendí el espacio. Luego diseñé la solución.
El proceso arrancó con benchmark honesto: ¿qué juegos musicales existen, qué los hace adictivos y qué fricción generan? Solo después tomé decisiones de diseño.
Benchmark competitivo
Analicé Kahoot, SongPop, Heardle y Quiz Spotify. Todos hacen que el usuario adivine canciones ajenas. Nadie usaba la música propia como mecánica central.
ResearchInsight clave
La emoción más fuerte no es adivinar canciones genéricas — es que tu grupo demuestre quién tiene mejor cultura musical. El sabotaje multiplica esa tensión. Ahí estaba la oportunidad.
InsightJourney map
Mapeé el flujo completo. Encontré 3 puntos de fricción críticos: crear sala, unirse sin cuenta y entender las reglas en menos de 10 segundos.
UX ResearchPrincipio de diseño
Cero fricción en los primeros 30 segundos. Unirse a una partida activa solo requiere un código PIN de 6 dígitos. Sin registro obligatorio en la entrada.
Decisión UXMobile-first estricto
El 100% de las partidas se juegan desde el móvil en entornos ruidosos. Cada elemento debía ser funcional con el pulgar y visible con música de fondo.
ContextoTesting con usuarios reales
Tres sesiones de prueba con grupos reales. Hallazgo clave: nadie leía instrucciones. Redesigné el flujo para que las reglas se enseñaran jugando, no explicando.
TestingMecánicas de juego
Adivina. Sabotea. Gana llegando primero a la meta.
Restricción de diseño clara: cualquier persona debe entender cómo funciona antes de que empiece la primera canción. La interfaz es el tutorial.
- Paso 1 — Crear sala: el anfitrión se autentifica con Google, conecta su Spotify Premium y elige una de las 12 playlists integradas. La app genera un PIN de 6 dígitos que comparte con sus amigos.
- Paso 2 — Escuchar y adivinar: la música suena en el altavoz o bluetooth del anfitrión. Todos los jugadores — incluido el anfitrión — responden en sus móviles: artista, año o época.
- Paso 3 — Sabotear y escalar: acumula puntos (+5 por acierto), activa sabotajes contra el líder y escala posiciones. Gana quien llegue primero a la meta.
Pulse
¿Quién canta? Adivina el artista antes de que acabe el tiempo.
Timeline
Coloca la canción en la línea del tiempo según su año de lanzamiento.
Chaos
Preguntas meta sobre el juego mismo. El caos es parte de la estrategia.
Integración Spotify
El anfitrión ES el altavoz. Los invitados solo necesitan el PIN.
Solo el anfitrión conecta su cuenta de Spotify Premium. Su móvil — conectado al altavoz o bluetooth — reproduce la música para toda la sala. Los demás jugadores responden las preguntas en sus propios dispositivos sin necesitar Spotify.
Anfitrión = reproductor de la sala
El anfitrión inicia sesión con Google, conecta su Spotify Premium y se convierte en el DJ del grupo. Su dispositivo activa el Spotify Web Playback SDK — la música sale por su altavoz bluetooth o los altavoces de la habitación.
Host como speakerInvitados — solo el PIN, nada más
Los invitados entran con el código PIN de 6 dígitos. Sin cuenta, sin Spotify, sin instalación. Ven las preguntas en su móvil y responden mientras la música suena en la sala.
Cero fricciónOAuth PKCE — sin exponer secretos
La autenticación con Spotify usa el flujo PKCE. Sin client_secret en el cliente — solo el anfitrión autoriza una vez y el token se renueva automáticamente.
Las 12 playlists integradas en la app
El anfitrión elige una de estas playlists antes de crear la sala. No hay biblioteca personal — el catálogo es fijo, curado y sin sorpresas.
Flujo de reproducción
Catálogo de canciones
Scripts propios para importar canciones reales de Spotify.
El catálogo no usa una base de datos externa ni CMS manual. Un pipeline de scripts Node.js extrae las canciones de playlists públicas de Spotify y las guarda en un JSON local que la app consume directamente.
- extract-spotify-catalog.mjs: llama a la Spotify Web API, itera los tracks de cada playlist curada y extrae título, artista, año, portada y URI reproducible.
- import-scraped-playlists.mjs: procesa el output del script anterior y genera el archivo
dedicalo-song-catalog.full.clean.jsonque se sirve como asset estático. - Sin backend en runtime: el catálogo es un JSON estático servido desde Vercel. Cero coste de base de datos, cero latencia de lectura en partida.
- Evita repeticiones: el sistema registra qué canciones se han escuchado en cada sesión y no repite artistas ni tracks en la misma partida.
Pipeline de importación
Anti-repetición por sesión
sessionStorage registra qué tracks y artistas se han reproducido. Si se agotan, el pool se resetea limpiamente y la partida siempre tiene canciones frescas.
UX de juegoStack técnico
Herramientas elegidas con criterio, no por moda.
Cada herramienta tiene una justificación de negocio. No usé nada por tendencia: usé lo que resolvía el problema con el menor tiempo de implementación y el mayor impacto.
Decisiones técnicas clave
Cada decisión tiene una justificación de producto.
No elegí cada tecnología por tendencia. Cada pieza del stack resuelve un problema real con el menor tiempo de implementación y el mayor impacto en la experiencia de juego.
RT DB sobre Firestore
Firebase Realtime Database en lugar de Firestore para el estado de sala. En juego multijugador el latency importa más que las queries — RT DB gana aquí.
PIN sin registro
Los invitados entran con un código de 6 dígitos. No hay formulario de registro. Reducir la fricción de entrada fue la decisión de UX más impactante del proyecto.
Catálogo como JSON estático
Las canciones se pre-importan y se sirven como un archivo JSON desde Vercel. Cero coste de base de datos en runtime, carga instantánea en partida.
PKCE sin client_secret
La integración con Spotify usa OAuth PKCE — sin secreto de cliente expuesto. El anfitrión conecta su Premium una vez; el token se renueva automáticamente en sesión.
Mi rol en el proyecto
Diseñé, construí y lancé el producto de forma independiente.
UX/UI Design
Investigación, wireframes, sistema de diseño, componentes interactivos y prototipo funcional. Figma como herramienta principal.
Arquitectura técnica
Definición del stack, diseño de Firestore, flujos de datos, endpoints de API y estrategia de despliegue en Vercel.
Integraciones y APIs
Spotify Web Playback SDK (PKCE), Firebase RT DB, Google Sign-In, scripts de importación de catálogo y Suno para audio generativo.
Lanzamiento y branding
Naming, identidad visual, materiales de comunicación, dominio play.dedicalo.es y estrategia de difusión inicial.
¿Listo para jugar?
Dedícalo Play está en producción en play.dedicalo.es. Crea una sala, invita a tus amigos y demuestra quién tiene mejor cultura musical.