LumaSpace

Inspiration

Furnishing a room today means juggling Pinterest for inspiration, a dozen retailer tabs for prices, a spreadsheet for the budget, and a separate checkout per store—with nothing that understands your space, your style, and your spending rules at the same time. Room planners stop at visualization or a shopping list. AI shopping demos stop at recommendations. We wanted one closed loop: design the room, find real products, hit a budget, and check out under rules a human actually authorizes.

That gap—agentic spatial commerce—is what became LumaSpace.

What it does

LumaSpace turns a photo of an empty room into a budget-aware, multi-store purchase:

Capture — upload a room photo (or start with a demo room)
Inspire — pull style from a curated look, a Pinterest/retailer link, or an uploaded inspo image
Personalize — edit a live 3D scene; chat with specialist agents; shop real products via live web search
Budget — the Budget Agent swaps tiers to hit a target spend while preserving style fit
Quote — multi-store line items, totals, and a coherent room-level quote
Checkout — a Finance Agent places orders under a spending mandate (total limit, per-item cap, auto-approve threshold, allowed merchants)

Six agents work the room together—Design, Product, Budget, Comparison, Quotation, Finance—each visible and explainable. Within your mandate, LumaSpace can pay autonomously on Visa’s CyberSource sandbox (real transaction IDs, invoices, refunds). Outside those limits, it escalates: Approve / Skip / Find cheaper. No silent overrides.

How we built it

Frontend: React + Vite + Tailwind; editable 3D room with React Three Fiber
Agent brain: Claude Sonnet tool-calling (typed tools for swap, shop live, optimize budget, navigate, speak as a specialist, etc.), with a deterministic keyword fallback so the app never breaks if the LLM is down
Live commerce: Apify actors for Google Shopping search, inspiration scraping, and product image generation
Vision: OpenRouter vision-language model for style-fit judgments on real product photos
Payments: CyberSource (Visa Acceptance Solutions) sandbox via official REST SDK—real authorize + refund paths, not a mocked success state
Architecture: shared React Context as single source of truth for room / budget / cart / mandate; API secrets stay server-side behind a Vite BFF proxy

Demo: https://www.youtube.com/watch?v=k5uv0PpnAdA
Code: https://github.com/Mahak202/cal-hacks-13.0

Challenges we ran into

Closing the loop, not just the UI — tying 3D objects ↔ live product URLs ↔ prices ↔ mandate decisions ↔ real sandbox payments without losing context
Multi-merchant checkout — one room, many stores; grouping orders while keeping one coherent shopper experience
Trustworthy autonomy — building mandate guardrails in code (not just prompts) so the Finance Agent cannot silently overspend
Honest AI — making agent badges, swap reasons, and approval/skip rationale visible instead of a black-box chat
Hackathon realism — sandbox payments, stylized 3D geometry, and live prices that still need retailer re-check in production

Accomplishments that we're proud of

An end-to-end flow that actually designs, shops, budgets, and pays—not a recommendation mock
Budget as a design constraint, not a warning banner—the room composition changes to fit the number
Mandate-bounded autonomy with human escalation and a full audit trail
Judge-verifiable payments: live CyberSource sandbox transaction IDs and refunds
Three real AI systems doing real work: tool-calling LLM, vision on product photos, and bounded payment decisioning

What we learned

Integration is the product. 3D planners, shopping search, and AI chat already exist separately; the hard (and novel) part is keeping room intent continuous through discovery, decision, budget, and transaction. We also learned that responsible agent commerce means authority boundaries in the system, explainability in the UI, and reversible money movement—not “trust the model.”

What's next for LumaSpace

Loyalty / rewards wired into the same mandate + Budget Agent math
Order tracking and a returns copilot on the existing audit-log pattern
Production Visa rails under the same mandate/audit architecture
Photoreal product models in the 3D scene
A merchant-side demand dashboard from live search hits and AI-generated custom-item requests