Three.js Geometryvon CloudAI-X

Three.js Geometry Skill.

Wähle eine Formdarstellung, bevor du Oberflächengestaltung oder Animation hinzufügst.

3D
Three.js

OpenDesign herunterladen Nutzungsanleitung ansehen

Quellenprüfung · Three.js GeometrySKILL.md

Aufgabe 3D Ergebnis • Primitive, extrudierte oder benutzerdefinierte Geometrie • Geprüfte Attribute für Position, Normalen, Index und UVs • Ein Instancing- oder Merging-Plan für wiederholte Formen Vor dem Start Ein funktionierendes Three.js-Projekt mit Renderer; prüfe die Quellbeispiele anhand der installierten Version. Weitere Controls und Loader hängen vom gewählten Weg ab.

Redaktionelle Zusammenfassung · Quelle geprüft am 2026-10-07 · kein generiertes Beispiel

01 Funktionen

Three.js Geometry: Meshes und wiederholte Formen erstellen

Formkonstruktoren, benutzerdefinierte BufferGeometry-Attribute, Instancing, Geometrie-Hilfsfunktionen und Freigabe von Ressourcen.

Quellenbasierter AblaufKein Ausführungs-Benchmark

Die Arbeitsweise

Three.js Geometry behandelt Primitive, pfadbasierte Formen, benutzerdefinierte Vertex-Buffer, Punkte, Linien und wiederholte Meshes. Der Schwerpunkt ist strukturell: Positionen und Indizes, Oberflächennormalen, Texturkoordinaten und das Verhältnis zwischen geometrischem Detail und Rendering-Aufwand.

Die Quelle geht von Boxen und Kugeln über Extrusion, Tubes und Text bis zu InstancedMesh. Sie ist sowohl für das Erstellen einer eigenen Form als auch für die Diagnose aufwendiger Wiederholungen relevant. Das entstandene Mesh muss dennoch geprüft werden; Beispiele belegen kein produktionsreifes Asset.

Erwartete Ergebnisse

Primitive, extrudierte oder benutzerdefinierte Geometrie
Geprüfte Attribute für Position, Normalen, Index und UVs
Ein Instancing- oder Merging-Plan für wiederholte Formen

Beispielbriefing ansehen

Vom Briefing zur Prüfung

01
Darstellung wählen
Nutze ein Primitiv oder eine pfadbasierte Form, wenn sie die Form ausdrückt; benutzerdefinierte Buffer sind für feinere Kontrolle gedacht.
02
Mesh prüfen
Prüfe Maße, Dreiecksausrichtung, Normalen und Begrenzungen, bevor du das Material beurteilst.
03
Kosten der Wiederholung senken
Nutze passendes Instancing oder kompatibles statisches Merging und gib ungenutzte Geometrie frei.

02 Einsatzbereiche

Wann du ihn nutzen solltest

Ein funktionierendes Three.js-Projekt mit Renderer; prüfe die Quellbeispiele anhand der installierten Version. Weitere Controls und Loader hängen vom gewählten Weg ab.

Gut geeignet

Benutzerdefinierte FormenNützlich für extrudierte Profile, Drehformen, Tubes oder von Hand definierte Vertices.
Wiederholte ObjekteInstancing eignet sich für Kopien mit gemeinsamer Geometrie, aber unterschiedlicher Transformation oder Farbe.

Grenzen, die du prüfen solltest

Kein Sculpting-WerkzeugDer Skill liefert Codemuster, kein interaktives Modellierprogramm.
Detail ist nicht kostenlosMehr Segmente können die Silhouette verbessern, erhöhen aber den Rendering-Aufwand.

Diese Eingaben solltest du mitbringen

FormdefinitionGib Maße, Profilpunkte oder eine Formreferenz an.
Anforderungen an die OberflächeNenne die Anforderungen an Beleuchtung und Texturen.
WiederholungGib an, wie viele Objekte sich die Geometrie teilen und was variiert.

03 Wichtige Entscheidungen

Entscheidungen, auf die es ankommt

Topologie vor Erscheinungsbild
Fehlerhafte Attribute können wie ein Materialfehler wirken; prüfe zuerst die Mesh-Daten.
Kopien ohne Duplikate
Instancing ist eine eigene Darstellung für viele gleiche Formen.

04 Beispielbriefing

Ein fokussiertes Briefing ausprobieren

Das folgende Beispielbriefing wurde nicht getestet. Prüfe die Einrichtung des Skills, bevor du es verwendest.

Einrichtung prüfen

Nutze das passende threejs-skills-Verzeichnis als Anleitung für den Agenten. Es ist nicht die Three.js-Laufzeit und installiert keine Szenen-Assets.

Datei der Originalquelle

https://github.com/CloudAI-X/threejs-skills/blob/b1c623076c661fc9b03dac19292e825a5d106823/skills/threejs-geometry/SKILL.md

Ein funktionierendes Three.js-Projekt mit Renderer; prüfe die Quellbeispiele anhand der installierten Version. Weitere Controls und Loader hängen vom gewählten Weg ab.

Mit einem Ergebnis beginnen

Passe Umfang, Quellmaterial und Vorgaben in diesem Briefing an, bevor du den Skill ausführst.

Beispielbriefing

Nutze threejs-geometry, um Präsentationsständer aus diesem Profil zu bauen. Wähle Extrusions- oder Drehgeometrie, prüfe Normalen und Begrenzungen und nutze Instancing, wenn die Ständer ein Mesh teilen. Erkläre, welche Parameteränderungen einen Neuaufbau der Geometrie erfordern.

Ergebnis prüfen

Prüfe das tatsächliche Ergebnis anhand dieser beobachtbaren Kriterien.

Die Silhouette folgt dem Eingabeprofil.
Normalen und Begrenzungen bleiben nach Änderungen konsistent.
Wiederholte Objekte nutzen eine begründete Darstellung.

OpenDesign bietet einen lokalen Design-Arbeitsbereich für Coding-Agenten. Diese Auflistung bedeutet nicht, dass der Skill mitgeliefert wird oder dass externe Tools, Zugangsdaten und Softwareabhängigkeiten enthalten sind.

OpenDesign herunterladen Schnellstart lesen

05 Quelle und Lizenz

Quelle und Lizenz

Diese Seite beschreibt die unten verlinkte, festgelegte Quellversion. Verhalten und Anforderungen im Upstream können sich ändern.

Quelleninhaber: CloudAI-X
Repository: CloudAI-X/threejs-skills
Skill-Datei: skills/threejs-geometry/SKILL.md
Lizenz: Nicht bestätigt – prüfe vor einer Wiederverwendung die Upstream-Bedingungen.
Geprüfter Stand: 2026-10-07 · b1c623076c66

Redaktionelle Quellenzusammenfassung

Formkonstruktoren, benutzerdefinierte BufferGeometry-Attribute, Instancing, Geometrie-Hilfsfunktionen und Freigabe von Ressourcen.

Originalzusammenfassung von OpenDesign auf Grundlage der verlinkten Quelle. Repository-Sterne sind ein datiertes Popularitätssignal, keine Skill-Nutzung und keine Qualitätsbewertung.

06 Fragen vor dem Start

Fragen vor dem Start

Deckt er 3D-Text ab?

Ja. Die TextGeometry-Beispiele umfassen das Laden einer Schriftart, Bevel-Einstellungen und Zentrierung.

Wann ist Instancing sinnvoll?

Wenn Kopien dieselbe Geometrie teilen und sich durch Transformationen oder Farben pro Instanz unterscheiden.

Warum sollten Begrenzungen nach Vertex-Änderungen aktualisiert werden?

Die räumlichen Informationen müssen zu den geänderten Positionen des Meshes passen.

OpenDesign

Schaffe Raum für die nächste Design-Iteration.

Halte Briefing, Quellmaterial und Designarbeit in einem lokalen Arbeitsbereich zusammen. Prüfe die Einrichtung des Skills, bevor du ihn in deinen Workflow aufnimmst.

OpenDesign herunterladen Design-Skills durchsuchen