Wooden Bead Maze
The wooden toy lacked an engaging way to show its history and tactile feel in a digital space. I created an interactive prototype that highlights its craftsmanship and cultural story to provide a more multisensory and curious user experience.
Plastic toys are designed to entertain. Wooden toys are designed to develop.
Research in early childhood development consistently shows that open-ended, tactile objects ones with real weight, texture, and resistance build fine motor skills, focus, and imaginative thinking in ways that plastic cannot. The bead maze isn't just a toy. Every slide, push, and clack is a small act of coordination.
There's a safety dimension too. Most plastic toys contain chemical compounds that wood simply doesn't. No chemicals flaking off into a toddler's hands and mouth. Wood also lasts. A plastic toy breaks and becomes landfill. A wooden one gets passed down.
This project creates a digital prototype that brings the wooden toy to life online. By focusing on its story and material, the goal was to build a fun, interactive experience that makes people feel curious about the toy’s history and craftsmanship again.
Project type:
Responsive website & Branding
Timeline:
6 weeks (2024)
Tool:
Figma, Webflow, 3D Spline, Lotti Files, Adobe Illustrator, Adobe photoshop
My Role:
UX designer (Individual)
Plastic has won, not because it's better, but because it's louder.
In a world of bright colors and fast screens, the quiet craftsmanship of wooden toys has become nearly invisible. The real loss isn't just environmental. It's sensory wood has weight, grain, and a clack that no product page can replicate.
How might we bring the soul of a handmade toy into a digital space, without stripping away the very things that make it worth touching?
Challenge : The idea was to bring the charm of handmade toys into a modern, interactive space while keeping their simplicity and purpose intact.
This site is for parents worried about their kids' screen time. They want toys that encourage hands-on play, imagination, and creativity instead of digital devices. Believing in getting back to basics with real, physical play that helps children learn and grow naturally.
I looked at three examples :
A Polaroid camera :
Complex mechanics, but lacked the “organic” warmth I wanted.,
A handwoven Indian basket :
Rich in texture, but offered limited interactive movement.,
A traditional wooden toy (Selected):
Chosen for its handmade charm and nostalgic value.
The wooden toy won. Handmade charm, nostalgic value, and a direct connection to Toy Trunk, a company I’d previously designed for. It was the only object where sound, movement, and material could all be designed together.
I looked at several traditional wooden toys a pull toy, a rolling rattle, balancing blocks before landing on the bead maze.
It was the only one with no rules. Children move beads freely, invent their own paths, create their own patterns. That open-ended quality translated perfectly into an interactive 3D experience drag, move, explore, no instructions needed.
The curved paths and spatial movement also gave me the most to work with in Spline. Sound on dragging. No right or wrong. Just play.
The core question was simple: how much of a handmade object can survive going digital?
Materiality : 3D textures to show wood grain and real physical scale.
Sound : recorded real "clacking" and "scraping" sounds, not generated ones.
Interaction : a color palette surprise on hover, drag-to-move beads, no instructions. Just the same open-ended play, on a screen.
The goal wasn't to simulate the toy. It was to make you want to go find the real one.
Toy Trunk is an Indian wooden toy company I'd previously worked for which gave this project a real commercial grounding.
Their philosophy is rooted in Montessori: no batteries, no screens, no rules. Just hands, wood, and open-ended play. That became the brief for everything if it couldn't exist in that world, it didn't belong in the design.
Starting in Figma, I mapped the site as a narrative journey from the toy's physical origins to its digital form. Layout, flow, and visual identity were all resolved here before a single line of code.
The wireframes show the progression from rough sketches to a structured mid-fidelity where the color palette, typographic voice, and section hierarchy took shape.
Started in Blender hit a wall. The wood grain looked right but the curved bead paths wouldn't animate smoothly. Moved to Spline, rebuilt the model using path tools and custom animations.
Sound came last. Recorded real clacking and scraping from an actual wooden toy, edited in Adobe Audition, and synced to the drag interactions. That detail made it feel grounded.
Sensory details do the heavy lifting. A single real sound wood clacking against wood made the entire experience feel grounded in a way no visual could.
Designing for "no rules" is harder than it sounds. Open-ended interaction needs more structure behind it, not less.
Spline and Webflow taught me that restraint is a design decision. The moments I stripped back, the craft came through clearer.
