Update game.js

game.js

@@ -326,20 +326,29 @@ class Game {
 
     async initialize() {
     try {
-        // 안개 효과 조정
-        this.scene.fog = new THREE.Fog(0xC2B280, 50, 250); // 안개 시작 거리를 늘리고 끝나는 거리도 증가
-        this.scene.background = new THREE.Color(0x87CEEB); // 하늘색 배경
+        // 안개 효과를 더 멀리 설정하고 밝기 조정
+        this.scene.fog = new THREE.Fog(0xC2B280, 100, 500); // 안개 시작 거리와 끝 거리를 늘림
+        this.scene.background = new THREE.Color(0x87CEEB);
 
-        const ambientLight = new THREE.AmbientLight(0xffffff, 1.0); // 주변광 강도 증가
+        // 주변광 강화
+        const ambientLight = new THREE.AmbientLight(0xffffff, 1.5); // 주변광 강도 증가
         this.scene.add(ambientLight);
 
-        const directionalLight = new THREE.DirectionalLight(0xffffff, 1.2); // 태양광 강화
-        directionalLight.position.set(50, 50, 50);
+        // 태양광 설정 개선
+        const directionalLight = new THREE.DirectionalLight(0xffffff, 1.5); // 태양광 강도 증가
+        directionalLight.position.set(100, 100, 50);
         directionalLight.castShadow = true;
-        directionalLight.shadow.mapSize.width = 2048;
-        directionalLight.shadow.mapSize.height = 2048;
+        directionalLight.shadow.mapSize.width = 4096; // 그림자 해상도 증가
+        directionalLight.shadow.mapSize.height = 4096;
+        directionalLight.shadow.camera.near = 0.5;
+        directionalLight.shadow.camera.far = 500;
+        directionalLight.shadow.bias = -0.0001; // 그림자 아티팩트 감소
         this.scene.add(directionalLight);
 
+        // 보조 조명 추가
+        const hemisphereLight = new THREE.HemisphereLight(0xffffff, 0xD2B48C, 1.0);
+        this.scene.add(hemisphereLight);
+
         // 사막 지형 생성
         const groundGeometry = new THREE.PlaneGeometry(MAP_SIZE, MAP_SIZE, 200, 200);
         const groundTexture = new THREE.TextureLoader().load('/textures/sand.jpg');
@@ -349,34 +358,34 @@ class Game {
         // 사막 재질 개선
         const groundMaterial = new THREE.MeshStandardMaterial({ 
             map: groundTexture,
-            color: 0xD2B48C,
-            roughness: 1.0,
-            metalness: 0.0,
-            bumpScale: 0.5
+            color: 0xDEB887, // 더 밝은 색상으로 변경
+            roughness: 0.8,
+            metalness: 0.1,
+            bumpScale: 0.3,
+            emissive: 0x222222, // 약간의 발광 효과 추가
         });
 
         const ground = new THREE.Mesh(groundGeometry, groundMaterial);
         ground.rotation.x = -Math.PI / 2;
         ground.receiveShadow = true;
 
-        // 사막 지형의 기복 추가
+        // 지형의 기복 추가 (더 낮은 높이로 조정)
         const vertices = ground.geometry.attributes.position.array;
         let seed = Math.random() * 100;
         for (let i = 0; i < vertices.length; i += 3) {
-            // Perlin noise를 사용한 자연스러운 높낮이
             const x = vertices[i] / 100;
             const y = vertices[i + 1] / 100;
             vertices[i + 2] = 
-                (Math.sin(x + seed) * Math.cos(y + seed) * 2.0) + // 큰 언덕
-                (Math.sin(x * 2 + seed) * Math.cos(y * 2 + seed) * 1.0) + // 중간 크기 언덕
-                (Math.sin(x * 4 + seed) * Math.cos(y * 4 + seed) * 0.5); // 작은 모래 언덕
+                (Math.sin(x + seed) * Math.cos(y + seed) * 1.0) + // 더 낮은 언덕
+                (Math.sin(x * 2 + seed) * Math.cos(y * 2 + seed) * 0.5) + 
+                (Math.sin(x * 4 + seed) * Math.cos(y * 4 + seed) * 0.25);
         }
         ground.geometry.attributes.position.needsUpdate = true;
         ground.geometry.computeVertexNormals();
 
         this.scene.add(ground);
 
-        // 사막 장식물 추가
+        // 나머지 초기화 코드...
         await this.addDesertDecorations();
         await this.tank.initialize(this.scene, this.loader);