Veduta

Qué incluye

Prompts

HTML · 444 líneas / React · 537 líneas

Medios

Vídeo de fondo · Imagen de fondo

Alojamiento

cdn.orbital.supply, ya incluido en el prompt

Tipografías

Noto Serif Display + Spline Sans · Google Fonts

HTML

Un archivo · gsap 3.15.0 + ScrollTrigger + SplitText (jsDelivr) · lenis 1.3.26 (jsDelivr)

React

react 19.3.0 · vite 8.3.2 · typescript 6.0.3 · tailwindcss 4.3.3 · gsap 3.15.0 (+ ScrollTrigger · SplitText) · @gsap/react 2.1.2 · lenis 1.3.26

Movimiento

loader-once, die-cut-gate, pinned-overlap, stacked-sheets

Probada y documentada

13 de octubre de 2026

• Reproducida en Claude
• Revisada a 375, 768, 1440, 1920 px
• Revisor de la spec: 0 errores, sin enlaces a generadores

Cómo usarla

1. Claude

   Pega el prompt de HTML en un chat nuevo. Obtienes un index.html para servir por HTTP o publicar donde quieras.

2. Vite + React

   Abre un proyecto vacío de Vite + React y pega el prompt de React. Indica los paquetes exactos; las URLs de los recursos ya están dentro.

El prompt

Extracto / 537 líneas en el prompt completo

# Build: "Veduta Pictures" — a film production company site printed on die-cut card stock, with 19th-century landscape paintings that move

## 0. Brief

Veduta is a fictional production company (documentary, commercials, long-form drama) that films on location in natural light. The whole site is a sheet of tan card stock with a die-cut window, like a film gate: through it you see public-domain landscape paintings in which a tiny film crew has been painted, and the opening painting moves (a seamless video loop). Tiny printed slate data (scene, roll, take, timecode, coordinates) sits on the paper. Scrolling opens the gate to full screen, then each chapter is a new sheet that rises over the last one with a die-cut top edge. It closes with the same gate shutting over a golden gorge. Calm, printed, cinematic; one serif, one sans, no accent colour: the paintings carry the colour.

El prompt completo se desbloquea en el lanzamiento.