Motofig
A browser-based 3D configurator: pick a bike, set every finish from plastics to spoke nipples, lay out graphics panel by panel, then save and share the build.
Problem
Riders plan a plastics kit, graphics and anodized parts in their heads or in a forum thread, then find out on the bike whether the combination works. Manufacturer configurators stop at the catalog colors and do not exist for the aftermarket at all.
Approach
- 01
Put a real-time 3D model in the browser and make every surface a control: plastics with gloss, matte, satin and metallic finishes, frame, swingarm, fork coating, rims, spokes, hubs, bars, seat, exhaust and anodized hardware, each with its own swatch.
- 02
Treat graphics as a layout problem. A live kit renders a number, name and slogan across the panels in several type styles; any single panel can be taken over with its own fill, stripe, text or logo.
- 03
Keep the geometry honest. The current bike is built from a CC-BY model of a 450 enduro, reworked in Blender; model names describe the geometry only and no manufacturer marks appear. More bikes are being added so Motofig reads as any motorcycle, not one brand.
- 04
Make builds portable. Designs save in the browser and a Share action sends one elsewhere, so a build is something you can hand to a friend or a painter.
Architecture
A single-page app: a glTF model in a WebGL scene, a configuration state tree bound to every material and decal, saved designs in the browser, and a share action.
Built with
- Three.js
- WebGL
- glTF
- Blender
- Vercel
Outcome
Live at motofig.com with one bike, full finish and graphics control, lighting and signal toggles, and shareable builds. Next: more models and street bikes.
Decisions
A browser app over a native or desktop tool
because a build should open on any phone in the garage with nothing to install.
Descriptive model names only over licensed branding
because the product is the configurator, not the marque, and it must grow past one manufacturer.
Design Exercises
Engineering studies as interactive 3D models. Current entry: a rooftop hydroponic garden that lowers to harvest height on demand.