Was ist BabylonJS?
BabylonJS ist ein JavaScript Framework, welches eine auf WebGL (Web Graphics Library) basierte Render Engine für 3D-Objekte zu Verfügung stellt. Es wurde anfangs von zwei Microsoft Mitarbeitern als privates Projekt in ihrer Freizeit entwickelt, mittlerweile von Microsoft selbst übernommen und weiterentwickelt.
Die Bibliothek ist Open-Source auf github verfügbar und die Hauptfunktionen dank einer ausführlichen Dokumentation (ausschließlich auf Englisch) relativ einfach zu verstehen, wenn man Kenntnisse in JavaScript hat.
Ein grundlegendes Verständnis von 3D-Modellen und der Aufbau ist außerdem sehr hilfreich, da man dann die Objekte im Code einfacher und schneller bearbeiten kann. Man kann auch die erstellten 3D-Modelle exportieren und dann z. B. in Blender importieren und weiterbearbeiten.
Welche Grundfunktionen bietet BabylonJS?
Es bietet einfache Tools zum Einfügen und Positionieren von Objekten und Kameras. Man kann sowohl Objekte, die man zuvor in 3D-Programmen erstellt hat, importieren oder direkt in Babylon selbst ein neues Objekt erstellen. Zum Beispiel kann man eine einfache Topfpflanze importieren und platzieren, dann ein Licht auf die Pflanze richten und die Kamera auf das 3D-Modell zentrieren.
Et voilà – fertig ist das erste 3D-Projekt, bei dem man die Pflanze anschauen, drehen und darauf zoomen kann. Ein Beispiel dazu und zu anderen Projekten finden Sie auf unserer Seite vyld.de.
Doch BabylonJS kann noch so einiges mehr. Mittels einer Physikengine können Gravitation und Kollisionen dargestellt werden und den echten Regeln der Physik folgen. So kann zum Beispiel eine Murmelbahn, dem echten Abbild entsprechend, realitätsgetreu nachgebaut werden. Dazu gibt es sogar eine Vorschau und den dazugehörigen JavaScript Code im Playground von Babylon: hier geht’s zur Murmelbahn!
Man sollte auch die Schatten und Lichtsimulationen nicht vernachlässigen. Diese werden in Echtzeit gerendert und detail- und realitätsgetreu dargestellt. Um einen Schatten erzeugen zu können muss man in seinem Projekt eine Lichtquelle hinzufügen. Danach fügt man einen sogenannten Shadowgenerator ein und fügt die Objekte hinzu. Das Ergebnis könnte dann in etwa so aussehen.
Mobile Optimierung und AR-Technologie
Das Framework ist auch so gut optimiert, dass es problemlos auf dem Handy genutzt werden kann. Dort finden sich zudem noch weitere zusätzliche Features wie z. B. die Unterstützung von AR-Technologie. Das bedeutet, dass man die Realität um Zusatzinformationen, in diesem Beispiel das 3D-Objekt auf dem Smartphone, erweitert.
Mehr zu den Themen Virtual- und Augmented-Reality lesen Sie hier. Man kann in Babylon mit dem Handy ein 3D-Objekt in den Raum stellen und dann um dieses herumlaufen, indem man durch das Smartphone in die 3D-Welt schaut.
Beispielprojekte
Im Jahr 2014 hat Ubisoft zusammen mit Microsoft das Browser Minispiel Assassin’s Creed Pirates entwickelt. In diesem Spiel kann man ein Piratenschiff mit Hilfe von Tastatureingaben oder mit der Maus steuern und muss Checkpoints erreichen. Dabei muss man Minen ausweichen, um schnellstmöglich ins Ziel zu kommen. Dieses Spiel ist auch für Mobilgeräte optimiert und ist ein gutes Beispiel dafür, was in diesem Framework alles möglich ist. Das Spiel kann man hier ausprobieren.
Wenn Sie Fragen rund um das Thema haben, können Sie uns gerne jederzeit ganz unverbindlich kontaktieren. Wir beraten Sie gern und setzen Ihr Projekt ganz nach Ihren Anforderungen und Wünschen um.
