Ein Blick unter die Haube: Die Entwicklung einer App zum Aufzeichnen von Abenteuern

Simon · January 30, 2024

Ein Blick unter die Haube: Die Entwicklung einer App zum Aufzeichnen von Abenteuern

Falls du ihn noch nicht gesehen hast, wirf kurz einen Blick auf meinen vorherigen Beitrag, bevor du mit diesem hier loslegst. Er stellt die Blogserie vor und erzählt einen Teil der Entstehungsgeschichte von Pebbls.

Der Entwurf dieses Beitrags war viel länger – er ging auf einige technische Details der App-Entwicklung ein. Ob du es glaubst oder nicht: Manche Leute (wie ich) interessieren sich für so etwas. Ein paar meiner treuen Beta-Tester:innen haben mir aber geraten, dass es – trotz eines schicken „*Kannst du Nerd lesen?*“-Schalters, der den Großteil der technischen Inhalte versteckte – für alle, die mit so etwas nichts am Hut haben, vielleicht etwas zu viel sein könnte 😲.

Was du gleich liest, ist ein Artikel über einen Teil der technischen Entwicklung der Reise-Tracking-App Pebbls. Wenn du dich für Technik interessierst – oder wenn nicht, aber schlecht einschlafen kannst –, lies weiter. Ansonsten ist das völlig okay, du kannst diesen Beitrag überspringen. Beim nächsten Mal gibt es wieder Tipps zur Vorbereitung auf dein nächstes Abenteuer.

Wenn du wirklich sicher bist, dass du weiterlesen willst, muss ich nur noch kurz nachfragen: Hast du den vorherigen Beitrag wirklich gelesen? Das hilft enorm, um die zeitliche Abfolge zu verstehen.

Die Entwicklung der Pebbls-Tracking-App

An diesem Punkt der Geschichte ist es Juli 2017. Nur noch ein paar Tage, bis ich zu einem dreimonatigen Radabenteuer durch Frankreich und Spanien aufbreche, und noch ein paar Tage weniger, bis ich heirate.

Als autodidaktischer, freiberuflicher Full-Stack-Webentwickler lag mein Schwerpunkt vor allem darauf, datenbankgestützte Webanwendungen zu entwerfen und bereitzustellen. Die Entwicklung mobiler Apps war allerdings eine ganz andere Liga. Die Zeit lief, die Liste der Dinge, die vor der Reise noch zu erledigen waren, war lang (inklusive „heiraten“) – für Weiterbildung blieb keine Zeit.

Stattdessen habe ich mir eine hybride Lösung zusammengebastelt – ein etwas an Rube Goldberg erinnernder Aufbau: eine Drittanbieter-App, die im Hintergrund die GPS-Daten der Route sammelte, und eine einfache PHP- und JavaScript-Oberfläche, um die Pebbls (die Standort-Pins) zu erstellen und die Daten online zu synchronisieren. Diese Oberfläche lief auf einem Webserver auf meinem Android-Handy.

Die Benutzererfahrung war alles andere als ideal. Aber was erwartet man von etwas, das in weniger als ein paar Stunden gebaut wurde? Da ich der Einzige war, der mit diesem Teil des provisorischen Systems arbeiten musste, störten mich die Ecken und Kanten nicht. Es war etwas klobig, aber es hat seinen Zweck erfüllt.

Oberfläche des ersten Prototyps

An dieser Stelle würde ich dir gerne ein paar grobe Screenshots der Route in der ursprünglichen Pebbls-Weboberfläche zeigen – klobig, nicht responsiv und ohne Lazy Loading – zusammen mit einer eingebetteten Karte dieser allerersten Reise. Schließlich war das die Geburtsstunde von Pebbls, der Moment, in dem unser Hochzeitsreise-Abenteuer verewigt wurde. Das kann ich aber nicht. Die Ironie: Nach unzähligen Iterationen und Code-Neuschreibungen kann das System die Daten genau der Reise, für die Pebbls erschaffen wurde, nicht mehr lesen. Schlimmer noch: Sie scheinen sich im digitalen Nirwana aufgelöst zu haben. Ich bin mir ziemlich sicher, dass die Daten noch existieren, vergraben unter Terabytes anderer Daten auf irgendeinem unbekannten Backup. Ein Projekt, auf das sich mein zukünftiges Ich freuen kann.

In den paar Jahren zwischen damals und heute habe ich eine Art Besessenheit entwickelt (70+ Std./Woche), Pebbls von diesem provisorischen, kaum funktionsfähigen Prototyp zu einer stabilen Plattform auszubauen, auf der man Abenteuergeschichten teilt, sich inspirieren lässt und Kontakte knüpft. Das Erste, worauf ich mich nach meiner Rückkehr aus Gibraltar konzentriert habe (ich hab dich gewarnt, du musst den vorherigen Beitrag gelesen haben), war, mich in die Entwicklung mobiler Apps einzuarbeiten.

Die Wahl eines Frameworks für mobile Apps

Da ich aus der Webentwicklung komme und es ein Soloprojekt ist, wollte ich unbedingt ein Framework finden, bei dem ich meine vorhandenen Fähigkeiten nutzen konnte. Außerdem war mir wichtig, eine einzige Codebasis für die iOS- und die Android-Version der App pflegen zu können. Ich habe mir ein paar Optionen angesehen und mich zunächst für Cordova entschieden. Cordova wirkte wie ein recht unkomplizierter Ansatz, und weil es HTML, CSS und JavaScript nutzt, sprachen wir weitgehend dieselbe Sprache. Damals schien das für mich der bequemste Einstieg zu sein. Ich habe einige Zeit damit verbracht, mich mit den Grundlagen vertraut zu machen, und mich an der „Universität YouTube“ auf den neuesten Stand gebracht. Nach ein paar Wochen hatte ich die erste eigenständige Testversion der Pebbls-Tracking-App gebaut. Als Machbarkeitsnachweis war das ein riesiger Meilenstein.

Die Oberfläche, die ich mit Cordova gebaut hatte, war zwar hässlich, aber endlich konnte ich mit echten Praxistests beginnen. Es dauerte allerdings nicht lange, bis mir klar wurde, dass genau das, was mich anfangs an Cordova gereizt hatte, auch seine Achillesferse war. Cordova schien in Ordnung zu sein, um eine App mit echtem HTML/JavaScript zu bauen, die in einen Container verpackt und auf Mobilgeräte gebracht werden kann – echte native Funktionalität zu erreichen, war aber eine ganz andere Geschichte. Es fühlte sich zusammengestückelt und einschränkend an, besonders bei Funktionen, die für mich nicht verhandelbar waren: Standortermittlung im Hintergrund, regelmäßige Hintergrundaufgaben, Zugriff auf das Dateisystem und einiges mehr. An die konkreten Probleme erinnere ich mich nicht mehr, aber ich beschloss, die Reißleine zu ziehen und neu anzufangen. Diesen Prozess habe ich mit insgesamt vier Frameworks durchlaufen: Cordova, Flutter, Ionic und schließlich React Native.

Logos von Frameworks für mobile Entwicklung – Cordova, Flutter, Ionic, React Native

Die Wahl des richtigen Frameworks wurde zu einem langsamen und frustrierenden Prozess. In jedem davon habe ich so etwas wie einen Tracking-App-Prototyp gebaut. Das hat viel Zeit gekostet (ein paar Monate), aber am Ende hat es sich gelohnt, und die endgültige Entscheidung fiel mir wirklich leicht – der klare Sieger war für mich React Native (mit Expo und EAS). Ich habe es nie bereut.

React Native hat mich wirklich überzeugt – nicht nur als leistungsfähiges, modernes Framework, sondern auch wegen der Energie und Begeisterung drumherum. Es gibt eine sehr aktive Community aus Entwickler:innen, Maintainer:innen und Modul-Autor:innen, und Dokumentation und Tutorials sind umfangreich. Das Engagement, die Plattform weiterzuentwickeln, und zu sehen, wie Funktionen, die ich brauchte, so schnell aktiv entwickelt und umgesetzt wurden, war sehr beruhigend. Ich wurde nicht enttäuscht.

Die Entwicklung der Pebbls-Tracking-App im Laufe der Zeit

React Native und der von Expo verwaltete Workflow mit EAS waren für mich als Solo-Entwickler ein echter Wendepunkt – jetzt, wo ich den Dreh raushabe, kann ich mit deutlich weniger Kopfschmerzen entwickeln und veröffentlichen. Der Umstieg von einem HTML- und CSS-basierten System wie Cordova auf das React-Framework war eigentlich gar nicht so schmerzhaft. Noch beeindruckender ist, wie mühelos die EAS-Build-Pipeline komplexe Aufgaben wie Zertifikate und Schlüsselsignierung erledigt, die sonst Stunden verschlingen können, wenn sie von Normalsterblichen wie mir, die so etwas nicht täglich machen, von Hand erledigt werden. Und obendrein ist einer der größten Vorteile für mich, wie einfach es ist, Fehler zu entdecken (mit Tools wie Logrocket), sie zu beheben und Over-the-Air-Updates an die Nutzer:innen auszuliefern. Vom Eingang eines Fehlerberichts bis zur Auslieferung der Korrektur auf die Geräte der Nutzer:innen dauern diese Updates nur wenige Minuten.

Testen, testen, testen

Zur Entwicklung jeder Software gehört ein gründliches Testprogramm. Je mehr Szenarien wir durchspielen können, desto besser können wir ein reibungsloses Nutzererlebnis sicherstellen und desto geringer ist die Wahrscheinlichkeit, dass Nutzer:innen im echten Leben über Fehler stolpern. Simulatoren und Tools zum Vortäuschen von Standorten haben zwar ihren Zweck, aber irgendwann musst du mutig sein, die Tür öffnen, rausgehen, deinen Körper an Vitamin D erinnern und draußen in der großen, weiten Welt testen. Als die erste voll funktionsfähige Version der Pebbls-Tracking-App fast fertig war, hatte ich überallhin 2 oder 3 Geräte dabei. Diese Geräte zeichneten jeden meiner Schritte auf und meldeten alles an den Pebbls-Server. Zu Hause wartete dann eine wahre Schatzkiste an Daten auf mich. Dieser Prozess war von unschätzbarem Wert, um Fehler aufzuspüren und zu beseitigen und die Performance zu verbessern.

Die Pebbls-Tracking-App unterwegs testen

Der nächste Testschritt war, die App auf ein weiteres echtes Abenteuer mitzunehmen. Ein paar Beta-Tester:innen waren bereits genau damit unterwegs, aber es war mir wichtig, das auch selbst zu tun – um die besten und schlechtesten Seiten der App selbst zu erleben. Also habe ich nach einer Corona-bedingten Verzögerung (siehe vorheriger Beitrag) genau das getan. Lucy und ich sind 6 Monate lang mit dem Rad quer durch Europa und die Türkei bis nach Georgien gefahren. Wir haben unsere Route die ganze Zeit aufgezeichnet und regelmäßig angehalten, oft an einem Berghang oder einer zerklüfteten Küste, um Fehler zu beheben und Funktionen weiterzuentwickeln. Dieser Praxistest war entscheidend – so konnte ich sehen, wie sich die App unter verschiedensten GPS- und Netzbedingungen verhält. Diese Erfahrung wurde ein fester Bestandteil der App-Entwicklung und hat sie für andere Abenteurer:innen robuster und zuverlässiger gemacht.

Simon und Lucy radeln auf einem von Bäumen gesäumten WegMit dem Bikepacking-Rad durch ParisVerschneite Aussicht in der Türkei auf einer Bikepacking-TourSimon arbeitet an einem Wildcamping-Platz am LaptopHafenszene in Batumi, GeorgienLucy radelt an einer Festung in Albanien vorbei

Auf Feedback hören und ständig besser werden

Bei Pebbls geht es nicht nur darum, deine Reise aufzuzeichnen, sondern darum, echte Geschichten zu erzählen und sich inspirieren zu lassen – es geht um die Community aus Abenteurer:innen und Entdecker:innen, die die Plattform nutzen. Ich bitte Nutzer:innen aktiv um Feedback und Kommentare zu ihren Erfahrungen. Diese Einblicke und Vorschläge spielen eine entscheidende Rolle dabei, die Funktionen der App zu gestalten. Viele der Verbesserungen, die es heute in Pebbls gibt, sind aus Vorschlägen von Nutzer:innen entstanden – die Integration von GPX und Strava, neue Pebbls-Symbole, eine verbesserte Benutzeroberfläche oder eine bessere Performance. Dein Feedback ist die treibende Kraft hinter dieser ständigen Weiterentwicklung. Ich veröffentliche regelmäßig Updates auf Basis deiner Vorschläge, damit Pebbls so wächst, dass es den Bedürfnissen von Abenteurer:innen wie dir gerecht wird.

Melde dich

Bereit, die Zukunft von Pebbls mitzugestalten? Ich würde mich freuen, von dir zu hören. Teile deine Abenteuer, Ideen und dein Feedback über die Kontaktseite oder an hello@pebbls.com