🏡 Interactive 3D Kitchen Showroom

Showcase
, , , , , , ,
1

Live site: silktouchjoinery.com.au
Category: 3D Showroom | Configurator | Interior Visualization
Year: 2025
Location: Remote — Australia

1
1640×362 20.4 KB

Overview

This project is an interactive 3D kitchen showroom built for an interior design and joinery company. It allows users to explore a virtual kitchen, customize materials and finishes in real time, and visualize their design choices before placing an order.

Features

  • :house: Full 3D kitchen model designed by our modeling team.

  • :artist_palette: Configurable materials — users can select cabinet styles, change upper and lower cabinet colors independently, and choose between matte or high-gloss finishes.

  • :wood: Customizable elements — countertops, islands, flooring, and backsplash materials can all be changed separately.

  • :light_bulb: Realistic lighting & reflections — combines baked and dynamic lights for accurate shading and reflections.

  • :straight_ruler: Accurate dimensioning — measurements are calculated in real-world units for cost estimation and layout accuracy.

  • :person_walking: Walk-through mode — users can navigate the showroom freely with mouse or touch controls, simulating a real-life visit.

Technologies

  • Three.js – 3D rendering, lighting, and material system

  • GSAP –Camera animations

  • React.js – frontend framework and UI management

  • Blender / 3ds Max – 3D modeling and light baking

  • Figma – UI/UX design and prototyping

My Role

  • Three.js Developer: implemented model loading, material coordination, lighting setup (baked + dynamic), and real-time configurator logic.

  • Project Manager: coordinated between 3D artists, designers, and frontend developers to ensure a smooth production pipeline and visual consistency.

Technical Notes

The showroom uses GLTF models with baked lightmaps for static geometry, combined with dynamic lighting for reflections and highlights. All materials are physically-based (PBR) for realistic rendering. Texture management, optimized loading, and scene updates were implemented in Three.js with a strong focus on maintaining high performance on both desktop and mobile.

My LinkedIn: https://www.linkedin.com/in/parisa3d/

6 Likes
2

very good Parisa

1 Like
3

Thank you so much

4

Beautiful experience. Very intuitive. Runs smoothly.

  1. rotate portrait (nav menu) - width does not recalculate to 100%
  2. last icon (Z) - if selected and the masthead logo is touched, scene becomes unresponsive. One must click off to free roam icon.
  3. floor texture (G) - unavailable. Haha could there be a dynamic callback for inventory / load error.
1 Like