Nexus / spatial frontend engineering
From line
to place.
I built the interaction around one architectural identity. Drawing, structure and material share the same reference.
CANVAS 2D / JAVASCRIPT / SPATIAL INTERACTIONSource projection → structural volume
The drawing already
knows the building.
Roof, glazing, overhangs and base resolve from the original facets. Depth comes from their relationship, not a substitute model.
Wireframe → material / shared coordinates
Change the surface.
Keep the structure.
The photographic mask uses the same geometry as the drawing. Inspect the boundary: the house never changes identity.
Real frontend / simulated systems
Space becomes
an interaction.
The original interface extends into lighting and climate controls. This is an interactive concept, not connected hardware or live telemetry.
02 / One coordinate space
Geometry belongs
to the image.
The original opening defines facets and mullions in the photograph’s 1672 × 941 coordinate space. A shared scale and offset place every layer.
The inspection above uses those source coordinates directly. Its SVG paths and photographic mask do not introduce a second house or an invented perspective.
SOURCE SPACE
FACETS / MULLIONS / MATERIAL
A coordinate contract, not a building specification.06 / Technical decisions and boundaries
- Shared geometry
- Source-aligned facets preserve the building through every visual state. Independent image positioning would introduce drift at the reveal boundary.
- Bounded rendering
- The original opening skips redraws when progress is unchanged. This case ties finite SVG construction to scroll and the native reveal control. It does not add a continuous render loop.
- Accessible inspection
- The material boundary is a native range input. Arrow keys, touch and pointer input reach the same states; reduced motion starts with the completed comparison.
- Honest simulation
- Smart-home, energy and security scenes are interface concepts. They are not installed controls, real consumption readings or production security guarantees.
What the work proves
Continuity is
engineered.
Geometry-driven interaction, visual state and spatial frontend craft—with one consistent reference from drawing to the final experience.
Explore Nexus live ↗