Memory Landscape

ExpertiseCreative development, data visualization, sound
Year2026
RoleDesign, development, sound
ClientSelf initiated
The piece at rest. A dense point cloud sphere in violet and white on black, memory cards floating around it on thin wires, with TOPOGRAPHY and PROCESS tabs above and a monospace readout in the corner.

The terrain at rest. Point, card, and wire positions are computed from the dataset.

A personal dataset rendered as generative terrain.

Memory Landscape is a browser-based generative terrain built from a structured dataset of places I have lived, the memories attached to them, and the languages they happened in. Every visual and sonic parameter is derived from a field in that dataset. The piece renders as a WebGL point cloud sphere with orbit and zoom controls and reactive audio.

Source material

The source material is a set of physical documents collected across two countries and two languages: train tickets, receipts, photographs, letters, official papers. Each carries partial structured information. A ticket holds a date and a price. A letter holds a recipient and a language. Formats are inconsistent across types.

Before modeling, each item was cataloged as an object with a fixed set of properties: place, period, type, language, and sentiment.

A cluster of memory cards suspended above one location on the sphere, each card a small bright rectangle tethered to the surface by a wire.

Memory cards over Nanjing. Each card type, receipt, photo, document, letter, has a distinct layout.

The schema

Each location is a record: years, duration, intensity, significance, valence, and a language balance between English and Chinese, each normalized to a 0 to 1 range. Each memory attached to a location is a child record with a type, a sentiment score, and a language. Nothing in the piece is styled by hand. Every visual quality is driven by a field, and any quality that cannot be written as a number is excluded.

The schema is small by design: a dozen fields per location, three per memory.

The loading screen. A black frame with the words LOADING TERRAIN set small in grey letterspaced capitals at the centre.

Loading state. The dataset is parsed and the terrain computed before first render.

The mappings

Each field is bound to one visual or sonic output through a plain function from input range to output range. Every binding is documented in the piece's process view. The core bindings:

location.intensityElevation amplitude
location.significancePlateau height and erosion
location.valenceRidge sharpness
location.durationSurface roughness
location.languageBalancePosition and palette on the language axis
memory.sentimentLocal height around each card

Intensity scales elevation amplitude. Significance sets plateau height and erosion rate. Valence controls ridge sharpness in both directions from neutral. Duration adds surface roughness detail. Eighteen years in Nanjing produces the highest plateau with the slowest erosion. No terrain features are placed manually.

The point cloud surface seen close up, resolving into plateaus and sharp ridges built from thousands of individual points.

The surface up close. Plateaus and ridges computed from location fields.

The piece's own process view, a dark panel listing each mapping as a documented function.

The in-piece process view. Each mapping listed as a function.

A column of mapping cards from the process view. Each names a source field and its visual or audio channel, then gives the transfer function and a plain sentence explaining it.

Each binding shows its source field, output channel, and transfer function.

Cards and wires

Each memory renders as a card in a ring around its location, connected to the surface by a wire. Connections between locations arc across the sphere. Connection strength sets arc height and brightness. Cards activate by pointer proximity rather than click. Within a threshold distance of a card's anchor, the card rises, the anchor scales up, and the wire brightens.

A single memory card lifted away from the sphere by pointer proximity, its wire lit brighter than the rest back to its anchor point.

A letter card activated by pointer proximity, wire highlighted to its anchor.

The focus state on one location, with the underlying data record printed as small text at the edge of the frame.

Focus state on Nanjing. The underlying record printed as text at the frame edge.

Camera and audio

Audio parameters are bound to navigation state. Camera distance drives a low-pass filter cutoff. Pointer position pans the stereo field and shifts timbre. Hovering a cluster sets the pitch and harmonic spread of two oscillators from the same fields that shape the local terrain.

Camera distanceFilter cutoff
Hovered clusterPitch and harmonic spread
Pointer positionStereo pan and timbre
The whole sphere pulled back to maximum camera distance, the year spiral of cards visible as a wide ring around it.

The full dataset at maximum camera distance, with the year spiral visible around the sphere.

One dataset drives every visual and sonic parameter.

Design and developmentBrant Pan
SoundBrant Pan
Stackthree.js, WebGL, Web Audio
DeployedNetlify, 2026