RoomFit

Problem

Freelance briefs for a web product configurator and "try in your room" AR were hard to show from a VR and Unity portfolio. I needed a live, mobile-first demo: configure a chair or sofa, see an illustrative IDR or USD price, save the look, and place it in a real room. Built as a Unity developer moving to web 3D entirely by prompting, with no backend, and with prices marked as illustrative.

Results

• Live at roomfit.barkahmauludi.com
• Chair and sofa (Poly Haven CC0); colour, finish, and size; illustrative IDR/USD price; save up to 10 looks in the browser; screenshot and share; EN/ID
• View in your room: WebXR hit-test on Android Chrome, USDZ Quick Look on iOS Safari; other browsers get a disabled control and a short explanation
• Mobile UI: pure-web-bottom-sheet, driver.js first-visit tour, safe-area
• Vitest, Playwright e2e, Lighthouse CI, deploy on Vercel
• Lighthouse mobile (source docs, M11, 3 runs): Performance 94 / 96 / 96 (median 96); Accessibility / Best Practices / SEO 100
• Built 100% by prompting (vibe coding)

Note

I built RoomFit as a portfolio demo while moving from Unity to web 3D. The whole app was made by prompting. Prices and specs are illustrative, not a shop catalogue.

Tech stack

• three.js
• JavaScript (ES modules)
• Vite
• WebXR
• pure-web-bottom-sheet
• driver.js