Interactive 3D & Creative Coding

2024–2026 ↗ Live 3D Site

A collection of experiments across WebGL, physical computing, and creative algorithms. It includes a spatial 3D portfolio where you explore works by moving through a virtual world, alongside hardware prototypes and web games that bridge the gap between code and interactive environments.

A portfolio is already a strange object: a curated self, arranged for a viewer. Making it spatial asks a harder question — what does it feel like to be inside someone's work rather than looking at it?
Software
Three.js, WebGL, HTML/JS, p5.js
Hardware
ESP32, DC/Servo Motors, 7-Segment
Deployment
Vercel, Wireless ESP-NOW
My Role
Design, Development, Wiring

The 3D Portfolio

Most portfolios are lists. Grids of thumbnails that ask you to click, scan, judge. The interaction model is the same as an online shop — browse, filter, select. The 3D portfolio inverts that. Instead of a viewer selecting work, the viewer walks through a world that the work inhabits. Discovery is spatial.

Project Opened
Interaction Model: Click & drag the dot into the threshold ring

Navigation & Mechanics

The viewer moves through a 3D environment using standard WASD/arrow key controls. The world is small and deliberate — not a sprawling game level, but something closer to a gallery space. Each project lives inside a ring. Standing on or near a ring triggers that project's information, acting as a physical threshold for entering a piece of work. Walking away closes it.

Creative Coding & Physical Prototyping

Beyond the browser, my coding practice extends into physical computing and logic-driven web experiments. Bridging the digital and physical realms often reveals how brittle code actually is when it meets gravity, friction, and network latency.

ESP32
🔨
AQI: 50
AQI Reactive Art: Kinetic motion scales with environmental data

AQI Reactive Art

A physical installation fetching real-time Air Quality Index (AQI) data over WiFi. Using an ESP32, a servo, and a DC motor, the physical movement speed maps directly to the live environmental data of different cities. The worse the air, the more frantic the motion.

[TX] SEND
[RX] Wait
[RX] Wait
ESP-NOW Protocol: Click [TX] to bypass WiFi and force hardware sync

ESP-NOW Timers

A hardware prototype featuring three 7-segment displays driven by dual ESP32 microcontrollers. The boards communicate wirelessly via the ESP-NOW protocol, bypassing traditional WiFi networks to maintain a perfectly synchronized 5-minute countdown regardless of local router latency.

WordPerfect Logic: Click letters to select, shuffle to rebuild arrays

WordPerfect

A multiplayer web-based word game built entirely in a single HTML file. It served as an exercise in extreme constraint and rapid iteration, taking direct user feedback to refine the game loops and logic on the fly without complex backend architecture.

What It Taught Me

Spatial Interfaces Demand Attention Building the 3D world made it very clear that spatial interfaces are arguments about how attention works. A flat grid asks for rapid scanning. A 3D world asks for dwelling.
The Performance Tax WebGL on mobile is hostile. The final version makes significant compromises to run well across devices — lower poly counts, simplified shaders, reduced draw calls. The tradeoffs are always between fidelity and reach.
Hardware is Unforgiving Working with ESP32s and motors taught me that code that works perfectly in a simulation will inevitably fail when a wire is loose or a motor draws too much current. It grounds algorithmic thinking in physical reality.