Augmented Reality trifft TYPO3: POIs neu erleben

Wie bringt man Points of Interest (POIs) auf mobilen Geräten intuitiv und platzsparend zur Anzeige?

Diese Frage stand am Anfang von Davids Abschlussprojekt der Ausbildung zum Fachinformatiker Anwendungsentwicklung und wurde mit einer innovativen Lösung beantwortet: dem imx.ARBrowser, einer TYPO3-Erweiterung zur Darstellung von POIs in einer Augmented-Reality-Ansicht.

Ausgangssituation: POIs auf dem kleinen Bildschirm – ein bekanntes Problem

In touristischen oder redaktionellen Portalen werden POIs bisher meist in zwei Varianten dargestellt: als Kartenansicht oder Liste. Auf Mobilgeräten ist beides oft unübersichtlich, die Bedienung leidet unter Platzmangel und der räumliche Bezug bleibt vage. Genau hier setzt Davids Projekt an.

Projektziel: POIs direkt in der Umgebung anzeigen

Das Ziel: eine benutzerfreundliche und mobile Lösung, die POIs direkt in der realen Umgebung des Nutzers visualisiert mit Augmented Reality. Dafür entwickelte David eine eigene TYPO3-Erweiterung, die sich nahtlos in bestehende Portale integrieren lässt.

Die wichtigsten Funktionen im Überblick:

  • Anzeige der POIs als Marker in einer AR-Ansicht
  • Integration per Content-Element in TYPO3
  • Datenanbindung an die imx.Platform via Content Delivery API (CDA)
  • Filtern der POIs nach Eigenschaften, z. B. Produktlinien
  • Clustering von POIs zur Vermeidung von Überlappungen
  • Interaktive Infofenster mit Details zu POIs oder POI-Clustern

Anzeige der POIs als Marker in einer AR-Ansicht
Interaktives Infofenster zu POI-Clustern
Interaktives Infofenster zu einem POI

Ergebnis: Funktionsfähige AR-Erweiterung für TYPO3

Davids Lösung ist produktreif: Die AR-Ansicht lässt sich in TYPO3 (Version 12.4) bequem pflegen und konfigurieren. Filter für Produktlinien sind einfach über eine ID-Liste definierbar, Marker und Cluster werden automatisch aus der imx.Platform geladen und dargestellt. Auch ein responsives Info-Fenster wurde umgesetzt.

Herausforderungen: Neues Terrain, kreative Lösungen

Augmented Reality war für das Team Neuland – und genau das machte das Projekt besonders spannend. David stieß auf mehrere Herausforderungen:

  • Die ursprünglich gewählte AR-Bibliothek war inkompatibel mit dem verwendeten Frontend-Framework und ein Wechsel war somit nötig.
  • Die Umsetzung der Marker in Three.js erforderte tiefes technisches Verständnis.
  • Das geplante Clustering mittels Ray-Casting musste aus Zeitgründen vereinfacht werden – stattdessen gruppieren sich Marker nun anhand von Koordinaten und Blickrichtung.
  • Der Vollbildmodus funktioniert derzeit nur auf Android.

Trotz dieser Hürden konnte David eine funktionierende, performante Lösung abliefern und viele wertvolle Erfahrungen sammeln.

Ausblick: Ideen für den nächsten Schritt

Natürlich ist das Projekt damit nicht zu Ende gedacht, denn für das Projekt war nur begrenzt Zeit. David hat bereits einige spannende Ideen für die Weiterentwicklung:

  • Weitere Filteroptionen, z. B. nach Themenbereichen
  • HTML-basierte Marker für einfacheres Styling und Customizing je nach Kundenportal
  • Unterstützung für neuere TYPO3-Versionen

Fazit: Starke Leistung, starke Lösung

„Ich wollte was machen, das man nicht jeden Tag sieht und das den Leuten wirklich hilft. Klar war es manchmal knifflig, aber genau das hat es spannend gemacht. Am Ende habe ich nicht nur eine coole Lösung gebaut, sondern auch viel dazu gelernt. Über Technik und über das Dranbleiben.“

David Kelemen, Fachinformatiker für Anwendungsentwicklung

Davids Projekt zeigt eindrucksvoll, wie praxisnah, technisch fundiert und kreativ ein Abschlussprojekt sein kann. Wir sind stolz auf das Ergebnis in so kurzer Zeit und sind gespannt auf die weitere Entwicklung des Projektes!

Verena Schmuck and David Kelemen

Werkstudentin Kommunikation & Innovation bei infomax

Share
Published by
Verena Schmuck and David Kelemen

Recent Posts

☀️🌧️ Sommer-(Regen)fest 2025 – Wenn das Wetter nicht mitspielt, aber das Team umso mehr!

Ende Juni war es endlich soweit: Das gesamte #Teaminfomax kam wieder zusammen - mit Kolleg*innen…

3 Wochen ago

imx.Platform News: Neue Funktionen für mehr Effizienz und Flexibilität

Mit dem aktuellen Release der imx.Platform News erwarten Sie zahlreiche neue Features und Verbesserungen, die…

3 Wochen ago

Eindrücke vom DestinationCamp 2025 in Düsseldorf

Anfang Juni fand wieder das Destination Camp der netzvitamine statt. Dieses Jahr ging es nach…

4 Wochen ago

imx.Platform Lab 2025 – inspirierend und interaktiv

In der ersten Aprilhälfte fand erneut unser alljährliches Anwenderforum aka imx.Platform Lab statt. An zwei…

3 Monaten ago

imx.Platform News: Weiterentwicklungen und neue Features

Es stehen neue Funktionen, Erweiterungen und Optimierungen unserer Module und Features in der imx.Platform für…

4 Monaten ago

#imxkickoff2025: Where the magic happens

Unser diesjähriger Jahresauftakt fand unter dem Motto „Where the magic happens“ im malerischen Kloster Seeon…

6 Monaten ago