Skip to content

mi-classroom/mi-web-technologien-beiboot-ss2023-finnge

Repository files navigation

Open in Visual Studio Code

Web Technologien // begleitendes Projekt Sommersemester 2023

Zum Modul Web Technologien gibt es ein begleitendes Projekt. Im Rahmen dieses Projekts werden wir von Veranstaltung zu Veranstaltung ein Projekt sukzessive weiter entwickeln und uns im Rahmen der Veranstaltung den Fortschritt anschauen, Code Reviews machen und Entwicklungsschritte vorstellen und diskutieren.

Als organisatorischen Rahmen für das Projekt nutzen wir GitHub Classroom. Inhaltlich befassen wir uns mit der Entwicklung einer kleinen Web-Anwendung für die Erprobung von Augmented Reality im Browser. Das wird toll!

Inhaltsverzeichnis

Befehle für die Proof-of-Concepts

 Befehl Beschreibung
make up Startet die Docker Container
make down Stoppt die Docker Container
make restart Started die Docker Container neu
make logs Zeigt die Logs der Docker Container an
make tunnel Startet einen Tunnel zu localhost:6066
make dev Startet ein dev Umgebung außerhalb von Docker

Aufgabe 4: Basis-App Anwendung

Important

Die AR-Anwendung können nur auf Smartphones mit Android oder iOS gestartet werden. Auf iOS ist Mozillas WebXR Viewer notwendig. Auf Android ist Google Chrome notwendig.

In der Basis-App anwendung wurden die in den PoCs entwickelten AR-Anwendungen in einen Applikations-Kontext gestellt. In ADR-004 wurde sich dafür entschieden diese mit SvelteKit umzusetzen. Die Basis Anwendung ist über https://mi-classroom.github.io/mi-web-technologien-beiboot-ss2023-finnge erreichbar.

Es wurden mehrere AR-Anwendungen implementiert. Über die folgenden QR-Codes, die in den Erlebnis-Pfaden ausliegen könnten, wird eine AR-Anwendung gestartet.

Die Basis-Anwendung ist gesondert dokumentiert: Dokumentation für die Demoanwendung

 QR-Code Beschreibung
QR-Code Bergische Löwe Bahnhof Bielstein
Spatial Sound mit einem Zylinder.
Screenmovie
QR-Code Burghaus Bielstein
Spatial Sound mit zwei Zylindern. Der Sound kann einzeln an und aus geschaltet werden.
Screenmovie
QR-Code St. Bonifatius Kriegsgeschichte
Platzierung eines Pfades mit Hilfe von Knoten und Linien.
Screenmovie
QR-Code "Straße der Arbeit" Steinbreche Weiershagen
3D-Video mit Interaktionsmöglichkeit zum Starten und Stoppen.
Screenmovie