Origami Waves

A website for Origami Waves, a paper artwork of 522 folded pyramids in matte black on a 29 × 18 grid, each open on one side to reveal a smaller pyramid of vivid blue (#007AFF) paper inside at exactly 75% scale.

• Main page: the artwork in 3-D, exactly as saved in origami1829-final-vision.blend, with nothing else in the way. The i button (bottom left) slides in the details and measurements (in inches). Customize (bottom right) opens the second page.
• Customize page: choose paper colors, pick a pattern style and shape it with three sliders, let the pattern move slowly like a live stream (pause, go back, save the moment), and save designs, images and Blender files.

Built with three.js (WebGL 2), TypeScript and Vite. Everything runs in the browser; nothing is sent anywhere.

Quick start

npm install

npm run dev

Open http://localhost:5173. For a production build (static files in dist/, host anywhere):

npm run build

The live site is deployed on Vercel from the main branch. Requirements: Node 20+ and a browser with WebGL 2. Blender (4.2+, tested with 5.0.1) is only needed to regenerate assets or to verify the Blender files.

Using the site

Viewing. Drag with one finger (or the mouse) or twist two fingers to turn the artwork, scroll or pinch to zoom, right-drag or slide two fingers to move it. Front and Detail recreate the Blender cameras; Angled shows the artwork tipped back 45°, as if leaning back on an easel, where the relief reads best. The page never scrolls, so touch gestures always go to the artwork.

Customize (the page's address ends in #customize, so the browser's back button returns to the main page):

Control	What it does
Colors	Pyramids (outside paper), Inside (the nested paper), Board. Each has a set of swatches plus a custom color picker.
Pattern style	Original (the artwork as made), Drift, Ripple, Dunes, Crosscurrent, Bloom, Spiral. The small previews show each style in your colors.
Intensity	Subtle to bold: how far the pyramids rise, fall and lean. The lowest setting is half strength, so there is always a clear pattern.
Scale	Fine to broad: the distance between wave crests. Broad waves let the tips lean farthest.
Flow	Gentle to swirling: how much the wave fronts bend and the leans twist.
Shuffle	A new variation of the style (new positions, angles and timing).
Animate	Starts the slow, continuous motion and shows the play bar.
Undo / Redo / Reset	Step through changes, or go back to the original artwork.

The play bar works like a live stream: pause, jump back 5 seconds, drag through the last minute, return to Live, or press the bookmark to save the moment you are looking at.

Save design keeps the look (colors, style, sliders, moment) in this browser under My designs, with a thumbnail; tap one to reopen it. The current look is also remembered between visits. Save image renders a 3000 × 2000 PNG of the front view. For Blender downloads a zip with a .glb (File › Import › glTF 2.0) and a script that rebuilds the full scene with materials, lights and cameras in your colors (instructions in the zip's README).

How the patterns are made

Like the original, every style mixes strong areas, where tips reach far over and rise or drop, with calmer areas that lean slightly closed and sit a little lower, so the strong areas stand out. Wave fronts always bend a little (more with Flow), and the lean direction turns gradually across the board. Each pattern is measured and scaled until its strongest area reaches the limits below, which keeps every variation bold.

Waves run along every row and column: no wave may travel along a row or column (every one is at least 25° off both), a gentle undertone of two more oblique waves runs everywhere, and a fine ripple along the two diagonals (about 4–5 pieces per wave, ±8 mm in height and ±8 mm in lean) keeps every tip's x, y and height changing from piece to piece. Measured over runs of 5 neighboring pieces, tips line up (within 3 mm) about 2% of the time, as in the original.

Geometry limits

Every variation stays within limits taken from the original artwork, so pyramids are never too short, never fall toward the board, never touch their neighbors and never reach into the 2-inch border of the board:

• tip height 22 to 76 mm (the original: 27 to 71 mm), resting at 49 mm
• sideways lean up to 66 mm (the original reaches about 69 mm)
• neighboring tips differ in lean by at most 38 mm (the original: 37.6 mm); where a pattern is steeper, only that spot is eased back, smoothly
• all tips inside the board's 2-inch border

These limits are part of how the patterns are built. On top of that, after each change the complete geometry check runs; if it ever found anything, the pattern would be toned down until clean. In 10,000 random variations at the most extreme settings it never had to (see docs/VERIFICATION.md).

This is the beginning of the README. Read the rest at the original. Read the full README ↗