FoliMesh

Packs d'assets 3D de style Réaliste pour three.js

Ces packs s'exportent en GLB : l'import se fait avec GLTFLoader depuis three/addons, sans conversion ni retouche de shader. Les maillages LOD0–LOD3 se branchent dans THREE.LOD via lod.addLevel(mesh, distance), et le rendu change de niveau selon la distance caméra à chaque frame. N'ajoutez DRACOLoader ou KTX2Loader que si un fichier utilise réellement ces extensions.

Écorces PBR et cartes de feuilles en alpha test fonctionnent aussi bien avec WebGLRenderer qu'avec WebGPURenderer. Forêt tempérée et Forêt de conifères s'instancient bien avec InstancedMesh, tandis que BatchedMesh mélange plusieurs variantes d'arbres en un seul appel. THREE.LOD ne s'applique pas par instance : regroupez donc les instances par niveau et par chunk. Écorces et feuilles ont des matériaux séparés, ce qui garde les draw calls prévisibles, et les maillages de collision restent invisibles pour Rapier ou cannon-es. Adapté à la survie, aux mondes ouverts et aux jeux à la première ou troisième personne ; sur mobile, partez de LOD1 ou LOD2.

À propos du style Réaliste

Les modèles réalistes suivent le workflow PBR metal/roughness, lu directement par glTF 2.0, Unity, Unreal, Godot et three.js.

  • Écorce : textures de couleur, de normales et de rugosité sur le tronc et les branches.
  • Feuillage : cartes en alpha test (masked) avec des textures de grappes de feuilles, pas en alpha blend : elles écrivent la profondeur, ne demandent aucun tri et projettent des ombres correctes.
  • Écorce et feuillage ont des matériaux séparés : le nombre de draw calls reste prévisible et l’instanciation GPU fonctionne bien.
  • LOD0 sert aux plans rapprochés ; LOD1–LOD3 retirent branches et cartes de feuilles, le dernier niveau est assez léger pour le lointain.

Idéal pour les jeux à la première et à la troisième personne, la survie, les mondes ouverts et les simulateurs sur PC et console. Sur mobile, utilisez LOD1 ou LOD2 comme niveau le plus proche et surveillez l’overdraw du feuillage.

Utilisation dans three.js

Dans three.js, chargez le GLB avec GLTFLoader depuis three/addons ; ajoutez DRACOLoader ou KTX2Loader seulement si un fichier utilise ces extensions.

  • LOD par distance : THREE.LOD avec lod.addLevel(mesh, distance) pour LOD0–LOD3 ; le niveau change selon la distance à la caméra à chaque image.
  • Forêts : InstancedMesh dessine des milliers de copies en un seul draw call, et BatchedMesh mélange plusieurs variantes d’arbres. THREE.LOD ne s’applique pas par instance : regroupez vous-même les instances par LOD et par chunk.
  • Feuillage : l’alphaMode MASK de glTF devient material.alphaTest, et les matériaux double face reçoivent automatiquement side: THREE.DoubleSide.
  • Maillage de collision : gardez-le invisible et passez-le à une bibliothèque physique comme Rapier ou cannon-es.

Fonctionne avec WebGLRenderer comme avec WebGPURenderer.

Packs

Le même dans d'autres styles

Le même pour d'autres moteurs