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

Smashing Conference 2026 in Amsterdam

Dieses Jahr wurde es wieder einmal Zeit, eine Smashing Conference zu besuchen, diesmal in der…

2 Wochen ago

Wie man ein Selfie mit Kevin Powell bekommt

"Wir sind dann nächste Woche auf der SmashingCon. Sollen wir jemandem was aus Amsterdam mitbringen,…

3 Wochen ago

imx.Platform Lab 2026: Zukunft im Blick

Gelebtes Anwenderforum Das imx.Platform Lab ist mehr als ein weiterer Termin in Ihrem Kalender. Es…

3 Wochen ago

imx.Platform News: MCP-Endpunkt, Aufgaben-Modul und neue KI-Funktionen

Inhalte aus der imx.Platform werden für KI-Systeme noch besser zugänglich und redaktionelle Arbeit wird effizienter…

3 Wochen ago

imx.Platform @The Future of German Media

Summit in Hannover, Zeit für Perspektivwechsel. Neue Perspektiven erweitern den Horizont, ermöglichen persönliches Wachstum und…

2 Monaten ago

#imxkickoff2026: Neues Jahr, neue Challenge.

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

3 Monaten ago