- Scroll animado
- Escenas 3D
Qué hace especial
- Hero con video
- Scroll animado
- Escenas 3D
- Audio interactivo
- Carrusel
- Preguntas frecuentes
- Formulario demo
Qué incluye
- Prompt para recrear y personalizar el diseño con IA.
- Código y archivos del sitio: imágenes, fuentes y licencias.
- Demo interactiva e instrucciones.
- Uso en sitios propios y proyectos finales de clientes.
Secciones y pantallas de la demo (13)
- Pantalla de carga con porcentaje real
- Hero de video cinematográfico a pantalla completa
- Presentación del sello en dos columnas
- Colección 3D de artistas, canciones y vinilo
- Boletín como cartel con boleto (modo demo)
- Anillo 3D de miniaturas
- Pie tipo contraportada
- Directorio de artistas
- Perfil de artista
- Sobre el sello con preguntas frecuentes
- Pieza de video
- Concepto de gira con intro 3D
- Privacidad y 404
Qué puedes personalizar
- Nombre, lema y wordmark SVG
- Colores (tokens hex)
- Siete papeles tipográficos
- Artistas, canciones y carátulas
- Clip y póster del hero
- Figura 3D (GLB propio)
- Textos del boletín y del sello
Cómo empezar
- Copia el prompt y descarga los archivos.
- Llévalos a tu herramienta de IA y pide los cambios: marca, textos e imágenes.
- Revisa el resultado y publícalo en tu dominio.
Descarga el paquete y copia el prompt: tu herramienta de IA trabaja sobre el proyecto Next.js del paquete (README con instalación y dónde personalizar). Cambia nombre, artistas, canciones, logotipo, video y colores. No incluye música; el boletín está en modo demo.
El resultado depende de tu herramienta de IA y de los cambios que hagas. La demo muestra la dirección visual.
Detalles técnicos y requisitos
Requisitos
- Node.js 20.9 o superior para ejecutar el proyecto (Next.js).
- Navegador con WebGL 2 para el metal líquido y el 3D (hay alternativa sin WebGL).
- Aporta tu marca, textos y, si los quieres, fotos, carátulas y música con derechos.
- Tipografías del diseño (nocturne-serif, mandrel, herencia, emily-austin): un kit propio de Adobe Fonts (Creative Cloud) con tu dominio autorizado; el ID del kit se configura en NEXT_PUBLIC_ADOBE_FONTS_KIT.
- No incluido: herramienta de IA (y sus créditos), dominio y hosting.
Tecnologías
- React
- Next.js
- TypeScript
- Three.js
- React Three Fiber
- drei
- Paper Shaders
- WebGL
- Web Audio
- 3D
Implementadas en el paquete que descargas.
Next.js 15 (App Router) · React 19 · TypeScript · three.js · React Three Fiber · drei · Paper Shaders (LiquidMetal) · CSS Modules
Herramientas de IA sugeridas
ClaudeCodexv0
Compatibles con las instrucciones del diseño; no es una prueba registrada.
Compatibilidad probada: Sin prueba registrada todavía.
Paleta y tipografía
- títulos: Cormorant Garamond / Playfair Display
- titulares ligeros: Cormorant Garamond Light
- lectura: Inter
- botones: Archivo Expanded
- navegación: Barlow Condensed
- firma: Pinyon Script
- manuscrita: Allura
Licencia y versiones
Úsalo en sitios propios y en proyectos finales de clientes, incluido uso comercial. No revendas ni redistribuyas el prompt, los archivos ni el sitio como plantilla. Leer la licencia
Procedencia: Paquete v1.2.0: código y assets del sitio original aprobado (sello-angel-pilot.vercel.app): proyecto Next.js con su vídeo, carteles y carátulas, modelos 3D GLB y tipografías del kit de Adobe Fonts (configurable). Avisos en LICENCIAS-Y-AVISOS.md.
- Versión
- v1.2.0 · Publicado 29 oct 2026
- Versiones
- v1.2.0 · 2026-11-03 — Versión original aprobada (la de Vercel y el vídeo de la ficha): código, vídeo, carteles, GLB y fuentes del sitio publicado (286/286 archivos idénticos al despliegue).
- v1.1.1 · 2026-11-03 — README corregido (instrucciones y raíz del paquete); código, assets y prompt iguales a 1.1.0.
- v1.1.0 · 2026-10-30 — Paquete de código y assets: proyecto ejecutable, imágenes, tipografías y licencias (250 archivos). Prompt alineado con el paquete.
- v1.0.0 · 2026-10-30 — Publicación: preview en video, prompt breve y paquete descargable.