FoliMesh

Packs de assets 3D estilo Realista para three.js

Os packs saem em GLB, então a importação é só GLTFLoader de three/addons, sem converter nada nem mexer em shader. Os meshes LOD0–LOD3 entram no THREE.LOD com lod.addLevel(mesh, distance), e o renderer troca de nível pela distância da câmera a cada frame. Só adicione DRACOLoader ou KTX2Loader se algum arquivo realmente usar essas extensões.

Casca PBR e cartões de folhas com alpha test rodam tanto no WebGLRenderer quanto no WebGPURenderer. Floresta temperada e Floresta de coníferas vão bem com InstancedMesh, e o BatchedMesh mistura várias variações de árvore numa chamada só. Como o THREE.LOD não vale por instância, agrupe as instâncias por nível em cada chunk. Casca e folhas têm materiais separados, o que mantém a contagem de draw calls previsível, e os meshes de colisão ficam invisíveis para Rapier ou cannon-es. Serve para survival, mundos abertos e jogos em primeira ou terceira pessoa; no mobile, comece do LOD1 ou LOD2.

Sobre o estilo Realista

Os modelos realistas usam o fluxo PBR metal/roughness, lido diretamente por glTF 2.0, Unity, Unreal, Godot e three.js.

  • Casca: mapas de cor, normais e rugosidade no tronco e nos galhos.
  • Folhas: cards com alpha test (masked) e texturas de cachos de folhas, sem alpha blend: escrevem profundidade, não precisam de ordenação e projetam sombras corretas.
  • Casca e folhas usam materiais separados, então o número de draw calls é previsível e o instancing na GPU funciona bem.
  • LOD0 é para close; LOD1–LOD3 removem galhos e cards de folhas, e o último nível é leve o bastante para longas distâncias.

Ideais para jogos em primeira e terceira pessoa, sobrevivência, mundo aberto e simuladores em PC e console. No celular, use LOD1 ou LOD2 como nível mais próximo e fique de olho no overdraw da folhagem.

Como usar em three.js

No three.js, carregue o GLB com GLTFLoader de three/addons; adicione DRACOLoader ou KTX2Loader só se o arquivo usar essas extensões.

  • LOD por distância: THREE.LOD com lod.addLevel(mesh, distance) para LOD0–LOD3; o nível muda conforme a distância da câmera a cada frame.
  • Florestas: InstancedMesh desenha milhares de cópias em um único draw call, e BatchedMesh mistura várias variações de árvores. THREE.LOD não atua por instância, então agrupe você mesmo as instâncias por LOD em cada chunk.
  • Folhas: o alphaMode MASK do glTF vira material.alphaTest, e materiais de dupla face recebem side: THREE.DoubleSide automaticamente.
  • Malha de colisão: deixe invisível e passe para uma biblioteca de física como Rapier ou cannon-es.

Funciona com WebGLRenderer e com WebGPURenderer.

Pacotes

O mesmo em outros estilos

O mesmo para outras engines