diff --git a/public/index.html b/public/index.html
index 1e662e368a2e8858922ce63bd92351801b36c174..f096dec05edc3cb69233bb01a6b3a2f3ac946cdb 100644
--- a/public/index.html
+++ b/public/index.html
@@ -84,8 +84,21 @@ async function activateXR() {
   roofGeometry.setIndex(new THREE.BufferAttribute(roofIndices, 1));
 
   // Create materials for walls and roof
-  var wallMaterial = new THREE.MeshBasicMaterial({ color: 0x8B4513, side: THREE.DoubleSide });
-  var roofMaterial = new THREE.MeshBasicMaterial({ color: 0xFF0000, side: THREE.DoubleSide });
+  var wallMaterial = new THREE.MeshPhysicalMaterial({
+    color: 0x8B4513,
+    metalness: 0.7, // Make it metallic
+    roughness: 0.4, // Adjust for shininess
+    clearcoat: 0.3, // Add clear coat for a polished effect
+    clearcoatRoughness: 0.1
+  });
+
+  var roofMaterial = new THREE.MeshPhysicalMaterial({
+    color: 0xFF0000,
+    metalness: 0.9, // Make it more metallic
+    roughness: 0.2, // Adjust for more shininess
+    clearcoat: 0.3,
+    clearcoatRoughness: 0.1
+  });
 
   // Create the wall and roof meshes
   var wallMesh = new THREE.Mesh(wallGeometry, wallMaterial);