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

Share
Published by
Verena Schmuck and David Kelemen

Recent Posts

#imxkickoff2026: Neues Jahr, neue Challenge.

Der #imxkickoff 2026 führt unser Team für drei inspirierende Tage in winterlicher Kulisse zusammen. Zwischen…

11 Stunden ago

imx.Platform News: Neue Module, smartere Workflows und ein frisches Widget-Design

Mit den aktuellen Produkt-Updates unserer imx.Platform, des Partner Clients und der Whitelabel Widgets setzen wir…

1 Woche ago

infomax Langlauftournee 2025/2026 im Rahmen des Sparkassencups

infomax übernimmt die Rolle des Presenting Sponsor der Chiemgauer Langlauftournee im Rahmen des Sparkassencups. Die…

3 Wochen ago

imx.Platform News: Whitelabel, Barrierefreiheit & neue Funktionen

Wir haben die imx.Platform durch eine Reihe von Produkt-Updates weiter optimiert, um sowohl die Datenqualität…

4 Monaten ago

Unsere Ausbildungszeit bei infomax

Phil Jope und David Kelemen, haben 2022 ihre Ausbildung zum Fachinformatiker für Anwendungsentwicklung begonnen und…

5 Monaten ago

☀️🌧️ 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…

7 Monaten ago