Top-Fragen
Zeitleiste
Chat
Kontext
A-Frame (Framework)
Software Aus Wikipedia, der freien Enzyklopädie
Remove ads
A-Frame ist ein Framework zur Darstellung von 3-D-Objekten und für virtuelle Realität im Webbrowser, das seit 2015[3] von Mozilla als offene Software entwickelt wird.
Remove ads
Funktionsprinzip
A-Frame erlaubt die Schaffung dreidimensionaler Welten mittels einer deklarativen Sprache, die dem aus HTML und XML bekannten Entitäts-System folgt. Objekte werden durch Tags angegeben, ihre Eigenschaften wie Position und Farbe in Attributen.[4] Neben den standardmäßig zur Verfügung stehenden Objekten besteht auch die Möglichkeit, eigene Komponenten zu erstellen oder aus anderen Quellen einzubinden.[5]
A-Frame stellt die so definierten Objekte dann grafisch dar und ermöglicht es dem Benutzer, in der Szene zu navigieren. Im einfachsten Fall wird die Szene einfach am Bildschirm gerendert, über die WebVR-API kann aber in modernen Browsern auch ein Head-Mounted Display benutzt werden. Intern setzt A-Frame bei der Darstellung die Bibliothek Three.js ein.[6]
Über Manipulationen des DOM kann die Szene auch nachträglich verändert werden.[7] Mit Bildwiederholraten von 90 fps können dabei flüssige Bewegungen dargestellt werden.[8]
Remove ads
Beispiel
Das folgende einfache Beispiel erzeugt eine statische Szene, in der der Benutzer navigieren kann:[9]
<html>
<head>
<title>Hello, World!</title>
<script src="https://aframe.io/releases/0.5.0/aframe.min.js"></script>
</head>
<body>
<a-scene>
<a-box position="-1 0.5 -3" rotation="0 45 0" color="#4CC3D9"></a-box>
<a-sphere position="0 1.25 -5" radius="1.25" color="#EF2D5E"></a-sphere>
<a-cylinder position="1 0.75 -3" radius="0.5" height="1.5" color="#FFC65D"></a-cylinder>
<a-plane position="0 0 -4" rotation="-90 0 0" width="4" height="4" color="#7BC8A4"></a-plane>
<a-sky color="#ECECEC"></a-sky>
</a-scene>
</body>
</html>
Im Kopf wird zunächst A-Frame eingebunden. Die Szene selbst besteht aus einem Quader, einer Kugel und einem Zylinder auf einer Ebene vor einem Hintergrund.
Remove ads
Anwendungen
A-Frame ist ein beliebtes Framework zum Arbeiten mit virtueller Realität, da es komplexe Schnittstellen wie WebGL und WebVR leicht zugänglich macht und die Einstiegshürde in die virtuelle Realität senkt.[10] Durch den einfachen Aufbau kann es im Prototyping eingesetzt werden, bietet aber auch die Grundlage für komplexe Anwendungen. Bei Programmierern ist A-Frame besonders wegen ihrer hilfsbereiten Community beliebt.[11]
A-Frame wird in vielen Demo-Anwendungen von virtueller Realität im Browser eingesetzt, beispielsweise A-Painter,[12] das ebenfalls von Mozilla entwickelt wurde und das Erstellen und Teilen dreidimensionaler Kunstwerke im Internet erlaubt.
Außerhalb der Entwicklerszene erlangte A-Frame Bekanntheit unter anderem durch den Einsatz in Fear of the Sky (360 Syria), einer Dokumentation des Bürgerkriegs in Syrien durch Amnesty International,[13] Mars: An Interactive Journey der Washington Post.[14] und Reisen in 360 von Travelhackers.[15]
Weblinks
Einzelnachweise
Wikiwand - on
Seamless Wikipedia browsing. On steroids.
Remove ads