Interactive 3D flat

This project showcases a way to interact with 3D spaces using Three.js. The main goal was to create a 3D flat model with each room as a separate model, designed in Blender. Here's how the project came to life:

• Creating Models in Blender
  Each room was carefully modeled in Blender to ensure accurate representation of spaces, followed by detailed unwrapping for seamless integration.
• Baking Textures
  Textures were baked directly in Blender to achieve high-quality shadows and enhance realism.

• Preparing Configurable Objects for the Browser
  The 3D models were exported in a ".glb" format that allowed real-time manipulation and configuration through the web interface.

• Creating Configurable Walls with Shaders
  Walls in each room were rendered using custom fragment shaders, allowing users to dynamically modify their appearance. However, some walls were intentionally left non-configurable to align with the overall design choices.
• Adding Shaders for Advanced Customization
  Shaders were employed not only for wall customization but also to introduce advanced features like gradients, and texture overlays.

Users can browse through the rooms using a simple carousel with navigation arrows. This project shows how Blender and Three.js can work together to create interactive and customizable 3D spaces.