Jan Janusz
← All case studies
3D ConfiguratorOutdoor / Home & Garden

Pergola Configurator with AR Preview

Compose a bioclimatic pergola — louvre walls, fabric screens, glazing — and preview it in AR.

Pergola manufacturer (via agency)
Full wall-infill range configurable: louvre panels, fabric screens, glass doors
AR preview — customers see the configured pergola in their own garden
Runs in the browser, embedded on the manufacturer's site — no app install
Delivered end-to-end as a subcontract for a digital agency

Overview

A browser-based 3D configurator for aluminium pergolas, built for a manufacturer's website. Customers assemble the pergola structure and choose wall infills for each side — louvre (lamella) panels, decorative fabric screens, or glass sliding doors — with every choice rendered in real time. An AR preview lets them place the configured pergola in their own garden using a phone.

The Challenge

A pergola is a modular product: the same frame accepts different infill systems per wall, and every combination has to look right from any angle — including up close, where materials like woven fabric screens must read believably. The experience also had to run inside a regular product page and hand off seamlessly to AR on mobile.

The Solution

Built the configurator in Three.js with a modular wall-slot system: each side of the frame accepts interchangeable louvre, fabric or glazing modules. Detailed materials (woven textile patterns, glass, powder-coated aluminium) keep close-up shots convincing. The configured model can be viewed in AR on the customer's phone, placed true-to-scale on their terrace.