Snap your room. Gemma 4 maps it, critiques it, and drops matching 3D furniture into it with WebAR.

DESAINAR (Desain + AI + AR) is a no-install web app for room makeovers, built around Gemma 4’s vision.

What it does

1. Take a photo of a room and pick a style: Japandi, Modern, Industrial or Mid-Century.
2. Gemma 4 returns the room type and scale, then draws an AI Spatial Analysis on the photo: the dominant wall, the main light source and the empty floor zones that can take new furniture.
3. It reads the room’s 60-30-10 colour palette, suggests two wall paints, writes a short designer critique and scores how close the room is to the chosen style.
4. It picks four pieces from our 3D furniture catalog, each with a reason and a placement guide such as “on the empty floor in front of the yellow chair”.
5. View in Your Room places them at true 1:1 scale with WebAR (Android WebXR / Scene Viewer, iPhone Quick Look). The AI Design tab paints an “after” concept from a prompt Gemma writes.

How we used Gemma 4

• gemma-4-26b-a4b-it (MoE, about 4B active parameters) is the fast default; gemma-4-31b-it (dense) is a Deep mode you can switch to in the app.
• Each photo runs two Gemma calls in parallel with JSON mode: room and colour analysis, and catalog picks plus the render prompt.
• Gemma can only recommend furniture ids from our catalog, and the server validates every value (coordinates, hex colours, ids) before the UI uses it, so every suggestion can really be placed in AR.

Open source

• Open-weight AI: Gemma 4 for the analysis, and an open text-to-image model on Pollinations for the concept renders.
• Code under the MIT License, 12 furniture models from Poly Haven (CC0), and AR with Google’s open-source <model-viewer>.
• Stack: React, Vite and Tailwind CSS, with a Vercel Function that keeps the API key on the server.

Challenges

• Under hackathon load one Gemma analysis took 20–26 s. We split it into two leaner parallel calls with a 55 s budget and retries, and Deep mode falls back to Instant when the 31B model is busy.
• The free image service allows one image per 45 s per IP and replies with an error image when the quota runs out, so we validate responses and request renders from the viewer’s own browser first.

What we learned

• Output length, not the photo, drives Gemma’s latency, so a lean JSON schema matters.
• Valid JSON isn’t trustworthy data: validate and fill gaps on the server.

What’s next

Edit the user’s own photo for the “after” image, add beds and floor lamps to the catalog, place several pieces in one AR session, and link to shops.

Before the event we only sketched the idea and a design mockup; all code was written during the hack day, with Claude Code as our AI coding assistant.