Todos los proyectos
Music SaaS · Plataforma Web Full-Stack·2026

Smart Setlist AI

Una plataforma full-stack diseñada para ayudar a músicos a crear, organizar y optimizar setlists para shows en vivo, ensayos y sesiones creativas.

Abrir proyecto en vivo
ReactNext.js (App Router)TypeScriptTailwind CSSTanStack QueryZodNode.js

Resumen

Smart Setlist AI se creó para resolver un problema común entre músicos: construir setlists manualmente sin considerar fluidez, diversidad y contexto de performance. La plataforma combina filtrado, recomendaciones contextuales y gestión personalizable de acordes en un único flujo inteligente.

Contexto

El proyecto fue desarrollado para simular un producto de setlists con estándar productivo orientado a músicos y bandas. El objetivo fue validar una arquitectura escalable en la que los usuarios puedan generar setlists por género y artista, gestionar múltiples listas y adaptar canciones dinámicamente según ensayo o presentación.

Problema

Construir una aplicación full-stack confiable que unifique generación, curación, recomendación y exportación de setlists, manteniendo una UX consistente y una arquitectura extensible para futuras funcionalidades como stage mode y colaboración en tiempo real.

Responsabilidades

  • Arquitectura e implementación de frontend modular con Next.js App Router, TypeScript y Tailwind CSS
  • Construcción de flujos de gestión de setlists con operaciones de agregar, quitar, reordenar y reemplazar canciones
  • Implementación de filtrado y recomendaciones contextuales por género, artista y preferencias de usuario
  • Desarrollo de personalización de acordes con overrides de usuario para adaptar arreglos por contexto musical
  • Integración de flujos de exportación para uso real, incluyendo PDF y opciones de compartición
  • Diseño de componentes y pantallas reutilizables para sostener consistencia a medida que crece el producto

Decisiones técnicas

Límites modulares por feature en App Router

La separación por módulos permitió aislar generación de setlists, operaciones de canciones y exportación, reduciendo acoplamiento y habilitando iteración rápida con menor riesgo de regresión.

Orquestación de datos con TanStack Query

TanStack Query se utilizó para sincronización asíncrona y manejo de caché entre setlists y operaciones de canciones, mejorando respuesta y reduciendo solicitudes redundantes.

Validación de contratos con Zod

Schemas Zod se aplicaron en payloads críticos para mantener contratos de datos consistentes entre UI y backend conforme evolucionaban recomendaciones y personalizaciones.

Arquitectura

Arquitectura full-stack con separación modular entre frontend y backend, flujo de datos estructurado entre UI y API, sistema de componentes reutilizable y gestión de estado orientada a performance, diseñada para expansión futura hacia mobile, stage mode y capacidades en tiempo real.

Desafíos

  • Modelar operaciones dinámicas de setlist sin romper consistencia de orden durante ediciones
  • Equilibrar inteligencia de recomendación con control predecible del usuario en flujos creativos
  • Mantener rendimiento de render estable con interacciones frecuentes de reorden y reemplazo

Resultados

Entrega de un flujo unificado para que músicos generen, organicen, recomienden y exporten setlists

Creación de una base técnica escalable para funcionalidades futuras como stage mode y colaboración en tiempo real

Mejora de consistencia de UX mediante componentes reutilizables y flujo estructurado en acciones clave

Aprendizajes

  • Las herramientas creativas requieren control fuerte del usuario incluso con recomendaciones asistidas por IA
  • Fronteras claras de dominio en aplicaciones full-stack aceleran evolución sin comprometer mantenibilidad
Volver a proyectos