FoliMesh

3D-Modelle im Stil Low-Poly für three.js

Alle 42 Modelle kommen als GLB mit fertigen LOD0–LOD3: Sie laden sie mit dem GLTFLoader aus three/addons und übergeben die Stufen per lod.addLevel(mesh, distance) an THREE.LOD — die Detailstufe wechselt dann jeden Frame über die Kameradistanz. Blätter sind echte Geometrie statt Alpha-Karten, deshalb gibt es weder Alpha-Test noch transparentes Overdraw: Eiche, Waldkiefer, Birke und Bambus bleiben selbst auf mobilen GPUs günstig.

Die Farbe steckt in den Vertexfarben (COLOR_0), also deckt ein einziges gemeinsames Material alle Bäume, Kakteen und Felsen der Szene ab, und ein InstancedMesh zeichnet Tausende Kopien in einem Aufruf. Gruppieren Sie Instanzen pro Chunk, denn THREE.LOD greift nicht pro Instanz. Die Budgets liegen zwischen einigen Hundert und rund zweitausend Dreiecken auf LOD0. Die unsichtbare Kollisionsmesh geht direkt an Rapier oder cannon-es; alles läuft mit WebGLRenderer und WebGPURenderer.

Modelle
42
Detailstufen
LOD0 – LOD3
Formate
GLB · FBX · OBJ

Über den Stil Low-Poly

Low-Poly-Vegetation ist der günstigste Stil – beim Rendern wie bei der Build-Größe.

  • Flat Shading: eine Normale pro Fläche ergibt den klaren Facetten-Look, Normal Maps entfallen.
  • Die Farbe liegt in den Vertex-Farben (glTF COLOR_0): keine Texturen, keine UV-Arbeit, kaum Grafikspeicher.
  • Das Laub ist echte Geometrie statt Alpha-Cards: kein Alpha-Test und kein transparenter Overdraw – wichtig für mobile GPUs.
  • Ein einziges Material reicht für alle Modelle einer Szene, Bäume lassen sich daher leicht batchen und instanzieren.
  • Übliche Budgets für LOD0 liegen zwischen einigen hundert und rund zweitausend Dreiecken.

Passt zu Mobile, WebGL/WebGPU, VR, Strategie, Aufbauspielen und stilisierten Indie-Games. In der Engine ein Material verwenden, das mit der Vertex-Farbe multipliziert.

Verwendung in three.js

In three.js GLB mit dem GLTFLoader aus three/addons laden; DRACOLoader oder KTX2Loader nur ergänzen, wenn eine Datei diese Extensions nutzt.

  • Distanz-LOD: THREE.LOD mit lod.addLevel(mesh, distance) für LOD0–LOD3; die Stufe wechselt jeden Frame nach Kameraabstand.
  • Wälder: InstancedMesh zeichnet Tausende Kopien in einem Draw Call, BatchedMesh mischt mehrere Baumvarianten. THREE.LOD wirkt nicht pro Instanz, daher Instanzen pro Chunk selbst nach LOD gruppieren.
  • Laub: glTF-alphaMode MASK wird zu material.alphaTest, doppelseitige Materialien erhalten automatisch side: THREE.DoubleSide.
  • Kollisionsmesh: unsichtbar lassen und an eine Physik-Bibliothek wie Rapier oder cannon-es übergeben.

Funktioniert mit WebGLRenderer und WebGPURenderer.

Pakete

Weitere Kategorien

Dasselbe in anderen Stilen

Dasselbe für andere Engines