Im Rahmen der Neukonzeption eines grenzüberschreitenden Radwegs entlang des Lechs von Steeg in Tirol bis zur Mündung im bayerischen Marxheim erhielt infomax als Projektpartner der Allgäu GmbH den Auftrag zur Schaffung eines digitalen Reiseassistenten mit einem Fokus auf Planung und Vor-Ort-Service: Als "Rundum-sorglos-Paket" unterstützt er Radfahrende entlang des neuen Lechradwegs bereits in der Planungsphase und während ihrer Tour, indem er die jeweils passenden, kontext- und ortsbasierten Informationen liefert und sie dank Routingfähigkeit entlang des Lechradwegs navigiert.

Der digitale Reiseassistent wurde als echte Progressive Web App (PWA) realisiert, die die Vorteile einer Website mit denen einer nativen App vereint.

infomax begleitete das Projekt von der Konzeption in frühen Phasen über die Umsetzung bis zum Live-Testing vor Ort und der beständigen Weiterentwicklung.

"Echte" Progressive Web App (PWA)

Das Lechradwegprojekt bot mit seinen Anforderungen eine Steilvorlage, es als Progressive Web App (PWA) zu realisieren. In einer PWA verschmelzen alle Vorteile einer Website und einer nativen App: Als Website umgesetzt, verfügt sie über Merkmale einer App – all in one: schnelle Ladezeiten, einfache Navigation, dazu Zugriff auf native Smartphone-Features wie GPS, Telefon, Kamera – und Offlinefähigkeit.

Die Voraussetzung: ein PWA-Manifest, das das Aussehen und Verhalten der App beim Installieren auf dem Smartphone definiert.

Offlinefähigkeit

• Ein Tooltip informiert nach dem Öffnen der Website mit einem Mobilgerät, dass Inhalte heruntergeladen und offline genutzt werden können. Die Seite lässt sich auf dem Homescreen installieren.
• Nach der Installation können die für den „Unterwegs-Modus“ relevanten Inhalte auch offline genutzt werden, ausgenommen sind vor allem Informationen, für die standortbezogene Echtzeit-Informationen benötigt werden oder die zu Performance-Beeinträchtigungen führen würden:
  • Umgebungsmodul/Karten auf Detailseiten
  • Routing-Buttons
  • AroundMe-Ansicht
  • interaktive Karten, aufrufbar sind statische Karten für den Gesamtverlauf und die Haupt- sowie barrierefreien Etappen
  • reduzierte Bildformate und -einbindung

 (Push-) Benachrichtigungen

Nutzen stiftende Benachrichtigungsfunktionen werten die PWA weiter auf:

• Notifications zu Naturschutzgebieten: Beim Start des Routings durch eine Etappe oder eine geplante Route wird per Overlay ein allgemeiner Hinweis zu Verhaltensregeln im Naturschutzgebiet angezeigt, sollte auf der geplanten Route ein oder mehrere Stämme liegen, denen die Produktlinie “Naturschutzgebiet” zugewiesen ist.
• In Planung: Unwetterwarnungen, aktuelle Informationen zu einem nahegelegenen POI (z.B. Öffnungszeiten), Streckensperrungen

Content Delivery API der imx.Platform

Die imx.ContentDelivery API ist ein mächtiges Werkzeug, das extrem performant kontextbasierte Datenabfragen ermöglicht. Basierend auf GraphQL liefert die cloud-native Anwendung auf jede spezielle Frage eine für den Kontext zielgerichtete Antwort – und das performant, resilient und skalierbar.

Im Lechradwegprojekt zeigt in einem ihrer ersten Anwendungsfälle ihr Potenzial. Dort stellt sie eine direkte Verbindung zwischen der Single-Page Anwendung lechradweg.info und der imx.Platform ohne die Notwendigkeit einer Middleware her. So werden beispielsweise alle Etappenlisten, POI-Listen oder auch Detailseiten direkt vom Browser bei der Content Delivery API angefragt und und erhalten genau nur die gerade benötigten Daten.

Mehr zur imx.ContentDelivery API auf unserem Blog gradextra.de.

Konzeption: User Flows und Wireframes

Im Rahmen eines Konzeptionsworkshops identifizierten wir relevante Use Cases entlang der Customer Journey:

• Entdecker-Modus: erste Informationen zum Lechradweg
• Planer-Modus: Unterstützung bei der Planung der Etappen, Übernachtungen, eigenes Routing
• Erlebnis-Modus: Vorschläge für Sehenswürdigkeiten und Gastronomie entlang der Route
• Routing-Modus: Live-Routing während der Tour, Informationen zu POIs, Benachrichtigungen

Daraus leiteten wir User Flows ab, die relevante Einstiege identifizierten, benötigte Ansichten skizzierten und die relevanten Informationen in einer stringenten Navigation zusammenführten. Darauf folgten erste Visualisierungen mittels Wireframes.

UX-Design

Auf Basis des neu entwickelten Corporate Designs für den Lechradweg entstand ein Visual Design, das wir im Rahmen von Hallwaytests in einem sehr frühen Stadium prüften und optimierten.

Projektmanagement durch UX-Konzeption

Eine Besonderheit im Lechradweg-Projekt: Die UX-Konzeption blieb aufgrund des hohen konzeptionellen Projektanteils auch im Projektmanagement-Lead. In Weeklies mit dem Kunden und dem Projektteam (UX-Design, Frontend, Portal-Entwicklung, Software-Architektur) und mittels eines Sprint Plannings konnten wir ohne Informations- und Zeitverluste beraten und agil nachjustieren.

Frontend-, Portal- und Software-Entwicklung

• Der digitale Reiseassistent wurde als Angular-App entwickelt.
• Lokal wurde in Docker-Containern entwickelt, ein Server-Side Rendering gewährleistet die suchmaschinenoptimierte Bereitstellung von Contents.
• Ein Effizienz-Boost war die gleichzeitige Bearbeitung durch Frontender und Entwickler: In kurzen Zyklen verwandelten die Teams statische UX-Designvorlagen in dynamische Module.
• Die bereits vorhandene imx.Platform-Instanz der Allgäu GmbH dient als Content Repository für feste Seiten wie dem Impressum; alle weiteren Daten werden über die neue imx.Content Delivery API bereitgestellt. Auf ein CMS konnte so komplett verzichtet werden.
• Als Kartenbasis wird MapLibre genutzt, die Tiles vom Maptoolkit über Rapid API eingebunden.
• Spannende Herausforderungen galt es beim Routing zu lösen: Da sich das Routing nicht am Verlauf des Lechradwegs, sondern an der kürzesten Strecke orientierte, führten wir eine Gewichtung ein, um Radreisende möglichst lange an der Original-Strecke zu halten. 
  Nutzer*innen erhalten dank regelmäßiger Standort-Updates während des Routings aktuelle Informationen über die nächsten Wegpunkte und eine Angabe über die Entfernung zum Ziel.

 Testing unter realen Bedingungen vor Ort

Die Projektarbeit fand dabei nicht ausschließlich im Büro statt: Zum Testing radelten die Projektverantwortliche Lorena Meyer und Lead-Entwickler Benni Hofmann Etappen ab, um „ihr“ Produkt live und unter realen Bedingungen zu testen.

Nicht zuletzt die Erkenntnisse aus dem Testing vor Ort lieferten viele neue Ideen und Erweiterungsmöglichkeiten. Geplant sind weitere (Push) Notifications, visuelle Optimierungen und Content-Erweiterungen wie z.B. Lauschtouren.

Der Lech bietet entlang seines Verlaufs vom Ursprung in Vorarlberg durch das Tiroler Lechtal und die Allgäuer Alpen bis zur Mündung in die Donau in Marxheim bei Donauwörth bisher weitgehend ungenutztes Potenzial für naturnahe Erlebnisse. 
Im Rahmen eines grenzüberschreitenden Interreg-Projektes wurde daher ein Radweg entlang des Lechs - von Steeg in Tirol bis zur Mündung im bayerischen Marxheim - neu konzipiert, in den der auf österreichischer Seite bereits bestehende Lechtalradweg integriert wurde.

Ziele

• Schaffung eines touristischen Angebots entlang des Lechs, das die einzigartige Natur und Kultur der Flusslandschaft vor dem Alpenpanorama erlebbar macht und mit der Technikgeschichte des UNESCO Welterbes verbindet
• Integration und Inwertsetzung des UNESCO Welterbes des Augsburger Wassermanagementsystems (seit 2019)
• Beitrag zur regionalen Entwicklung und Naturerfahrung, insbesondere durch den Einsatz neuer Medien
• Ausdehnung der touristischen Saison
• Setzen von Maßstäben im Bereich E-Mobilität, Digitalisierung und Barrierefreiheit

Lösung

Der neue Lechradweg führt über fünf Etappen 250 Kilometer flussaufwärts von Nord nach Süd, von der Mündung in die Donau bis zum Oberlauf im Tiroler Lechtal. Auf diese Weise genießen Radler*innen auf der stets leicht ansteigenden Route zum Ursprung die schönsten Panoramaaussichten.

Der neue Streckenabschnitt wurde beschildert und mit E-Bike-Ladestationen versehen. Ausgewählte Touren sind barrierefrei mit dem Handbike befahrbar.

Im Rahmen der Neukonzeption erhielt infomax als Projektpartner der Allgäu GmbH den Auftrag zur Schaffung eines digitalen Serviceassistenten, der Radfahrende in der Planungsphase und während der Tour dank Routingfähigkeit unterstützt.

Sie möchten mehr über dieses Projekt erfahren oder planen Ähnliches? Oder sind Sie interessiert an der imx.ContentDelivery API und unserer Datenmanagement-Lösung imx.Platform? Gern tauschen wir uns dazu mit Ihnen aus!

infomax websolutions GmbH
Aichfeld 2
83224 Grassau
Deutschland
Telefon: +49 8641-6993-0