Modèles 3D low-poly pour three.js

Modèles 3D de style Low-poly pour three.js

Les 42 modèles sont livrés en GLB avec les niveaux LOD0–LOD3 : chargez-les avec GLTFLoader depuis three/addons, puis passez les niveaux à THREE.LOD via lod.addLevel(mesh, distance) — le détail change à chaque image selon la distance caméra. Les feuilles sont de la géométrie pleine, pas des cartes alpha : aucun alpha test, aucun overdraw transparent. Le chêne, le pin sylvestre, le bouleau et le bambou restent donc légers même sur GPU mobile.

La couleur est portée par les vertex colours (COLOR_0) : un seul matériau partagé suffit pour tous les arbres, cactus et rochers de la scène, et un InstancedMesh dessine des milliers de copies en un appel. Regroupez les instances par chunk, car THREE.LOD ne s'applique pas par instance. Le budget va de quelques centaines à environ deux mille triangles en LOD0. Le maillage de collision invisible se branche sur Rapier ou cannon-es, et tout fonctionne avec WebGLRenderer comme avec WebGPURenderer.

À propos du style Low-poly

Le low poly est le style le moins coûteux, au rendu comme en taille de build.

Flat shading : une normale par face donne l’aspect à facettes net ; pas de normal maps.
La couleur est dans les sommets (glTF COLOR_0) : pas de textures, pas de travail d’UV, presque pas de mémoire vidéo.
Le feuillage est de la vraie géométrie, pas des cartes alpha : ni alpha test ni overdraw transparent, ce qui compte sur les GPU mobiles.
Un seul matériau peut servir à tous les modèles de la scène, les arbres se batchent et s’instancient facilement.
Les budgets typiques vont de quelques centaines à environ deux mille triangles au LOD0.

Adapté au mobile, à WebGL/WebGPU, à la VR, aux jeux de stratégie, aux city builders et aux jeux indés stylisés. Dans le moteur, utilisez un matériau qui multiplie par la couleur de sommet.

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.