로우폴리 야자수 three.js 모델 GLB

three.js용 로우폴리 스타일 야자수

로우폴리 야자수는 three.js 씬에 거의 손이 가지 않습니다. three/addons의 GLTFLoader로 GLB를 불러오고 LOD0–LOD3 메시를 THREE.LOD에 넘긴 뒤 lod.addLevel(mesh, distance)로 카메라 거리에 따라 매 프레임 세부 단계를 바꾸면 됩니다. 각진 느낌은 플랫 셰이딩과 정점 색상(COLOR_0)으로 만들어 텍스처가 필요 없고, 머티리얼 하나를 씬 전체가 공유합니다. 잎은 솔리드 지오메트리라 모바일 GPU에서 알파 테스트와 투명 오버드로가 발생하지 않습니다.

수록된 다섯 종은 코코넛 야자, 대추야자, 카나리아 야자, 워싱턴야자, 유럽부채야자입니다. LOD0 기준 삼각형 수는 수백에서 2천 개 정도이고, 피벗은 밑동에 있으며 보이지 않는 콜리전 메시는 Rapier나 cannon-es에 넘길 수 있습니다. InstancedMesh로 해안선을 채우고, BatchedMesh와 새 시드로 배치를 바꿔 보세요.

로우폴리 스타일 소개

로우폴리는 렌더링 비용과 빌드 용량 모두 가장 저렴한 스타일입니다.

플랫 셰이딩: 면마다 노멀 하나로 선명한 각진 느낌을 내며 노멀 맵이 필요 없습니다.
색은 버텍스 컬러(glTF COLOR_0)에 저장: 텍스처도, UV 작업도 없고 VRAM도 거의 쓰지 않습니다.
잎은 알파 카드가 아닌 실제 지오메트리: 알파 테스트와 투명 오버드로가 없어 모바일 GPU에 유리합니다.
씬의 모든 모델이 머티리얼 하나를 공유할 수 있어 나무를 쉽게 배칭·인스턴싱할 수 있습니다.
LOD0의 일반적인 예산은 수백에서 2천 개 정도의 삼각형입니다.

모바일, WebGL/WebGPU, VR, 전략, 도시 건설, 스타일라이즈드 인디 게임에 잘 맞습니다. 엔진에서는 버텍스 컬러를 곱하는 머티리얼을 사용하세요.

three.js에서 사용하기

three.js에서는 three/addons의 GLTFLoader로 GLB를 불러오며, DRACOLoader나 KTX2Loader는 파일이 해당 확장을 쓸 때만 필요합니다.

거리 기반 LOD: THREE.LOD에 lod.addLevel(mesh, distance)로 LOD0–LOD3을 등록하면 매 프레임 카메라 거리에 따라 단계가 바뀝니다.
숲: InstancedMesh는 수천 개의 복제본을 드로우 콜 하나로 그리고, BatchedMesh는 여러 나무 변형을 섞을 수 있습니다. THREE.LOD는 인스턴스 단위로 동작하지 않으므로 청크마다 LOD별로 인스턴스를 직접 묶으세요.
잎: glTF alphaMode MASK는 material.alphaTest로, 양면 머티리얼은 자동으로 side: THREE.DoubleSide가 됩니다.
콜리전 메시: 보이지 않게 두고 Rapier나 cannon-es 같은 물리 라이브러리에 넘기세요.