Technical Implementation & WebXR

How to configure an interactive project generator using npm create @iwsdk for an AR app?

iwsdk, npm, webxr, scaffolding

Run 'npm create @iwsdk@latest' to scaffold a new WebXR project. The CLI walks you through selecting AR vs VR mode, choosing a rendering engine (Three.js or Babylon.js), and configuring build tools. The generated project includes hit testing, surface detection, and 3D model loading pre-configured. From there, customize the scene to load your property models and implement interaction handlers specific to your real estate use case.

iwsdknpmwebxrscaffolding

Was this article helpful?

Back to Knowledge Base

Related Articles

Technical Implementation & WebXR

How to completely fix tripod shadows and the nadir in a 360 real estate virtual tour?

The nadir (bottom blind spot showing the tripod) is fixed through several methods: automated AI nadir patching tools in platforms like Matterport handle it automatically. For manual workflows, use Photoshop's clone stamp on the equirectangular projection, or capture an extra handheld shot looking down from each position and composite it in. Some photographers also use nadir caps — pre-made branded images that cover the tripod position.

Technical Implementation & WebXR

Why are the vertical lines converging in my real estate 360 panoramic interior photos?

Converging verticals in 360 panoramas are caused by lens distortion and imprecise leveling of the camera during capture. The 360 camera must be perfectly level (use a leveling base or tripod with bubble level). In post-processing, apply tilt-shift corrections in PTGui or your stitching software. Some cameras offer in-camera horizon leveling that corrects minor misalignment automatically during capture.

Technical Implementation & WebXR

How to optimize a large 3D real estate Gaussian Splat model to load faster on mobile browsers?

Gaussian Splatting models can be massive. Optimize by: reducing splat count through decimation while preserving visual quality, implementing level-of-detail (LOD) streaming that loads nearby detail first, compressing the point cloud data with quantization, and using progressive loading so users see a coarse preview within seconds while full detail streams in the background. Three.js and custom WebGL shaders are the primary tools for browser-based splat rendering.

Technical Implementation & WebXR

What causes severe stitching errors when capturing a 3D virtual tour in a narrow hallway?

Narrow hallways create parallax errors because nearby surfaces shift dramatically between the camera's multiple lenses. The stitching algorithm struggles when objects are very close to the camera (under 1–2 meters). Solutions: position the camera in the center of the hallway, use a lens with less parallax offset, capture more positions closer together, and in post-production use parallax-aware stitching software that handles close-range geometry.