Low-Poly Landscape Flyover

About this style

Low-poly art grew out of the polygon budgets of early real-time 3D and was later revived on purpose by illustrators and indie game makers, who found that a few hundred flat-shaded triangles could feel calm and handmade. The look depends on restraint: one color per facet, a tight palette, and atmospheric fog doing the depth work. Brands and travel or outdoor titles use it for approachable, quiet 3D.

<inputs>
- TITLE. Default: "NORTHFALL".
- SUBTITLE. Default: "A quiet valley, mapped slowly".
- PALETTE. Default: the golden-dusk colors below.
If I don't give you something, use the default and don't ask.
</inputs>

<direction>
A meditative golden-hour glide down a faceted valley, one title resting on the horizon.
- Terrain: PlaneGeometry 240×420 units, 110×190 segments, laid flat, toNonIndexed(), flatShading, roughness 1. Height = seeded fBm (4 octaves, base frequency 0.018, gain 0.48) × 22, multiplied by smoothstep(6, 28, |x|) to carve a corridor for the camera. Jitter vertex x/z ±0.35 so the mesh doesn't read as graph paper.
- One vertex color per face by height: floor #3B5368, low #5E7480, mid #9A8F7E, upper #C9A483, peaks #F3E4D2, with ±4% seeded lightness per face so facets read in shade. A flat faceted water plane at height 0.6, #4C6E8A, roughness 0.3.
- Sky: a big sphere with a gradient shader (#2C2E57 top, #C9707A at 55%, #F6BE8E at the horizon). Sun: a #FFE6BC disc, 10% of frame width, just above the far ridge, unfogged, with a soft additive glow.
- Light: DirectionalLight #FFD3A3, intensity 2.4, from the sun, backlighting ridges with glowing rims; HemisphereLight #8E97D1 / #6A4C3B at 0.7. No shadow maps; flat shading carries form.
- Fog #F0B48F, near 40, far 260, so far ridges melt into the horizon.
- Camera: fov 42, 7 units above the corridor floor, pitched 4° down, 9 units/s forward, roll ±1.5° on a 9s sine. Speed eases in over 1s and out over the last 1.5s.
- Type: title in Jost 300, 96px, uppercase, letter-spacing 0.42em, #FFF3E4, baseline 24px above the projected horizon; subtitle Jost 400 italic 24px at 80% opacity. Soft text-shadow 0 2px 24px rgba(80,40,30,0.35).
Banned: saturated greens, wireframe overlays, smooth shading, orbiting cameras, shake, lens flares, sphere clouds, flying through terrain, anything flashing more than 3 times per second.
</direction>

<structure>
- 0.0–1.0s: fade from the fog color into the scene, camera already gliding.
- 1.0–4.0s: glide; ridges pass on both sides, the sun dead ahead between them.
- 4.0–6.0s: camera rises from 7 to 15 units (easeInOutCubic) and the far range emerges from the fog.
- 5.2–6.6s: title letters rise 30px into place, 50ms stagger, 800ms each, easeOutCubic, fading in.
- 6.6–8.4s: hold the title while the glide continues.
- 8.4–9.2s: subtitle rises 12px and fades in.
- 9.2–10.0s: camera eases almost to a stop; hold.
For longer pieces extend the glide before the rise; never exceed 12 units/s.
</structure>

<build>
- One self-contained index.html, 1920×1080 (16:9) stage, designed for 60fps.
- window.seek(t), t in seconds, computes every visual from t: no CSS transitions or CSS animations, no setTimeout/setInterval, no state carried between frames (anything cumulative is solved analytically from t or re-simulated from 0 at a fixed step), randomness only from a seeded PRNG.
- No ?render in the URL: drive seek from requestAnimationFrame. With ?render: don't start that loop. Define seek once fonts and assets load.
- Google Fonts via <link> are fine.
- three.js as an ES module from a CDN, version pinned (import map: `three` and `three/addons/` to three@0.160.0 on jsDelivr). WebGLRenderer with preserveDrawingBuffer: true; render once per seek call.
</build>

<check>
Before showing me, screenshot one frame per second (t = 0…10) and look at each. Fix overlaps, clipped or cramped text, and anything that reads as a cheap demo. Watch for the camera clipping ridges, the title colliding with peaks or the sun, sky banding, a visible terrain edge, and facets too small to read. Confirm the final frame holds as a composed end card.
</check>

Ours, and free to use under CC0: copy it, change it, ship it. No credit needed.

Similar prompts

Keynote Product Reveal

Made by us

A device built in three.js rises out of total darkness while a softbox reflection glides along its titanium edge, then…

Isometric Miniature City

Made by us

A toy-like isometric city block that builds itself on a floating slab: bevelled buildings rise floor by floor, cars loo…

Extruded 3D Type

Made by us

Chunky two-tone 3D letters swing into place one by one on a seamless studio sweep, lit like a product shot with soft sh…

Liquid Chrome Blob

Made by us

A mirror-chrome metaball mass floats in a dark studio, buds into droplets that orbit and fuse with surface tension, the…