More Infos
We use cookies on our website. Some are essential, while others help us improve the site and your experience.
To the Privacy Policy

3D Product Configurator for Garden Sheds, Garages or Pool Houses


Summerwood Products, Canada

Garden sheds Manufacturer

Timber Construction/Trade


React, TypeScript

Rhino CAD with Grasshopper Script

WebGL, Threejs


2D & 3D product configurators

UX & UI design

software development

A 3D Configurator replaces the 2D Custom Design Center

To configure the new garage, the new garden or pool sheds completely online according to ones individual wishes and to see it immediately in real time, is now possible with the company Summerwood Products from Canada. The individually assembled products are visualized photorealistically in 3D and can be ordered directly via the online store.

Summerwood company designs and builds exclusively manufactured garden sheds and pool sheds, garages and pavilions that will give their customers a lifetime of pleasure. There are a wide variety of variants in the categories of style, size, materials and accessories for the individual dream home. Summerwood wanted to replace the existing 2D model with a new 3D configurator in order to present the possibilities of individual mass production (mass customization) in the best possible way and to meet the trend towards the latest visual commerce technologies. A photorealistic 3D representation was extremely important to our customer. The 3D product visualization based on Shapediver/Grasshopper technology and the possibility of a 360-degree view will delight users of the Summerwood product configurator.


The customer can put together his product online in the Custom Design Center on the website, whether garden or pool shed, garage or pavilion himself and around the clock according to his wishes and requirements.

The configuration takes place in 4 steps:

Choice of house type (garden shed, garage, pool shed, workshop, cottage, home studio) and style (over 60 variants available) Configuration of size Choice of materials and colors Adding options such as doors (over 160 variants), windows (over 230 variants), handles and delivery/assembly

This results in millions of ways to customize your garden shed. Incorrect configurations are prevented by plausibility and completeness checks. In the background, the system calculates the binding prices and displays them in an overview of offers in a shopping cart. Every change is visually adjusted to the 3D model within a few seconds and the price is also recalculated. The finished product can be definitively purchased via an interface to the online shop. A Summerwood specialist will contact the customer within 24 hours to discuss and record any last change requests.

The technical solution design was chosen in such a way that the 3D configurator could be integrated both on the website next to the online shop and in the Summerwood customer portal. In addition, configurations can be saved at any time and reloaded by the customer at a later point in time. According to the “user generated content“ approach, customers can present the garden house they have bought on the Summerwood website. In this way, other potential customers can choose from over 1000 purchased configurations and continue to configure from there.


After recording the project requirements and defining the scope for this generically programmed, individually tailored configurator, Sitewerk's design department got to work. The user interface of the product configurator should be designed in an appealing way for the user, arouse emotions and be intuitive to use. Summerwood operates the configurator using a content management system. An administrator can independently change and add new products, prices and rules. In the background, the configurator solution creates detailed bills of materials, which digitizes, accelerates and makes the ordering process from customer input to purchase more efficient.

Future plans

Our digital solutions are modular and expandable. Summerwood has a lot of plans for the further development of their new 3D product configurator. In the near future, the automated generation of production data such as CAD plans and cut lists for the CNC machine will be implemented. This would digitize the ordering and production process seamlessly end-to-end. Augmented reality visualization of the configured houses is also on the wish list. This allows users to view their home in the actual environment. Furthermore, the performance and the loading times of the configurator should be continuously worked on.

The heart of the configurator are independent parametric 3D models (based on Rhino CAD, Grasshopper Plugin) for the building type, the windows and the doors. With the help of ShapeDiver's 3D solution, a 3D visualization is created within a React application. Care was taken to ensure that the configurator is implemented generically so that an administrator can enter new models independently.

The configurator is seamlessly integrated into the existing online shop and communicates with a cloud-enabled backend via a REST interface.


  • 3D product configurator
  • Parametric and extensible 3D model
  • Drag and drop, snapping and collision detection
  • Individual design of the dream garden shed
  • price calculation
  • Online shop and MIS integration
Create a 100% Digital Sales Process with 35% Less Cost of Sales with Configurators!

Create a 100% Digital Sales Process with 35% Less Cost of Sales with Configurators!

Have you already thought about using configurators? But don't know how to start... Then download our free guide and learn important key questions from practice.

Configurators: What types are there and how does your company benefit from them?

Configurators: What types are there and how does your company benefit from them?

The desire for individualized products and services is increasing. It is no longer just about consumer goods, but also about capital goods. With a product configurator, also known as a configurator or variant configurator, almost any product, including services, can be conveniently configured from home. Here we present different types of product configurators.

Let's Realize a New Project Together