Startseiten-Refresh für den VBB

Wir haben die Ausschreibung für den Servicevertrag beim VBB gewonnen und durften auch das Startseiten-Design anpassen.

Neue Navigation und Startseiten-Design für den VBB

Die Website des Verkehrsverbunds Berlin-Brandenburg (VBB) ist eine zentrale Anlaufstelle für ganz unterschiedliche Zielgruppen. Von Privatkund:innen, die auf der Suche nach Fahrplänen sind, bis hin zu Geschäftspartnern, Behörden oder Verkehrsunternehmen. Der Verkehrsverbunds Berlin-Brandenburg (VBB) ist nach Fläche der größte und nach Einwohnerzahl von 6,3 Mio. der zweitgrößte Verkehrsverbund Deutschlands. Jährlich nutzen ca. 1,5 Mrd. Fahrgäste die Angebote des VBB. 

Damit alle User schnell und barrierefrei an ihr Ziel kommen, wurde die Startseite grundlegend überarbeitet und die Navigation neu strukturiert. Ziel war es, eine klare Trennung zwischen B2C- und B2B-Angeboten zu schaffen, ohne dabei den Wiedererkennungswert oder die gestalterische Konsistenz der Website zu verlieren.

Wie bei allen Projekten entstand das neue Konzept in enger Abstimmung mit dem Team des VBB. Wir möchten uns an der Stelle noch einmal ausdrücklich für die tolle Zusammenarbeit bedanken.

Was bringt die klare Trennung der verschiedenen Nutzer mit sich?

Die bewusste Unterscheidung zwischen Endkund:innen (B2C) und Geschäftspartnern (B2B) hat viele Vorteile:

• Erhöhte Relevanz: Inhalte sind zielgruppengenau erreichbar.

• Bessere Nutzererfahrung: Klarere Wege durch die Seite minimieren Frustration und fördern die Zufriedenheit.

• Effizientere Kommunikation: Passgenaue Informationen für jede Zielgruppe sparen Ressourcen und stärken die Wirkung der Inhalte.

• Verbesserte Außenwahrnehmung: Beide Gruppen fühlen sich gezielt angesprochen, niemand wird vergessen.

Konsistentes Design für alle

Gestalterisch bleibt die Website durchgängig konsistent, die Designlinie wurde bewusst so gewählt, dass sie sowohl B2C- als auch B2B-Zielgruppen anspricht. Farbwelt, Typografie und Aufbau sorgen für Wiedererkennung und Markenstärke. Das Design haben wir in enger Zusammenarbeit mit der Agentur boy entwickelt. Die partnerschaftliche und kreative Zusammenarbeit hat das Projekt sehr positiv beeinflusst. 

Die inhaltliche Umsetzung unterscheidet sich jedoch deutlich:

• B2B-Bereich: reduziert, klar, sachlich. Wenige Inhaltselemente, dafür strukturierte Informationen.

• B2C-Bereich: lebendiger, visuell aktiver. Eyecatcher, Teaser und gezielte Störelemente lenken die Aufmerksamkeit und fördern die Interaktion.

Für unsere Designer:innen war das eine vollumfassende, aber schöne Herausforderung.

Gestalterisch setzt die neue Website auf eine moderne Designsprache: Eine Mischung aus Neumorphism und Glass-Morphism verleiht der Oberfläche eine klare, zeitgemäße Optik ohne viel Ablenkung.

Wie schon bei der Vorgängerversion war es uns und dem VBB besonders wichtig, dass alle Inhalte barrierefrei nutzbar bleiben. Die technische Umsetzung folgt den gängigen Standards zur digitalen Barrierefreiheit (u. a. WCAG) und stellt sicher, dass die Website für alle Menschen zugänglich ist, unabhängig von Endgerät, Einschränkungen oder technischer Affinität. Das TYPO3-CMS ist dafür bestens geeignet.

Das Herzstück der Überarbeitung bildet die angepasste Startseite. Sie wurde konsequent auf die Bedürfnisse der Nutzer:innen ausgerichtet: Fahrgastinformationen, Störungsmeldungen sowie Tickets & Preise wurden deutlich prominenter platziert und sind jetzt mit wenigen Klicks erreichbar.

Ein weiteres Highlight ist der neue „ÖPNV-Faktencheck“, ein interaktives Element im unteren Bereich der Seite, das spielerisch Wissen rund um den öffentlichen Nahverkehr vermittelt. Er bietet Nutzer:innen einen ungewöhnlichen Zugang zu Unternehmensinhalten und lädt dazu ein, sich tiefer mit der Arbeit und dem Angebot des VBB zu beschäftigen.

Die neue Startseite gibt es hier zu sehen:
Zum VBB