- Virtual Reality, Augmented Reality und 3D News ❤ r23 - https://blog.r23.de -

Blender Tutorial: Erstellen eines Navigationsnetzes für eine WebVR-Szene

Unser erstes Navigationsnetz, vor der Säuberung.

Dieses Tutorial zeigt, wie du ein Navigationsnetz für eine Szene mit Blender erstellt und es in A-Frame verwendest, um eine grundlegende Pfadsuche durchzuführen.

Der Entwickler Don McCurdy hat sein Pathfinding Modul für A-Frame und das Navigation Mesh [1] in einem Video geteilt.

Dieser Artikel erfordert Erfahrung im Umgang mit Blender und ist daher nur für fortgeschrittene Benutzer gedacht.

Dieses Tutorial ist als praktischer Leitfaden gedacht und behandelt keine theoretischen Hintergründe. Diese werden in einer Vielzahl von anderen Dokumenten im Internet [6] behandelt.

Für die Richtigkeit der Inhalte dieses Tutorials gebe ich keinerlei Garantie. Der hier gezeigte Weg ist nicht der einzige um ein solches System aufzusetzen, es ist lediglich, der, den ich bevorzuge.

Du benötigst folgendes:

Ich werde ein Fantasy Game Inn [11], von pepedrago [12] auf Sketchfab, als Szene.

Don McCurdy gibt zwei Tipps für deine Szene:

Das 3D [8] Modell muss in A-Frame funktionieren. Du kannst mit seinem glTF Viewer die Darstellung [13] prüfen.

Zweitens muss das Modell - oder zumindest die Geometrie - in Blender funktionieren.

Einrichten der Szene in Blender

Nachdem du deine Szene in Blender importiert hast, solltest du die Proportionen richtig einstellen. Bei einer Konvention in WebVR [14] sollte 1 Einheit = 1 Meter sein. Eine 1,65m x 0,5m große Box sollte menschlich aussehen. Diese Dimensionen sind wichtig, um ein gutes Navigationsnetz zu erhalten und um Bereiche zu erkennen, die nicht begehbar sind.

Szene in Blender ohne Material.

Szene in Blender ohne Material [15]

Erstellen des Navigationsnetzes

Wechsel im Header zum Blender Game Modus.

Verwende den Spielmodus in Blender. [16]
Verwende den Spielmodus in Blender.

Expandiere den Abschnitt Navigation mesh [1] und wähle die Einstellungen für den Agenten. Dies bestimmt die Größe des Charakters, den Blender bei der Entscheidung verwendet, wo dein Charakter gehen kann. Eine Höhe von 1.0 und ein Radius von 0.2 kann ein Startpunkt sein. Klicke dann auf Build navigation mesh [1] erstellen. Ergebnis:

Unser erstes Navigationsnetz, vor der Säuberung.
Unser erstes Navigationsnetz, vor der Säuberung. [17]

In Blender kannst du den Bearbeitungsmodus verwenden, um einzelne Vertices zu verändern, Brücken hinzuzufügen oder unerwünschte Bereiche zu löschen. Denke daran, dass mit PatrolJS dein Charakter innerhalb dieses Netzes überall hingehen kann. Es sollte also zwischen den Rändern des Navigationsnetzes und den eigentlichen Hindernissen etwas Platz sein, damit ein Charakter sich bewegen kann.

3D Charakterdesign [18]

Wir bieten 3D – Charakterdesign [18] nach deinem Ebenbild in unserem Atelier an. Wir benötigen nur wenige Fotos und einige Maße von dir und wenige Tage später erhältst du von uns dein 3D – Charakter, den Du anschließend in Deinem 3D [8] Projekt wirkungsvoll in Szene setzen kannst.

Blender Anleitungen im r23 blog

Blender Tutorial : Installation glTF-Blender-Exporter [19]
Three.js: Blender-Export [20]
Blender auf Deutsch umstellen [21]

Jetzt bist du gefragt!

Hast du Anregungen, Ergänzungen, einen Fehler gefunden oder ist dieser Beitrag nicht mehr aktuell? Dann freue ich mich auf deinen Kommentar.

Du kannst diesen Beitrag natürlich auch weiterempfehlen. Ich bin dir für jede Unterstützung dankbar!

Anmerkung zu den Screenshot: Wir haben Blender auf Deutsch umgestellt [21].
Das 3D [8] Model Fantasy Game Inn [11] by pepedrago [12] is licensed under CC Attribution [22].

Wie können wir Ihnen helfen?

Wir unterstützen Sie bei der Umsetzung Ihres Augmented Reality (AR) oder Virtual Reality (VR) Projektes! Egal ob Produktfotografie [23], 3D Scan Service [24], 3D-Visualisierung [25] oder fertige 3D Modelle für AR/VR [26] – wir beraten [27] Sie persönlich und unverbindlich.

Wünschen Sie ein individuelles Angebot auf Basis Ihrer aktuellen Vorlagen, nutzen Sie einfach unser Anfrageformular [25].