Flutter-based Xparking App by Ergosign
Dorian Bauer Martin Roos Sandra Engel

XParking-App

Dorian Bauer Lead UX Software Engineer, Technology Lead WPF, Team Manager

Martin Roos Lead UX Designer

Sandra Engel Senior Communication Manager, Lead Management Expert

25.09.2019 • 5 Minuten Lesezeit

Zur Evaluation von Flutter kam ein kleines Team unserer Software Engineers auf die Idee, das Framework an einem realen Projekt zu testen: einer App zur Organisation des Parkplatz-Sharings an unserem Saarbrücker Standort.

„Wie gut ist eigentlich Flutter? Eignet es sich auch für unsere Kundenprojekte?“ Mit dieser Frage tat sich ein kleines Team von Ergosign Software Engineers während der Focus Time zusammen. Und um beurteilen zu können, ob sich das vielversprechende Framework auch für Kundenprojekte eignet, muss es erstmal getestet werden.

Youtube Video: What's new in Flutter 2019

Flutter ist ein Framework von Google, welches es Entwicklern erlaubt, Apps für mobile Geräte (iOs und Android), Web und Desktop basierend auf nur einer Codebasis zu entwickeln.

Dabei reichte dem Team die reine Theorie nicht. Ein realer Use Case sollte her, für dessen Lösung eine App genau das Richtige wäre.

Das Projekt

Eine passende Projektidee war schnell gefunden: das Parkplatz-Sharing an unserem Standort in Saarbrücken.
Denn unsere Mitarbeiter können ihren Arbeitsweg flexibel gestalten: mit einem Jobticket, einem Jobrad, zu Fuß oder per Auto. Im letzten Fall erhalten sie einen zugewiesenen Parkplatz. An manchen Tagen kann es für Mitarbeiter, die normalerweise mit dem Rad, zu Fuß oder per Bahn kommen, jedoch sehr praktisch sein, einen Parkplatz nutzen zu können. Um transparent zu zeigen, ob dies möglich ist, weil beispielsweise ein zugewiesener Parkplatz eines anderen Mitarbeiters leer stünde, sollte mithilfe von Flutter eine App entwickelt werden. Über diese sollten beispielsweise „leerstehende“ Parkplätze gebucht oder zugewiesene Parkplätze für andere Mitarbeiter freigegeben werden können.

Begrenzte Ressource, begrenzte Zeit? „Lean“ und „collaborative“ sind die Lösung!

Neben unseren Software Engineers Dorian, Steffen und Lisa war UX Designer Martin begeistert von der Idee, eine App zum Parkplatz-Sharing zu entwickeln. Da das Team die App in der Focus Time entwickelte, welche einmal im Monat stattfindet, schlug er vor, das Projekt lean durchzuführen und die Methoden aus dem Buch „Collaborative UX Design“ von Dieter Wallach und Toni Steimle zu nutzen.

Collaborative UX Design von Wallach und Steimle

Vorgehen und Milestones

Hypothesen und Theorie

Klassisch startete das Team mit Projekthypothesen. Unter Beachtung der How-Might-We-Fragen entstand Folgendes:

Problem Statement

„Wir denken, dass Ergosign-Mitarbeiter am Standort Saarbrücken ohne eigenen Parkplatz (zu Fuß, mit Fahrrad oder ÖPNV) ein Problem haben an Tagen, an denen es für sie nützlich wäre (schlechtes Wetter, Einkäufe, etc.), einen freien Parkplatz (Puffer-Parkplätze oder abwesende Mitarbeiter) garantiert zu bekommen.“

Lösungsansatz

„Wir können ihnen mit der Bereitstellung einer einfach und schnell zugänglichen App helfen, über freie Parkplätze informiert zu werden und diese darüber verbindlich zu reservieren.“

Metrik

„Wir wissen, dass wir richtig liegen, wenn sie bei real freien Parkplätzen über diese informiert werden und diese dann auch verbindlich reservieren können.“

In diesen Hypothesen steckt, neben den HMW-Fragen und ihren Antworten, ein weiterer wichtiger Aspekt: die Proto-Personas. Von diesen entwickelte das Team drei:

Alle Personas wurden mit ihren Merkmalen, Problemen und Aufgaben skizziert; das Team fokussierte sich im ersten Schritt dann auf die primäre Persona „Mitarbeitende ohne festen Parkplatz“.

MVP, Visual Design und Pixel Warriors

Um die Zeit bestmöglich zu nutzen, sollte ein MWP (Minimum Viable Product) entstehen, der im ersten Schritt den Mitarbeitenden ohne Parkplatz den wichtigsten Funktionsumfang bietet:

  1. einen Parkplatz buchen zu können
  2. einen gebuchten Parkplatz freigeben zu können

Entwickelt wurde das MVP von unserem Praktikant Sven im Rahmen seiner Bachelorarbeit. Er setzte es nicht nur in Flutter um, sondern auch den Server sowie die Datenbank der App auf – alles mit der Unterstützung von Software Engineer Lisa.

Für das MVP musste natürlich auch ein Visual Design her. Also tat sich das Team mit den Visual Design Field Leads Nina und Sascha zusammen und kreierte eine Pixel Warriors Challenge.

Designergebnis der Meetingraum-Challenge
Pixel-Warriors-Challenge der Xparking-App

Was die Pixel Warriors sind und wie die Challenge funktioniert erklärt dieser Artikel im Detail.

Testing & Feedback

Zur Validierung des MVP wählte das Team zehn Mitarbeiter aus Saarbrücken nach bestimmten Kriterien aus. Diese durften das erste MVP bereits testen. Ihr wertvolles Feedback zu den ersten umgesetzten Features fließt nun in die Weiterentwicklung der App ein.

Um welche Features die App nach diesem ersten Test erweitert wurde, wie sie umgesetzt sind und welche Ideen das Team noch in petto hat, erfahren Sie bald im zweiten Teil des Artikels. Stay tuned!

Weitere Insights

IMEDALytics - Healthcare Machine Learning

IMEDALytics - Healthcare Machine Learning Research

Kickstarter Icon Design

Kickstarter Icon Design Artikel