El reto: Contenido visual para músicos independientes
Para proyectos musicales como Bitter Parade, la presencia visual es tan vital como la música misma. En la era de YouTube y TikTok, publicar una canción sin un video acompañante es perder oportunidades. Pero crear lyric videos de calidad suele requerir horas de edición en After Effects, Premiere o contratar a un profesional.
Necesitábamos una manera de generar visualizadores atractivos y sincronizados para todo un álbum, rápidamente y sin fricción. Así nació Lyrics Video Creator.
La solución: Lyrics Video Creator
Hemos desarrollado una herramienta web interna que permite transformar una pista de audio y una imagen de portada en un video profesional con letras animadas en cuestión de minutos. Olvídate de las líneas de tiempo complejas.
¿Cómo funciona?
- Sube tu audio y arte: Aceptamos MP3/WAV y cualquier imagen para el fondo.
- Pega la letra: Simplemente copia y pega el texto de la canción.
- Sincroniza jugando: Pulsa la barra espaciadora al ritmo de la música para marcar cuándo aparece cada línea. Es como jugar al Guitar Hero.
- Exporta a 1080p: El renderizado se hace en la nube o en local, generando un archivo MP4 listo para subir.
Bajo el capó: Stack Tecnológico
Utilizamos Remotion para renderizar componentes de React como fotogramas de video. Esto nos permite usar todo el poder de CSS (incluido Tailwind CSS v4) y animaciones web para crear efectos visuales complejos que serían muy tediosos de hacer a mano.
Tecnologías clave:
- Next.js 15: El framework React para la producción, gestionando el routing y la API.
- Remotion: El motor que convierte React en MP4.
- Zustand: Gestión de estado ultra-rápida para la reproducción y sincronización.
- Wavesurfer.js: Visualización de la onda de audio para una referencia visual precisa.
- Radix UI + Lucide: Componentes accesibles e iconografía consistente.
