The brief
Our own launch film. One piece that says what GiveMePrompts does in about 40 seconds, plays as a wide film and as a vertical post, and backs up its own claim by how it is made. The film says no templates, no stock, all code, so it had to be all code.
What we made
- A 43 second film, 1,039 frames at 24 fps, in two masters with sound, 1920x1080 and 1080x1920
- A 3D night city built in three.js, toon shaded, with a halftone pattern in the darkest shadows built into the material
- Five billboards that show our real pages, captured from the studio site and our own demos. In order they cover websites, brands, films and ads, systems, then all of it
- Kinetic type over the top, with the opening line, three hits (NO TEMPLATES, NO STOCK, ALL CODE), five numbered captions, a four-word recap and the end card
- Music is HaH (EuroSlap Intro) by Samurai BLAQUE, our own music brand
How it works
Each format is one HTML file. We cut the track first and measured its beat grid, 95 beats in the 43 second cut, about 134 BPM. Every cut, caption and speed change is placed on one of those beats.
The camera's speed is written as a function of time. It crawls through the opening, jumps on the first slam, slows down so you can read the billboards, and flies again for the recap. The type updates 12 times a second over the 24 fps city, which gives it a hand-animated snap. The city is laid out from a seeded random generator, so every render builds the same blocks.
The page exposes a seek function. A headless Chromium steps to each frame time and takes a screenshot, then ffmpeg joins the frames with the audio. We render one format at a time, because two at once starved the GPU and dropped textures.
What we threw away
Version 4.3 was finished and rendered, and we replaced it. Checked against the vertical cut it had dark frames for the first 2.7 seconds, the opening line was cut off at the sides on a phone, the recap skipped films, the end card was weak and the display copy ended in periods. On a feed the first second decides, so that version did not ship.
Version 4.4 puts a readable line on screen from frame zero (YOUR BRAND ON EVERY BLOCK), shrinks the vertical hook, adds FILMS as a fourth recap hit locked to the beat, puts dark plates behind the captions and the end card, and drops the periods. Every change was a scripted patch that had to match exactly once in each file, so the wide and vertical versions could not drift apart.
We also tried moving the billboards in the vertical cut so two of them would stop getting cropped. Both attempts made it worse and were reverted.
Limits
In the vertical cut the BRANDS and SYSTEMS billboards are still partly cropped around 18 to 20 seconds and at 27 seconds. The small text on the billboards is texture at phone size, so the captions do the explaining.
The renderer loads three.js, GSAP and the fonts over the network, so it needs a connection to render.
This is our own studio film, not client work. It is posted on X, Instagram, TikTok and LinkedIn, but it is not on our site, YouTube or Contra yet. For a client the billboards would carry their product and pages, cut to their track.
