Immersive 3D WebGL photography gallery — Light & People. First-person walkthrough through three wings (Portraits, Street, Places), floor-plan minimap, ambient sound, crosshair navigation, and museum-style caption plaques for all 89 photographs.
Live: adamsmuseum.art
GitHub: AdamDisa1/AdamsGalleryMuseum
This is a single-file Wix Headless app (frontendBuild: none). No build step — index.html is the deployable artifact.
How it works:
gallery-data.js— static JS file, setswindow.GALLERY_WIX = { counts, photos }at load time. Each photo record carries amediaId(Wix CDN file ID),wingKey, and display metadata.index.html— the full gallery. Readswindow.GALLERY_WIXon init, builds Three.js r160 scene with 89 framed photos across three halls. Usesstatic.wixstatic.com/media/{mediaId}/v1/fit/…for on-the-fly resized images.- Caption plaques — per-photo
<canvas>-rendered museum labels: Adam Disatnik / Frame [ID], 2026 / 35mm Film + 2–3 sentence art-critical body text, drawn as a Three.jsCanvasTexturebelow each frame.
Stack: Three.js r160, vanilla JS, Wix Headless (no SDK at runtime), deployed via @wix/cli.
- Upload the image to Wix Media Manager.
- Copy the media file ID (the segment after
/media/in the CDN URL). - Add an entry to
gallery-data.jswithmediaId,wingKey(portraits|street|places), and anid(e.g.N05). - Add a caption entry to the
CAPTIONSobject ingallery_template.jswith{b: '...'}. - Repack and release:
# repack template → index.html
python3 repack.py
# deploy
cd ~/adams-gallery && npx @wix/cli@latest releaseAll 89 captions were written in the voice of a contemporary museum director and art critic — never describing literal objects, focusing instead on spatial dynamics, perceptual disruption, and conceptual weight. Format:
Adam Disatnik / Frame [ID], 2026 / 35mm Film
[2–3 sentence art statement]
Captions live in the CAPTIONS object in gallery_template.js (keyed by photo ID).
cd ~/adams-gallery && npx @wix/cli@latest release