SBB.ch – Relaunch

SBB.ch is the most visited online platform in Switzerland. In a 20-month lasting process it has undergone a complete redesign. Besides being fully responsive, the big novelties can be found in the optimized connection form as well as the revamped Leisure and Vacations and Stations sections.

With a website that has to meet so many different needs, we followed two simple principles: flexibility and consistency. We created six main page types and 70+ modules. They allow a flexible approach for the publishing team when creating content, while achieving a consistent user experience throughout the numerous pages in the SBB online universe.

General structure and navigation

When starting the conceptual process, we defined universal patterns, that help the user navigate within and through the thousands of content pages of SBB.ch. We encourage users to navigate through content-teasers, but the mega-dropdown, which gives access to the first three levels, still plays a major role when it comes to directly accessing specific pages.

Navigating within the pages

When defining the user-flows, our main goal was to get the user to the desired information with as few clicks as possible. We analyzed existing click paths and optimized them by limiting the hierarchical levels and creating added values for jump pages that formerly had the sole purpose of guiding users to deeper levels.

Functional breadcrumbs

As we could not avoid getting into more than three levels, we decided to use functional breadcrumbs as means of navigation. Such that the user can conveniently navigate to all parent and sibling pages while having a clear understanding of his or her whereabouts.

Collapsable, sticky next best click module

One important feature for content pages are the next best click (NBC) modules. All relevant information that leads to transaction, contact, downloads or alike is gathered in the right column. On long pages we wanted to make sure that the user always has the relevant NBCs at hand. So when scrolling, we make the modules collapse one after another and stay sticky on the top right area of the viewport. On mobile the NBCs are always accessible bottom right and open as a contextual layer.

2017
Website
Concept, UX DIRECTION, Art Direction, Frontend
w/ UNIC

SEE PROJECT

Master of Best of swiss web 2018
Gold –  Usability Best Of Swiss Web 2018
Silver – Mobile  BEST OF SWISS WEB 2018
3x Bronze – Business, Marketing, Public Affairs  BEST OF SWISS WEB 2018
SILVER ANNUAL MULTIMEDIA 2018

You might also like: