odo - Routenplanung, die mitdenkt

Mit dem Projekt „odo“ entwickeln wir einen digitalen Fahrradroutenplaner, der sich flexibel an die individuellen Bedürfnisse von Fahrradfahrern anpasst. Anstatt nur den schnellsten oder kürzesten Weg anzugeben, berücksichtigt unser Ansatz persönliche Vorlieben und situative Anforderungen wie Wetter, Tageszeit oder Streckenbeschaffenheit.

Die Anwendung bietet die Möglichkeit, Routen gezielt nach Kriterien wie Untergrund, Steigung, Umgebung oder gewünschter Fahrweise zu filtern. So entsteht eine dynamische Planung, die sich auf verschiedene Nutzungsszenarien anpassen lässt, vom entspannten Feierabendradeln bis zur sportlichen Tour.

Unser Ziel ist es, das Fahrradfahren durch kontextbezogene Routenplanung zugänglicher, angenehmer und planbarer zu machen. Die Lösung versteht sich als Ergänzung zu bestehenden Diensten mit dem Anspruch, persönlicher, flexibler und intuitiver auf das einzugehen, was Menschen auf dem Fahrrad wirklich brauchen.

Finales Konzept

Unser Konzept teilt den Ablauf in drei klare Schritte: Vor der Fahrt plant der Nutzer seine Strecke, schnell und einfach. Während der Fahrt begleitet die Route als Navigation, und danach kann man Feedback geben, um die Plattform und das eigene Profil besser zu machen. Kommt unterwegs etwas Unerwartetes wie Platzregen, bleibt man flexibel und kann direkt eine neue Route planen. Für unseren finalen Entwurf haben wir uns besonders auf eine intuitive und umfassende Planung konzentriert.

Routenprofile

Unser finales Konzept basiert auf Routenprofilen, die dem Nutzer Kontrolle über die Routengenerierung geben, ohne ihn bei der Erstellung zu überfordern. Ein Nutzer kann mehrere Routenprofile anlegen, die jeweils aus individuell festgelegten Einstellungen bestehen, zum Beispiel Distanz, Höhenmeter, Dauer, Richtung und weiteren Parametern. Beim Öffnen der App werden sofort passende Routenvorschläge zu den vorhandenen Profilen angezeigt. Durch einen horizontalen Swipe über die Kachel kann einfach zum nächsten Profil und dessen Routenvorschlag gewechselt werden.

Routenkachel

Auf der Startseite ist unser Call-to-Action eine Variation dieser Routenkachel, die Details zur vorgeschlagenen Route zeigt. Sie macht den Einstieg leicht und lädt dazu ein, direkt loszulegen.

Kartendesign

Nach den ersten Prototypen wurde klar, dass das Aussehen der Karte die Entscheidungen der Nutzer stark beeinflusst und somit wichtig für den Erfolg unseres Projekts ist.
Wir haben verschiedene Websites entdeckt, die Karten mit unterschiedlichen Themes anbieten. Damit die Karte aber optimal zu unserem Gesamtdesign passt, haben wir Snazzy Maps genutzt, um einen eigenen Stil zu gestalten. So konnten wir Labels, Hintergrundfarben und weitere Details genau an unsere Bedürfnisse anpassen.
Beim Erstellen des Styles haben wir den Fokus darauf gelegt, ein Abenteuer- und Naturgefühl zu vermitteln, ohne die Lesbarkeit zu beeinträchtigen. Dafür haben wir ein leichtes Grün für Naturflächen, ein helles Braun für Stadt-gebiete und ein Pastellblau für Gewässer gewählt.

Bedienelemente

Die Bedienelemente in der Routeninfo-Ansicht setzen sich aus Header und Navbar zusammen. Sie sind minimalistisch gestaltet, fügen sich unauffällig in das Gesamtbild ein und lenken nicht von den Informationselementen auf dem Screen ab. Gleichzeitig bieten sie eine hohe Funktionalität und wirken stilistisch klar und aufgeräumt.

Navbar

Die Navbar ermöglicht links den Wechsel zwischen der Detailansicht und der Preview. Rechts befindet sich ein Button mit einem Save-Icon. Beim Speichern animiert sich das Icon zu einem Fahrrad. Durch Tippen auf das Fahrrad-Icon kann die Route anschließend über ein verbundenes Garmin-Gerät navigiert werden.

Header

Im Header gelangt man über den Zurück-Button links zurück zur Kartenansicht mit den Routenvorschlägen. In der Mitte werden der Routenname und die geplante Startzeit angezeigt, auf der die Routendaten basieren. Durch Tippen auf die Uhrzeit öffnet sich ein Pop-up zur Anpassung der Startzeit. Rechts befindet sich ein Options-Button mit Funktionen wie Teilen oder GPX-Download.

Details

Auf der Detailansicht werden alle wichtigsten Informationen angezeigt. Diese ist in mehreren vertikalen sections aufgeteilt.
Im Header stehen der Name der Route sowie Startdatum und Uhrzeit. Diese Angaben sind Grundlage für mehrere Ansichten und lassen sich per Klick ändern. Darunter befindet sich eine Karte mit der Strecke in unserer Primärfarbe ausgefüllt. Der Start- und Endpunkt ist mit einem dunkelgrauen Punkt vorgesehen. Basisinformationen wie Schwierigkeitsgrad, Dauer, Distanz, Höhenmeter und Durchschnittsgeschwindigkeit werden im unteren Bereich mit passenden Icons dargestellt.

Höhenprofil

Unter dem Titel zum Höhenprofil haben wir eine dynamische Beschreibung eingebaut, die die Steigung der ganzen Strecke auf einem Blick zusammenfasst.

Ausgeklapptes Höhenprofil
Diesen Bereich kann der Nutzer ausklappen, um einzelne Berge zu analysieren. Wurde es ausgeklappt, so wird standardmäßig der erste Berg ausgewählt. Auf dem Diagramm wird er in unseren vier Steigungsfarben angezeichnet.
Unter dem Diagramm wird der einzelne Steigungsabschnitt angezeigt. Direkt darunter erscheint der jeweilige Steigungsabschnitt mit den wichtigsten Informationen: der individuell berechneten Schwierigkeit, der Länge des Anstiegs in Kilometern, den überwundenen Höhenmetern sowie der durchschnittlichen Steigung in Prozent.

Preview

Für uns ist es entscheidend, dass sich Nutzer ein klares Bild von der vorgeschlagenen Route machen können, um ungeeignete Strecken frühzeitig auszuschließen. Dafür haben wir die Vorschau-Seite erstellt, die alle relevanten Informationen kompakt und visuell aufbereitet.
Die Route wird in sinnvolle, semantische Abschnitte unterteilt. In unserem Beispiel-Flow besteht die Strecke aus vier Teilen. So wird der Kontext einzelner Abschnitte deutlicher, etwa im ersten Teil, wo der Nutzer die Stadt verlässt und mit erhöhtem Verkehrsaufkommen rechnen muss.
Jeder Abschnitt ist dynamisch aufgebaut, einige Infos sind aber immer dabei. Dazu gehören ein passender Name, die Länge des Teilstücks in Kilometern, das Wetter und der Verkehr. Zusätzlich helfen ein Höhenprofil und ein Community-Bild aus dem Abschnitt dabei, sich die Route besser vorstellen zu können.
Die Seite ist vertikal scrollbar, und der aktuell sichtbare Abschnitt wird automatisch auf der Karte hervorgehoben. So behält man bei der Planung den Überblick, wo man sich gerade befindet.

Ausblick

Wir werden das Projekt in Zukunft weiterverfolgen. Da bereits ein Funktionsprototyp existiert, wissen wir, dass die Umsetzung realistisch ist. Als nächstes möchten wir die Erstellung der Routenprofile gestalten und den Feedback-Bogen entwickeln, der nach der Fahrt ausgefüllt wird. Damit schließen wir den Funktionskreislauf der App und schaffen eine durchgängige Nutzererfahrung.
Da wir beide die App auch selbst gerne nutzen würden, freuen wir uns besonders auf die nächsten Schritte und die weitere Ausarbeitung unseres Konzepts.