[For Hire] Three.js / R3F product configurators — and getting them under 3 MB

I build real-time 3D product configurators for the browser, and the part I care most about is whether they actually load.

Live: https://3d-bay-ten.vercel.app

Orbit a sneaker, switch colourways and materials, export a render, priced options updating a cart total as you go — client side, no page reloads, no plugin.

The two problems I solved in it

Weight. The source model was 16.7 MB. On a mid-range Android on mobile data that is not a slow experience, it is an abandoned one. Draco plus re-authored textures took it to 2.4 MB — an 86% cut. I measure the split with gltf-transform inspect before touching anything, because on most models the textures are the problem and Draco alone will not save you.

Colour. Multiplying a tint over a baked texture drags everything flat — the fabric weave disappears and the baked shadows go muddy. I separate luminance from chroma and replace only the chroma, masked by the texel’s own saturation so white midsoles and metal eyelets stay neutral. A red colourway reads as the same shoe in red, not a red silhouette.

What I do

  • Three.js, React Three Fiber, WebGL, GLSL
  • glTF optimisation: Draco, KTX2/Basis, texture re-authoring, LODs
  • Next.js, TypeScript, GSAP, Lenis
  • Full stack when the configurator needs a product page around it: Node, PostgreSQL, Prisma, auth, checkout, admin

How I work

Written scope before any code. A live link from the first milestone, updated as I go. Progress in writing rather than standing calls — I am GMT+6, so you get updates while you sleep.

Available now for freelance and white-label work, and open to a longer remote engagement.

Portfolio: rifatsarkerraju.com
Code: Raju0131 (Md. Raju Ahmed) · GitHub

Md. Raju Ahmed — Rajshahi, Bangladesh