Blog
E-Mail

mxpost

Telefon

0201-848300

Hammerstr. 156
45257 Essen

WebAR, WebVR, WebXR, WebHDGDL

11. April 2022

Wie cool wäre es denn, wenn jede/jeder die Kalender in unserem kleinen Shop mal schnell an seine Wand klatschen könnte, um zu schauen, ob sie passen? Flugs haben wir mit three.js ein kleines Tool entwickelt, das uns maßstabsgetreue 3D-Modelle von unseren Kalendern zaubert. Wer den Shop im Smartphone- oder Tablet-Browser ansieht, findet nun neben den normalen Vorschaubildern der Kalender auch einen Button für eine Live-Vorschau. Damit werden unsere Kalender in virtueller Form an die Wand projiziert.

Ikea ist ein Vorreiter dieses Services und ermöglicht schon lange, seine Wohnung mittels Augmented Reality (AR) zu bestücken – allerdings (noch) mit einer App. Eine Gruppe von Expert:innen aus Unternehmen wie Google, Apple, Microsoft und Facebook – das World Wide Web Consortium, kurz W3C – werkelt an dem neuen Webstandard WebXR für eine nahtlose Integration von Virtual Reality (VR) und AR auf Websites bzw. Webanwendungen.

Um ein bisschen Klarheit in die Begrifflichkeiten zu geben: WebAR steht für webbasierte erweiterte Realität, sprich: Augmented Reality fügt einer realen Umgebung digitale Informationen in Echtzeit hinzu. WebVR, also webbasierte
virtuelle Realität, versetzt die Benutzer:innen hingegen komplett in eine andere/digitale Welt, ähnlich einem Videospiel. Und unter WebXR wird webbasierte erweiterte Realität im Allgemeinen verstanden. Das X könnte als ein Platzhalter für all die realitätserweiternden Technologien gesehen werden, die noch kommen. Der Einfachheit halber kann WebXR also als ein Oberbegriff betrachtet werden, der Augmented Reality und Virtual Reality und alles, was aus der Zusammenarbeit dieser Technologien entsteht, umfasst.

Mit WebXR ist es möglich, die immersiven Technologien einfach im Browser zu erleben – auch mit AR-/VR-Brille, aber das ist kein Muss. Voraussetzung ist lediglich, dass ein modernes Smartphone oder Tablet und ein aktueller Browser vorhanden ist. Besser gesagt ein kompatibler Browser, denn noch ist WebXR nicht in allen Browsern nutzbar. Es wird natürlich noch viel experimentiert, aber auch die Anforderungen für Browser sind nun andere: Die sind nämlich nicht besonders auf Performance optimiert und gerade die wird benötigt für AR- und VR-Anwendungen. Eine (noch überschaubare) Übersicht gibt es unter https://caniuse.com/webxr und eine gute Seite zum Testen des eigenen Devices ist https://immersive-web.github.io/webxrsamples/. Nicht traurig sein, wenn es nicht klappt. Wie in unserem Fall, dem Kalender-Shop, ist es durchaus trotzdem möglich, webbasierte Augmented Reality zu nutzen, auch wenn WebXR noch nicht zur Verfügung steht: Und zwar mit dem Model-Viewer von Google und Apples AR QuickLook. Natürlich ist der Ansatz des einen Unternehmens nur bedingt mit dem des anderen kompatibel, und so werden zwei Formate des 3D-Models benötigt, die sich aber an sich relativ einfach in eine Website einbinden lassen. Per Klick auf einen Button öffnet sich dann die Kamera des Gerätes und ermöglicht die Projektion des Objektes auf eine Oberfläche, wie auf den Boden oder – wie unsere Kalender – an eine Wand. Sogar Animationen und eine Interaktion mit dem Objekt sind mittlerweile möglich. Das funktioniert überraschend performant und fühlt sich durch umgebungsabhängige Beleuchtung und Schattenwürfe der Objekte schon fast natürlich an.

Davon losgelöst gibt es weitere tolle Entwicklungen wie das Framework A-Frame (https://aframe.io/), mit dem jeder/jede z. B. in 360-Grad-Bilder oder -Videos eintauchen oder gar Mini Games spielen kann. In Verbindung mit der Javascript-Bibliothek AR.js ermöglicht A-Frame die Platzierung von 3D-Modellen GPS-basiert im Raum oder projiziert diese auf Marker. Die Marker können Barcodes oder eigens generierte Codes sein, sogar Bilder/Fotos können als Marker fungieren (siehe Rückseite).

Augmented Reality wird bereits in vielen Bereichen erprobt, sei es zur Produktpräsentation (Möbel, Yachten, Architektur), zur Navigation (Google Maps), zur Assistenz, für virtuelle Zoobesuche (Snapchat & der Kölner Zoo) oder für Lernszenarien in der Medizin (medicalaugmentedreality.org). Das Revolutionäre an WebXR ist, dass es die Abhängigkeit von speziellen Apps, die oft noch Voraussetzung sind, auflöst. Dadurch, dass von jeder Website aus ein Einstieg in eine erweiterte Realität möglich ist, verschwimmen die Grenzen von Realität und Digitalität bzw. digitaler Realität umso mehr. Und je einfacher der Übergang wird, desto höher wird die Akzeptanz und der Nutzen von Augmented Reality. Unsere Ausstellung Arx Africa soll dazu beitragen. Sie ist ein Versuch, eine Ausstellung mit virtueller Kunst sowie Abbildungen echter Kunstwerke, im Prinzip überall auf der Welt, sehen zu können – und das ausschließlich mit WebXR. Klar, dabei haben wir jede Menge Kinderkrankheiten mitgenommen und Kompromisse geschlossen, aber die Liste an Funktionen und unterstützten Browsern sowie Devices wird immer länger. Auch bei der Erstellung von 3D-Modellen tut sich einiges. Was mitunter teure Hardware voraussetzen würde, lässt sich zum Teil bereits mittels Lidar-Scanner und Photogrammetrie auf dem Smartphone erstellen – und die Resultate sind verblüffend gut.

 

Unser Fazit: Augmented Reality im Web macht Bock und ist auf jeden Fall zukunftsfähig!

Die Kalender gibt’s übrigens unter strassebahn-kalender.de
– und demnächst auch im Metaverse 😉

 

 

Sieh dir diesen Beitrag auf Instagram an

 

Ein Beitrag geteilt von manxdesign (@manxdesign)

Aus unserem Blog:

Lasst uns über Farbe reden? Besser nicht.

28. Juni 2022

Mary ist Wissenschaftlerin und weiß alles über Farben. Jede kleinste Einzelheit, die neurophysiologischen Prozesse  und überhaupt alles was die Physik zum Thema Farbe zu sagen hat, ist ihr bekannt. Aber: sie hat noch nie selbst Farbe gesehen und wuchs in einer reinen … mehr

ARX Africa – ein Rückblick

26. April 2022

Zwei Jahre haben wir intensiv daran gearbeitet, dieses innovative, vielschichtige Projekt an den Start zu bringen. Augmented Reality ist hier das Zauberwort. Wir haben das technisch Mögliche ausgereizt, um dreidimensionale Objekte, Bilder und Videos an jedem Ort der Welt erlebbar zu machen … mehr

WebAR, WebVR, WebXR, WebHDGDL

11. April 2022

Wie cool wäre es denn, wenn jede/jeder die Kalender in unserem kleinen Shop mal schnell an seine Wand klatschen könnte, um zu schauen, ob sie passen? Flugs haben wir mit three.js ein kleines Tool entwickelt, das uns maßstabsgetreue 3D-Modelle von unseren Kalendern zaubert. mehr