N achdem ich mich seit der Abgabe der Maturaarbeit (dem Release der App) nicht mehr gemeldet hatte, komme ich nun mit grossen Updates zurück.

Erstmal ein kurzer Rückblick auf die vergangenen acht Monate:

Die App ist soweit gut angekommen und wurde von einigen Nutzern auch fleissig genutzt. Wie in der Arbeit erwähnt, möchte ich jedoch auch noch spielerische Elemente (Gamification) in die App integrieren, um die Nutzer längerfristig zu motivieren. Die App soll also nun von einem Werkzeug-Assistenten in einen smarteren Übe-Assistenten evolvieren (und bald sogar zu einem Social-Network expandieren).

Auch auf der technischen Ebene hat sich einiges getan. Pünktlich zur Präsentation meiner Maturaarbeit im Juni habe ich Nativescript auf Version 3.0 geupgradet, und eine neue Funktion hinzugefügt: Nicht vorhandene Stücke selbst zur Datenbank hinzufügen.
Inzwischen läuft die App mit der derzeit neusten Version Nativescript 3.3 (und den neusten TNS-Android runtimes).

Echtzeit-Aktualisierung dank Firestore-Upgrade

Zur wohl grössten Neuerung gehört das Firebase-Firestore-Upgrade. Ich habe mich entschieden auf eine neu veröffentlichtes Datenbank-System von Firebase umzusteigen: Firestore (Beta veröffentlicht im Oktober 2017). Auf die genauen Änderungen werde ich nicht eingehen, jedoch ist dieses Upgrade nicht abwärtskompatibel! Das bedeutet, dass man als Nutzer der Apphoven App entweder bei der derzeitigen Version der App bleibt und nicht upgraded, oder, das Upgrade macht, jedoch jegliche Übe-Sessions etc. verloren gehen. Sollte ein Nutzer der App unbedingt mit seinen alten Übesessionen und Stück-Daten umziehen wollen, kann er mich gerne kontaktieren.

Aber was sind die Vorteile des Upgrade?

Es ist nun deutlich einfacher eine Real-Time-Synchronisation zwischen Client und Datenbank aufzustellen. Ausserdem sind komplexe Datenstrukturen nun teilweise einfacher zu verwalten, bringen jedoch auch Nachteile mit sich: Die Vereinfachung löst zwar Umwege (User-Inputs bedürfen keines Reloads mehr) auf, lässt aber auch neue entstehen (Siehe Audio-Analyzer: Adding Markers).

Trotzdem habe ich mich für dieses Upgrade entschieden, da die App nun deutlich stabiler läuft: Wenn ein User ein Stück zur Übeliste hinzugefügt hatte, musste diese komplett neu geladen werden. Genau so hatte es sich überall in der App verhalten:

  1. App-Seite lädt Datenbank-Informationen (und verarbeitet diese)
  2. User fügt Stück / Movement / Recording / Recording Marker hinzu
  3. Datenbank nimmt Änderungen auf
  4. App-Seite lädt Datenbank-Informationen komplett neu (und verarbeitet diese)

Schritt 3. & 4. mussten „einzeln hintereinander“ in die App hineinprogrammiert werden. Die App hatte sich also wie ein Formular einer Webseite verhalten: Input tätigen, absenden, Seite lädt neu.

Mit dem Firestore-Upgrade werden die letzten drei Schritte zu einem kombiniert! Sobald der User ein neues Stück hinzufügt löst dies eine automatische Kette von Prozessen aus:

  1. App-Seite lädt Datenbank und horcht direkt nach Datenbank-Änderungen (FirestoreListener)
  2. User tätigt Input
    2.1 die Datenbank speichert diesen
    2.2 App registriert Änderung in Datenbank
    2.3 App lädt betroffene Änderung automatisch nach und aktualisiert User-Interface (UI)

Das Upgrade betrifft alle Komponenten der App, da jede auf den User-Informationen (wie der Übeliste: PieceList) basiert. Daher musste ich alle User-basierenden Datenbank-Aktionen der App neu programmieren: Über 1200 neue Zeilen Code sind hinzugekommen, über 600 wurden gelöscht (Siehe Github Commit 0289229).

Geplant & in Entwicklung: UI-Update & Gamification

upgrade plan apphoven early 2018Als nächstes folgen Updates für das User-Interface. Die jetzige Gestaltung gefällt mir zwar sehr gut (vor allem die des Audio-Analyzer und der Practice-Session-Komponente), dennoch möchte ich einige Änderungen vornehmen. Das jetzige Design fühlt sich zu sehr nach „Werkzeug“ an. Um also UX-Elemente der Gamification authentisch einbauen zu können, muss erst das UI für die anstehenden Änderungen vorbereitet werden. Als anzustrebendes Beispiel, bzw. Inspiration dient mir hierbei das Design der Headspace-App.

Practice-List Design Preview

Links wird zum einen das „alte“ Design der Piece-List-Komponente der Apphoven-App mit der neuen Version (Preview) der App verglichen. Weg von der abstrakten, vollgepackten, teils unübersichtlichen Liste, hin zu greifbareren Elementen, die mehr Übersicht bieten und deutlich besser aussehen. Mehr zum Redesign im kommenden Blogpost.