Project example · Modern web and 3D integration

Interactive apartment navigator – from 3D selection to detailed apartment views

For a real-estate project, a reusable browser-based apartment navigator was developed that combines interactive 3D selection with apartment lists, filters, variants, floor plans, and detailed information.

The widget is designed for desktop and mobile, can be embedded cleanly into existing websites, and can load its project data and assets across domains.

Interactive apartment navigator with 3D building view, filters, and apartment details

3D, business logic, and website integration in one widget

The 3D view is more than a visualization: apartments can be selected directly within the building. The 3D view, apartment list, detail view, and public widget API all use the same central state so that selection, filters, variants, and status remain consistent.

The technical implementation includes Vue 3, TypeScript, Vite, Pinia, Three.js, and Gaussian Splat, together with Shadow DOM encapsulation for safe embedding in third-party websites. Architecture, data model, responsive behavior, cross-domain integration, testing, debugging, and deployment were part of my technical responsibility.

What the project demonstrates technically

Vue 3 / TypeScript frontend with a central Pinia state for selection, filters, sorting, views, and project switching.

Interactive 3D selection using Three.js, Gaussian Splat, and separate GLB geometries for mapping and selection.

Synchronization of 3D, apartment list, detail view, and public JavaScript API without parallel state models.

Embeddable IIFE widget with its own Shadow DOM to protect against CSS conflicts with the host website.

Responsive desktop and mobile interfaces plus cross-domain loading of the widget, project data, and assets.

Project validation, 12 regression tests, TypeScript checks, and build verification as a fixed part of the production build.

Planning a similar web, integration, or 3D project?

If an existing website, business application, or visualization needs a modern interactive interface, we can first clarify the most suitable technical approach without obligation.

Free initial assessment