Skip to content
3D Product Configurator

Outer

3D Outdoor Furniture Configurator

A 3D product configurator for exploring outdoor furniture in context.

REAL PROJECT DEMO

Recorded from the live project.

Project Overview

Configure modular outdoor furniture in the browser, explore product combinations, switch fabric choices, and view the result from different perspectives.

This project brings outdoor furniture configuration into an interactive 3D scene. Visitors can work through product options while seeing the configured arrangement directly in the scene.

Project requirements

  • Present an outdoor furniture system whose value depends on how modules, fabrics, and accessories combine, not on a single product photo.
  • Let a buyer assemble a configuration and see the combined result as one scene rather than as separate product images.
  • Keep the existing product catalogue, option structure, and commerce process intact — the 3D experience had to fit the business that was already running.
  • Work inside the client's existing Shopify environment, where products, options, variants, SKU, inventory, pricing, and discount rules are already managed.

Experience Highlights

  • Guided configuration flow
  • Modular seating options
  • Fabric choices
  • Tables and accessories
  • Multiple camera views
  • Interactive 3D scene exploration

How the Experience Works

1) Start with the guided configuration flow. 2) Explore the furniture combination. 3) Switch fabric choices. 4) Add tables and accessories. 5) Review the configured scene from different camera views.

What We Built

We built the interactive 3D layer that connects product selection with a visual outdoor scene, so configuration choices can be understood in the same context as the product itself.

Why This Format

Outdoor furniture is judged partly by how pieces combine and occupy a space. Showing the configuration inside an interactive scene makes the relationship between individual choices and the overall arrangement easier to understand than isolated product images.

Project deliverables

  • A custom 3D configuration page for the outdoor furniture range, delivered for the browser.
  • A guided configuration flow covering modular seating, fabric selection, and tables or accessories.
  • Multiple viewing angles so a configuration can be inspected as a scene rather than from one fixed camera.
  • A mapping layer between the 3D options and the client's existing Shopify product options and variants.
  • Project source code and project source files, delivered within the boundary agreed in the contract.

What this project demonstrates

This project shows how a custom 3D configuration experience can sit on top of commerce infrastructure that already works. The client kept the Shopify back office that manages products, options, variants, SKU, inventory, pricing, and discount rules; INTR built the interactive 3D layer and the mapping between the two. It was not a rebuild of the store, and it is not a generic Shopify app or an off-the-shelf plugin.

Integration context: the client's Shopify environment remains the system of record for products, options, variants, SKU, inventory, pricing, and discount rules. The custom 3D page connects to that structure rather than replacing it, so the commerce process continues to run on the platform the business already operates.

Technical Notes

Browser-based interactive 3D experience.

Shopify Implementation Note

Beyond this visual case, Outer’s store also carries a custom 3D configurator built on the product setup already running in Shopify. The technical case study covers how existing product options were mapped to new 3D controls, how the three-step selection flow is organised, and what is handed over at the end of the project.

Read the Outer Shopify configurator case study

Planning a 3D product configuration experience?

We design and develop custom interactive 3D web experiences for product configuration, visualization, digital product communication, and interactive product experiences.

Reply within 1 business day · GMT+8