DVB mobil
DVB mobil ist die offizielle App der Dresdener Verkehrsbetriebe AG.
Nutzer*innen können sich mit Hilfe dieser App Verbindungen im öffentlichen Nahverkehr suchen um durch die Stadt Dresden und Umgebung von einem zum anderen Ort zu kommen. Die App selbst ist nicht nach iOS GUI gestaltet, und in ihrer Darstellung an vielen Stellen unübersichtlich oder beinhaltet zu viele Features. Auch optisch ist die App leider nicht schön gestaltet.
Header + Tabbar
Im ersten Schritt habe ich mir den Header und die Tabbar genauer angeschaut. Beides ist im Original mit vielen Icons versehen, welche zu klein und zu eng aneinander dargestellt sind.
Header
Im Header wurde das Hamburger Menü entfernt, weil es nicht den iOS GUI entspricht. Auch das Logo der DVB wurde aus dem Original entfernt, durch die gelbe Farbe im Header wird dem/der Nutzer*in kenntlich gemacht, in welcher App er/sie sich befindet. Die Icons, welche sich unten in der Tabbar teilweise wiederholt und deswegen für Verwirrung gesorgt haben, wurden ebenfalls entfernt. Auch die Abstände zwischen den Icons waren nicht groß genug.
Tabbar
In der Tabbar wurden ebenfalls unnötige Icons entfernt, auch die Benennung der Icons war zu klein, da die Schriftgröße auf dem Handy nicht zu erkennen und zu lesen war. Hinzukommt, dass nicht ersichtlich war, wo man sich gerade in der app befindet, weil es weder im Header noch in der Tabbar angezeigt wurde.
Im Redesign er Tabbar habe ich mich auf zwei Aktionen, welche bei der Nutzung der App von Bedeutung sind, beschränkt. Nämlich der Verbindungssuche und den Tickets. Die Typo habe ich entsprechend der iOS GUI angepasst. Dies soll für weniger Verwirrung sorgen und den Nutzer*innen klar kommunizieren wo sie sich befinden.
Verbindungen
Original
Nach Eingabe von Startpunkt und Zielpunkt war nicht zu erkennen, welcher Button für die Suche zuständig ist. Da die Typo zur Beschreibung der Icons ebenfalls sehr klein ist, wird nicht ersichtlich, dass die Lupe ebenfalls der Button für die Suche der Verbindungen darstellen soll.
Auch die Änderung des Zeitpunktes der Abfahrt oder Ankunft ist irreführend, da nicht klar ist, dass sich hierbei um ein drop down menü handelt.
Redesign
Nutzer*innen wird durch eine Überschrift kommuniziert was sie auf dieser Page tun können und zu sehen ist. Der Suche Button ändert seine Farbe und macht den Nutzer*innen deutlich, dass nach Eingabe der Abfahrt und Ankunftspunkte die Suche gestartet werden kann. Auch die Zeitangabe ist klar erkennbar.
Zusätzlich habe ich die Störungsmeldungen in den Suche Screen eingebaut sodass Nutzer*innen sofort erkennen können, welche Linien verfügbar sind und welche nicht. Die Farben der Linien habe ich an das Originallinienetz von Dresden angepasst.
Verbindungsanzeige
Original
'Zurück'Button ist in der Tabbar unten
Beschreibung der Page ist zu unauffällig
Suchangaben sind kaum erkennbar sowie Datum
Anzeige für benutzbare Verkehrsmittel zu dominant
frühere Verbindungen nicht erkennbar
Redesign
'Zurück' Button ist im Header
Beschreibung der Page sichtbarer durch größere Schrift
Suchangaben unter die Beschreibung der Page platziert -> ersichtlicher
Datumsanzeige vergrößert
Anzeige für Benutzbare Verkehrsmittel rausgenommen
frühere Verbindungen durch scrollen nach oben angedeutet, spätere Verbindungen durch Scrollen nach unten
Icons der Verkehrsmittel angepasst, Farbe aus Liniennetzwerk, Beschriftung um welches Verkehrsmittel es sich handelt eingefügt, Zeiten für Abfahrt, Ankunft und Fahrtdauer hervorgehoben
unwichtige Informationen entfernt
Verbindung Detailansicht
Original
Verbindungsübersicht und Detailanzeige sind zwei verschiedene Screens
Durchklicken durch viele Screens für andere Uhrzeiten
Redesign
durch klicken auf eine der Verbindungen kommt man auf die Detailansicht
Zusammenfügen der beiden Pages (Verbindungsübersicht + Detailanzeige)
Tickets
