Zum Inhalt springen

3D-Modellierung/3D-Modelle erstellen/JSON3D4Aframe

Aus Wikiversity

Einleitung

[Bearbeiten]
JSON3D4Aframe initialisiert mit einem Wassermolekül-Beispiel für die Darstellung in Aframe oder im AR.js Format

JSON3D4Aframe[1] ist eine AppLSAC zur Erstellung von 3D-Modelle für AFrame oder AR.js. Das OpenSource-Tool wurde als Unterstützung für die Lernressource 3D-Modellierung erstellt, die sich mit der 3D-Modellierung beschäftigt.

Lernaufgaben

[Bearbeiten]

3D-Modelle können als Aframe-Modell oder AR.js-Modell erstellt werden. Das Aframe-Modell wird für 3D-Modelle z.B. auf einem mobilen Gerät verwendet, wo das Objekt durch Bewegung im 3D-Raum erkundet werden kann, während AR.js für die Platzierung des 3D-Objekts in einem Videostream oder VR-Headset verwendet wird.

Vordefiniertes 3D-Modell

[Bearbeiten]

In einem ersten Schritt wird mit einem vordefiniertes 3D-Modell gearbeitet, um das Prinzip der unterschiedlichen Exportformate kennen zu lernen.

  • Starten Sie zunächst JSON3D4Aframe in Ihrem Browser.
  • Wählen Sie dann als vordefiniertes 3D-Modell Water Molecule aus und drücken Sie dann auf die rote Schaltfläche Init 3D. Dann sollte bei Ihnen im Vorschaumodus das Wassermolekül erscheinen.

Festlegung des Darstellungsmodus

[Bearbeiten]

Die 3D-Modelle können sowohl mit AR-Modus mit AR.js und im VR-Modus direkt mit Aframe exportiert werden. Wählen Sie daher für das Modell den Vorschaumodus aus. Dieser befindet sich in der oberen Selectbox in JSON3D4Aframe. Verfügbare Modi sind:

  • Aframe 3D
  • AR Marker 3D
  • AR Geolocation - der Export macht nur dann Sinn, wenn Sie das Modell mit einem mobilen Gerät (Smartphone) mit Sensor für ein globales Satellitennavigationssystem betrachten wollen. Das Objekt wird dann bezogen auf die in der HTML-Datei festgelegt Geokoordinaten (Längen- und Breitengrad) dargestellt. Das Modell erscheint dann an dem festgelegten Ort, wenn Sie sich mit Ihrem mobilen Endgerät (Smartphone) in der räumlichen Nähe des festgelegten Standort befinden. Der Breiten- und Längengrad, an dem sich das 3D-Modell sichbar werden soll, wird von AR.js in Relation zur Ihrer eigenen Position dargestellt (siehe auch AR Studio für AR.js[2]

AR.js

[Bearbeiten]

3D-Modelle werden im Videostrom der Webcam mit einem Marker als 3D-Referenzpunkt angezeigt.

Hiro Marker

[Bearbeiten]

Drucken Sie das PDF mit Markern aus und verwenden Sie den Hiro-Marker in Ihrer Webcam, um das 3D-Modell anzuzeigen. Musterquelle: Hiro-Muster aus AR-Toolkit

Kanji-Marker

[Bearbeiten]

Drucken Sie das PDF mit Markern aus und verwenden Sie den Kanji-Marker in Ihrer Webcam, um das 3D-Modell anzuzeigen. Musterquelle: Kanji-Muster aus AR-Toolkit


Beginnen Sie, den JSON3D4Aframe zu erkunden und erstellen Sie Ihr erstes 3D-Modell in AR.js.

Modelle erforschen

[Bearbeiten]

JSON3D4Aframe ("JSON 3D files fo(u)r AFrame") ist ein Werkzeug, das für die Wikiversity-Lernressource über 3D-Modelle auf Marker erstellt wurde.

  • Wählen Sie ein vordefiniertes Modell mit dem roten "Init 3D"-Button (siehe Screenshot oben).
  • Prüfen Sie die Vorschau des 3D-Modells in verschiedenen Ausgabeformaten.
  • Wählen Sie in den Aframe-Einstellungen einen Himmel aus und sehen Sie sich das 3D-Modell mit Himmel an. Bitte warten Sie ein wenig, bis die Himmelsbilder (equirectangular images) im Hintergrund geladen sind.

Modelle erstellen

[Bearbeiten]
  • JSON3D4Aframe wurde für die Wikiversity-Lernressource erstellt, um eine einfache 3D-Szene mit geometrischen Primitiven zu erstellen.
  • Für fortgeschrittene realistische 3D-Szenen können Sie sich die Open-Source-Software Blender ansehen und die 3D-Modelle dort mit dem Blender2Aframe exporter[3] in Blender installiert.

Siehe auch

[Bearbeiten]

Referenzen

[Bearbeiten]
  1. ↑ JSON3D4Aframe (2025) GitHub Repository: https://github.com/niebert/JSON3D4Aframe - Web App URL: https://niebert.github.io/JSON3D4Aframe/
  2. ↑ AR Studio for AR.js (2025) Repository AR.js: https://github.com/AR-js-org/AR.js Web App URL: https://ar-js-org.github.io/studio/.
  3. ↑ Alessandro Schillaci (2021) Blender to Aframe exporter - plugin for OpenSource 3D modelling software Blender - URL: https://github.com/silverslade/aframe_blender_exporter


Seiteninformation

[Bearbeiten]

Diese Lernresource können Sie als Wiki2Reveal-Foliensatz darstellen.

Wiki2Reveal

[Bearbeiten]

Dieser Wiki2Reveal Foliensatz wurde für den Lerneinheit 3D-Modellierung' erstellt der Link für die Wiki2Reveal-Folien wurde mit dem Wiki2Reveal-Linkgenerator erstellt.

Abgerufen von „https://de.wikiversity.org/w/index.php?title=3D-Modellierung/3D-Modelle_erstellen/JSON3D4Aframe&oldid=1007779“