Es ist geschafft: Das Redesign der SBB Mobile App ist im Oktober 2022 live gegangen. Mit 3.5 Millionen aktiven Nutzer:innen pro Monat und 300'000 verkauften Billetten pro Tag ist sie absatzstärkster Vertriebskanal der SBB.
Das erzeugt Druck: Wie geht man damit um, wenn gefühlt die halbe Schweiz mitredet und kritisiert? Wie verändert man die beliebteste App der Schweiz unter Beobachtung von Herrn und Frau Schweizer?
Immer an deiner Seite
SBB Mobile begleitet Reisende persönlich – vor, während und nach ihrer Reise. Diese Vision war im Redesign Fixstern für das gesamte Team und vor allem auch mich als UX-Designerin. Die besondere Herausforderung: Die Nutzer:innen waren mit der bestehenden App vertraut. Sie wussten genau, wo welche Funktionen sind, kannten den Fahrplan und kamen so rasch zur gewünschten Information. An diese hohe Zufriedenheit wollten wir mit der neuen App anknüpfen. Deshalb haben wir ein sanftes Redesign entwickelt, welches nicht alles auf den Kopf stellt und trotzdem Platz für Neues zulässt.
SBB Mobile ist der persönliche digitale Reisebgleiter eines jeden ÖV-Reisenden in der Schweiz.
Vision SBB Mobile
Alles Wichtige im Blick
Die wohl auffälligste Veränderung ist die neue Navigationsstruktur. Das Hamburger-Menü oben links sowie die Startseite haben ausgedient. Nachfolger ist die neue Tab Bar am unteren Bildschirmrand, wie man sie von vielen Apps kennt. Sie ist das Herzstück des Redesign und ermöglicht von überall einen direkten Zugang zu den Kernfunktionen der App. «Überraschend und im ersten Moment etwas gewöhnungsbedürftig», ist kein seltenes Feedback, das ich zu hören bekomme. Gefolgt von Lob und einem «aber ich habe mich schnell daran gewöhnt».
Für Nutzer:innen gilt es, sich mit der neuen Ordnung sowie den sechs verschiedenen Tabs vertraut zu machen, um wieder halb blind, auf den Zug rennend, in letzter Sekunde ein Billett kaufen zu können. Denn das ist doch der wahre Wert der App, wie ich finde.
Eine runde Sache
Wer genauer hinschaut, erkennt die Rundungen im neuen Designstil. Wo früher Kacheln und Ecken dominierten, sorgen heute subtile Rundungen an UI-Elementen für ein angenehmes Erscheinungsbild. Die Benutzeroberfläche fühlt sich organisch und freundlich an und ist für unterschiedliche Altersgruppen intuitiv bedienbar. Dies ist besonders wichtig, weil die App verschiedenste Zielgruppen zufriedenstellen will: Von Teenagern bis zu Senior:innen, alle sollen sich wohl fühlen.
Vor, während und nach der Reise
User Interfaces sind im besten Fall minimalistisch, denn das macht sie benutzerfreundlicher. Aber sie sollen auch positive Emotionen auslösen, indem sie ästhetisch und unterhaltend sind. Der moderne, minimalistische Stil angereichert mit Illustrationen, bringt in der SBB Mobile App beides zusammen. Illustrationen von Alltagssituation lassen die Nutzer:innen schmunzeln und unterstützen die Verständlichkeit des Inhalts.
Die unterschiedlichen Elemente des Designs sind als bewegliche Teile konzipiert. Sie verbinden sich, um eine Geschichte zu erzählen. Dies kommt beispielsweise bei der Illustration der Reisebegleitung stark zum Tragen: Vor der Reise sieht man eine Frau, auf dem Perron, die sich verabschiedet. Während der Reise, sieht man sie im Zug sitzen. Nach der Reise verlässt sie den Bahnhof. Die Illustrationen wechseln zeitgenau zur gespeicherten Reise, die Begleitung der Reisenden kommt auch da auflockernd zum Einsatz.
Für jede Situation die passende Visualisierung
Wer erinnert sich noch an das kleine Symbol in Form des Kopfs eines Kundenbegleiters - von vielen liebevoll «Hoppla-Männchen» genannt? Das Männchen tauchte immer auf - egal ob es sich um eine Fehlermeldung oder eine Bestätigung handelte. Diese generische Verwendung führte teilweise zu Verwirrung und unnötigen Anfragen im SBB Contact Center.
Im Redesign erhielt der Kundenbegleiter ein frischeres Aussehen. An seiner Seite taucht abwechselnd die Frau am Schalter auf. Beide unterstützen auf witzige Art, Hinweise oder Erfolgsmeldungen in der App. Fehlermeldungen werden mit der typischen Anzeigetafel der SBB mit der roten Störungsmeldung dargestellt. Diese Illustration schafft einen Wiedererkennungseffekt aus der realen Welt und vermittelt, auch ohne den Text zu lesen, die negative Botschaft.
Illustrationen wecken Emotionen
Die Aufmerksamkeitsspanne von Nutzer:innen ist oft unglaublich kurz. Illustrationen sind eine effiziente Möglichkeit, eine Information auf einen Blick zu vermitteln. Zudem schaffen Illustrationen und Animationen schöne kleine Momente, die zum Erlebnis werden. Mit ihrer Verspieltheit und freundlichen Atmosphäre prägen sie die Erinnerung der Nutzer:innen. Ich finde es erstrebenswert, etwas zu schaffen, das nicht nur funktional sondern auch sympathisch und unvergesslich ist. In enger Zusammenarbeit mit dem Illustrator konnte ich diese Kreationen bereitstellen und ins Design einfliessen lassen. Die Marke SBB hat ihren grossen Wiedererkennungswert erhalten, hebt sich jedoch mit diesem neuen Designelement in der App ab.
Konsequent bis ins letzte Detail
Empty States, Fehlermeldungen, Bestätigungsscreens und Feedbacks haben durch Illustrationen einen neuen Wert erhalten. Rundungen führten zu einem angenehmen Erscheinungsbild. Doch das ist nicht alles. Durch Micro Interactions wird der User noch stärker geführt. Egal ob Digital Natives oder ältere Zielgruppen – Micro Interactions sind für alle Nutzer:innen unmittelbare und allgemein verständliche Feedbacks auf eine Aktion. Wer beispielsweise mit EasyRide unterwegs ist, sieht anhand des Zustands des EasyRide-Icons in der Tab Bar, ob das Check-in immer noch aktiv ist. Wer ein Billett kauft, erkennt durch die kleine rote Coachmark in der Tab Bar, wo das Billett gelandet ist. Winzige Details, welche aber wesentlichen Beitrag dazu leisten, sich im neuen System zurecht zu finden.
Weiter arbeiteten wir an der Adaption des Corporate Design für den Light und Dark Mode. Sehr sorgfältig wurden vorgängig alle Screens mit unterschiedlichen Zuständen in den sogenannten Dark Mode adaptiert. Der Dunkelmodus ist ein Designtrend, der sich rasch verbreitet hat. Einerseits kann damit Strom gespart werden und generell gilt er schonender für die Augen. Selbstverständlich wurden auch alle Illustrationen speziell für den Darkmode ausgearbeitet. Der Sternenhimmel oder die Strassenlaterne leuchten und die kleinen Geschichten bekommen nochmals neuen Interpretationsspielraum.
Was mir persönlich an der App sehr gut gefällt, ist die Liebe zum Detail. Trotz des strengen SBB Corporate Designs, kommen viele einzigartige und neue Elemente zum Einsatz.
Natalie Kauer
Senior User Experience Designer
Lernen von den Reisenden
Das Schöne an digitalen Produkten: Sie sind nie fertig und man kann sie stets weiterentwickeln. Die Auszeichnung mit Gold in der Kategorie Usability an den Best of Swiss Apps 2022 war ein wichtiger Meilenstein. Auf dieses Juryurteil sind wir unglaublich stolz: «Die meistgenutzte App der Schweiz, SBB Mobile, kommt in einer neuen Auflage daher. Sie zeugt von einer hohen Maturität. Die bewährten Funktionen bleiben gleich, mit wenigen Verbesserungen in der User Experience. Gleichzeitig wurde die Userführung verbessert, um Raum für relevantere Informationen zu schaffen. Aufgefallen ist die Funktion 'Reise speichern', die neu ohne Login funktioniert. Pendlerinnen und Pendler werden Freude an der App haben. Alles richtig gemacht, was nicht selbstverständlich ist.»
Aber wir wollen an diesem Punkt nicht stehenbleiben, sondern die App kontinuierlich weiterentwickeln: Die SBB hat noch viel vor und versucht Feedback der Kund:innen im möglichen Rahmen umzusetzen. Nun werden Erfahrungen mit der Nutzung der App gesammelt und ausgewertet und die Vision vorangetrieben. Ich bin gespannt, wie die App sich verändern wird und freue mich, intensiv daran mitzuarbeiten.
Kontakt für Ihre digitale Lösung mit Unic
Termin buchenSie möchten Ihre digitalen Aufgaben mit uns besprechen? Gerne tauschen wir uns mit Ihnen aus.
Wir sind da für Sie!
Termin buchenSie möchten Ihr nächstes Projekt mit uns besprechen? Gerne tauschen wir uns mit Ihnen aus.
