Floating city revenue skyline
A floating city revenue chart animation: four districts rise on a sky island and read as a stepped bar chart. Copy the prompt into Claude and render the MP4 free.
A low-poly island floats in a warm sky, seen from below its rocky rim with a waterfall pouring off the edge. Each quarter a taller terrace rises from the cloud sea, docks beside the last and grows a district. The camera then pulls back, a red growth line draws across the tops and the figure lands.
Change the four quarter labels and revenue values, which set each district's height, plus the growth figure, the small line above it and the two sky colours. At 16:9 and 15 seconds it suits investor updates, quarterly results videos, YouTube explainers and landscape slides in a board deck.
Use it for
- Quarterly revenue update videos
- Investor deck results slide
- Startup growth story on YouTube
Specs
- Length: 15 seconds
- Format: widescreen 16:9 (1920x1080), 30 fps
- Built with: Three.js in HyperFrames
- Category: Charts
What happens, beat by beat
- 0.0 s. Frame 0 is already a hero shot: the bare first island seen from below the rim, its faceted rock underside tapering to a point, a waterfall pouring off the edge. Camera already pushing in.
- 0.5 to 2.0 s (Q1). The [Q1 label and value] tag lands. Nine cottages pop up one every 5 frames in a set order, then a windmill on beat 4 (2.0 s). The windmill cap is…
- 2.5 to 5.0 s (Q2). Terrace 2 rises from 6.5 units below and docks at 3.5 s; the whole island dips on impact. A crane rises, swings, and seven offices extrude shortest first, tallest landing on…
- 5.5 to 8.0 s (Q3). Terrace 3 docks at 6.5 s. Six towers (stepped setback blocks and round domed ones) land 7.0 to 8.0 s while a tram track draws itself round the rim over 1.5…
- 8.5 to 11.0 s (Q4). A cloud bank over the Q4 site parts (8.3 to 9.8 s), terrace 4 docks at 9.5 s, four glass blocks land, nine birds spiral in from far out, and a…
- 12.0 to 15.0 s. Camera pulls back to the full skyline (about 31 units away). Foreground clouds lift into the bottom corners. The growth line draws 12.2 to 13.0 s with white node spheres popping at…
Light, post and type
- Gradient sky shader, [sky top] to [sky horizon] with a warm sun glow, shifted with camera pitch so blue stays above and haze below. A PMREM of the same sky…
- Warm key sun from front-left at about 38 degrees with a 4096 PCF shadow map, cool hemisphere fill, weak warm rim from back-right.
- Render to a 4x MSAA half-float target with depth. Golden-angle gather depth of field focused on the camera distance with strength scaled to it, for a tilt-shift miniature feel. Light…
- HTML type in Outfit, [ink colour]: quarter tags (swatch bar scaling in, 600-weight tracked label, 800-weight 128 px value) ride a 3D anchor beside each district, clamped to the safe…
How the prompt opens
Make a silent 15-second, 16:9 (1920x1080, 30 fps) Three.js motion piece in one continuous camera move. A low-poly island floats in a warm sky. Each quarter a new, higher terrace rises out of the cloud sea, docks beside the last, and grows a district whose tallest point is set by that quarter's revenue. The camera pulls back at the end and the four districts read as a stepped bar chart, a red growth line draws across their tops and [your growth figure, e.g. +212% YoY] lands. The brand is an invented example (e.g. a company called Nimbara): swap in [your company and period, e.g. "Nimbara FY26 revenue"], [four quarter labels], [four revenue values, e.g. $1.2M, $1.9M, $2.8M, $3.7M] and the…
The full prompt runs 1,098 words. Copy it free (2 a day) from this page.
Copy the prompt into Claude, or pull the scene into Claude Code and render the MP4 on your machine: how it works.