Skip to content
Melanie E. Magdalena
consulting Interior Design West Yorkshire, United Kingdom Complete

Clear CGI Room Configurator

Built a multi-tenant product visualization platform using layered CGI compositing and Airtable as client-managed CMS backend — 4 active product line configurations with real-time image rendering across 3 viewing angles and composite image export with parts list for sales handoff.

Timeline

2020

Configurations

4 active product lines · client-managed

Viewing angles

3 per configuration · real-time layer compositing

Via

Deytah

Operational Impact

Gave a hardware company's customers spatial knowledge they couldn't get from a catalog — enabling purchase confidence without a showroom visit. The multi-tenant architecture meant the client could extend the platform to new product lines independently, without new development work. The export function collapsed the gap between product selection and purchase order into a single downloadable image.

The Problem

Selling physical hardware — curtain poles, bathroom fixtures, kitchen fittings — has a visualization problem. The buyer needs to know what a matte black finial looks like with a particular bracket and ring combination before committing to an order. Swatches and catalog photos don't answer that question. A showroom visit answers it, but not every customer goes to a showroom.

The client had professional CGI renders of their products. The question was how to make those renders interactive without rebuilding a custom application for every product line.

The System

The configurator works by compositing layers. Each selectable option in each category is a perspective-matched CGI image that loads on top of a base scene — so when a customer switches from a round finial to a square one, the image updates instantly without re-rendering anything. The three viewing angles (Side Low, Straight, Side High) each have their own layer set, giving the customer a realistic sense of how the complete installation will look from different positions in the room.

The Airtable backend is what makes it multi-tenant. Each client manages their own product table — images, labels, categories, ordering — without touching the application code. New products get added through Airtable. The application reads the current state of the table and displays accordingly.

The export function closes the loop. A customer finishes configuring, downloads the composite image, and hands it to whoever is ordering the hardware — with the selected parts listed directly on the image. The visualization tool becomes a sales document.

The Result

Four active client configurations, all still running. The clients are managing their own product data. No developer intervention required for routine updates.

The Systems Lesson

The most reusable system is one that separates the structure from the content. The configurator's architecture doesn't know anything about curtain poles specifically — it knows how to composite layers, read options from a table, and export a composite. The client fills in the content. That separation is what made it possible to deploy four different product lines from one codebase.

← Back to All Work Next project → MIT Innovation ONE