The home at dusk under IMMERSE: the Lekki–Ikoyi Link Bridge lit over the lagoon in Lagos, with a shooting star in the sky

Portfolio: A portfolio you can step into, room by room

PRODUCT DESIGN | DESIGN ENGINEERING | INTERACTIVE WEB

I designed and built this site to tell my story. It's 14 pages, and most of them open into a room, among them the lagoon in Lagos, a radio studio, a field book, and About, read to you in my voice.

I enjoy the interactive web a lot, so I made the site an experience you step into. Every room is my own life: I'm a trained broadcaster, so there's a radio studio, and I studied geology, then surveying and geoinformatics, so Writing is a field book.

YEAR

2026

ROLE

Product Design Engineer

OUTCOME

Live, and the reactions to the snippets I've shared have been encouraging.

bayoadegoke.com

The home: Lagos by your own clock

ArrivalThe lagoon and the sky move
IMMERSETraffic, a yacht, drones at night
LiveLagos's weather and the real moon

A photograph of the Lekki–Ikoyi Link Bridge, at dusk or by day by your own clock, with Lagos's real weather on the lagoon: cloud, rain, lightning.

About: my story, read on air

The readingFour parts, each word lit as I say it
The soundscapeThe places in my story, under my voice
The windowLagos's light and weather, now

The soundscape follows the story: home in Ile-Ife and Ibadan, a talking drum saying my name, a hammer for the geology, a surveyor's beep, rain on a zinc roof in Delta State.

Selected rooms: from the lagoon to the studio

01The home at night. Under IMMERSE, 5,323 drones draw my portrait over the lagoon, then re-form as BA.

The home at night under IMMERSE: drones drawing my portrait in the sky beside the bridge's pylon, with a yacht on the lagoon — 01The home at night. Under IMMERSE, 5,323 drones draw my portrait over the lagoon, then re-form as BA.

02About on air. Each word lights as I say it, and the photographs come up as the story reaches them.

About on air: the word being said lit gold, the photograph of me at a studio microphone up over the page, and the ON AIR bar — 02About on air. Each word lights as I say it, and the photographs come up as the story reaches them.

03A surveyor's field book: the problem on a ruled page, the fix on a squared one, and margin notes found only here.

Writing's notebook open on a field note: the problem on the ruled page, the fix on the squared one, and my margin notes in pencil — 03A surveyor's field book: the problem on a ruled page, the fix on a squared one, and margin notes found only here.

04The radio desk, modelled in Blender. Four channels are live: my voice, the records, the sting and pads, and Lagos.

The radio desk rendered in Blender: ten channels of faders, four VU meters, a red LED clock, the running order screen, and the ON AIR sign lit above — 04The radio desk, modelled in Blender. Four channels are live: my voice, the records, the sting and pads, and Lagos.

The build: plain HTML, CSS and JavaScript

I built the site end to end: 14 pages, designed in Figma, then written in plain HTML, CSS and JavaScript, with no framework and no build step. It's hosted on Vercel, with one small server function for Lagos's weather. Below are the rooms in use, how I worked with AI tools, and the decisions that shaped it and what each one cost.

The rooms in use: three recordings

01IMMERSE on the home. Traffic crosses, the pointer stirs the water, and a click relights the bridge in a study's colour.

02On air. CH1 MIC ON starts the show for the hour in Lagos, and AUTO moves between the five camera shots.

03A photograph's first time. It develops in About's darkroom, under a red safelight, shadows first.

AI in the build: who did what

DirectionI set it, and made every decision
MakingAlongside Claude Code and other AI tools
ReviewScreenshots and recordings, then my go-ahead

I built it alongside Claude Code. The studio desk was modelled with Claude through the Blender MCP, Figma Make made the day photo from the night one, and Whisper timed the reading's words. Nothing went live without my go-ahead.

Decisions I took

Build every room from my own life

Why The direction wasn't clear until I approached it by telling my story. From there, each room comes from my life: a radio studio for the broadcaster, a field book for the surveyor.

Cost Seven rooms to build, from the lagoon to a typewriter and a contact sheet, each with its own script, sounds and quiet version.
Put the studio on Lagos time

Why The three shows run by Lagos time, so the show on air matches the studio clock. At the hour, the record playing finishes before the next show starts, as on real radio.

Cost A new show can start up to a record late, and a visitor abroad hears Lagos's hour, not their own.
Frame the desk in five shots, not a free orbit

Why Dragging already moves the faders, and a free orbit would show the parts of the room I didn't build. Five set shots and AUTO keep the desk in frame.

Cost No looking round the room: the camera only goes where I put it.
Stay static, with nothing to build

Why Plain HTML, CSS and JavaScript, the libraries vendored, and three.js loaded only in the studio. Every sound but my voice and the music is made in the browser, so there's no sound file to download.

Cost No framework to lean on, and one stylesheet of 1,656 lines. The studio still downloads about 470 KB on a first visit.
Support the keyboard, screen readers and reduced motion in every room

Why Every room works without a mouse, without sight and without motion, so the story gets through however someone visits. The studio's controls are also real controls on the page.

Cost Each room has a quiet version to build too: the camera cuts, the sky stays still, the darkroom is only a tint.

The home was inspired by iniabiodun.com.

For a project or a role

I'm open to senior and lead product design engineer roles, and to client projects.

Email me Resume LinkedIn GitHub