Real estate listing video template (one HTML, many listings)

A real estate listing video is the most templated piece of video content on the internet. Open a listing on Zillow, Redfin, or a local broker: a 20-30 second clip with the same six beats — exterior shot, headline (address), three bullets (beds/baths/square footage), price, "schedule a tour" CTA. Different city, different photos, same skeleton.

This is the most under-served use case for code-driven video. The market is enormous (every listing wants one), the budget per listing is tiny (no one pays for a custom edit), and the structure is identical. It is exactly the kind of thing a template + a renderer should solve.

The template

One HTML file with seven knobs:

• ADDRESS — "1247 Marina Blvd, San Francisco"
• PRICE — "$2,450,000"
• BEDS — "3"
• BATHS — "2.5"
• SQFT — "2,100"
• HERO_IMAGE — URL to the exterior shot
• AGENT_NAME — "Sam Patel, Acme Realty"

The video plays as:

1. Hero shot, 4s. The exterior image fills the frame. Address slides in across the bottom.
2. Numbers card, 4s. Three big tabular-num blocks: BEDS, BATHS, SQFT. Animate up.
3. Price reveal, 3s. Big serif type, easing-as-money settle curve.
4. CTA, 3s. Agent name + "Schedule a tour" + a phone number.

14 seconds, plus 2-second hand-off animations between scenes = 20 seconds total. The right length for a listing reel.

The CSV

Every listing in the system is one row:

listing_id,address,price,beds,baths,sqft,hero_image,agent_name
mls-12847,"1247 Marina Blvd, SF","$2,450,000",3,2.5,2100,/photos/12847.jpg,"Sam Patel"
mls-12848,"58 Elm St, Oakland","$985,000",2,1,1180,/photos/12848.jpg,"Sam Patel"
...

The renderer reads the CSV, fills the template per row, renders each listing to an MP4. For 10,000 listings, see render 10k variants overnight — the math works out.

The hero image problem

The one piece that isn't text is the exterior photo. Three approaches:

1. <img> with object-fit: cover on a fixed-aspect div. Simple, works for any photo aspect ratio. Use this.
2. Ken Burns-style slow zoom. Add a transform: scale(1 + t * 0.04) on the image element. Reads as cinematic without needing video footage.
3. A short panning crop. transform: translateX(-t * 30px). For very wide photos.

Pick option 2. It adds 4 lines of CSS and turns a static photo into a living shot.

The legal copy

Real estate has compliance text — "Equal Housing Opportunity," "Each office independently owned," license numbers. These belong at the end of the video, in small type. Don't skip them; the listing platforms reject videos that don't include them.

Add a final "legal card" scene with the compliance text in 14px sans-serif, 4 seconds long. It's boring; it's required.

Per-listing output

The build step:

node render-listings.js --input listings.csv --out ./videos/

Produces:

./videos/mls-12847.mp4
./videos/mls-12848.mp4
...

Each video is the same template with that listing's data substituted. The cost per listing is ~30 render-seconds + ~2 seconds of encode. A 10,000-listing brokerage's overnight render is ~85 hours of compute, which on 50 parallel workers is ~1.7 hours.

The CSV-driven batch render pattern is exactly the one in batch personalized videos from CSV. The "scale to 10k overnight" math is in render 10k variants overnight.

A close

A real estate brokerage is currently paying $50-200 per listing for video, and each video is 60% identical to the last one. The template-and-render path produces every listing's video for pennies in compute. The brokerages that figure this out first compound on it; the ones that don't are stuck paying a per-listing creative fee that isn't going down.