Lithys 2017: SBB - Digital Design Excellence

Lithys 2017: SBB - Digital Design Excellence

With the fully-featured SBB Community, we can cover countless customer needs, like information, support, inspiration, interaction and involvement. 

------------------------

SBB.pngCompany:  SBB                                                              

Entry submitted by: Daniel Schwarz (Community Manager)

Community: SBB Community

Lithy category:  Digital Design Excellence

 

SBB is the backbone of the Swiss public transport system, and day-to-day rail operations are the basis of what we do. SBB has been transporting people and freight for more than 100 years. Every day, it safely transports 1.21 million passengers and 205,000 tonnes of freight on time and in an environmentally friendly manner. By doing so, we are making an important contribution to the quality of life and competitiveness in Switzerland.

 

The objectives of the “SBB Community” are as follows:
- generating and using customer and expert knowledge.
- building our own reach and community; reducing dependency on others third-party social networks and platforms.
- 100% ownership of content and user data.
- increasing loyalty and customer retention
- better rankings in search engine results.
- e-mail deflection: shifting standard support requests into the community.
- co-creation: participation of customers and users in the development of new apps and websites.

The SBB Community offers a seamless customer experience between the website with information, timetable, ticket shop, and the customer engagement platform.

With the fully-featured SBB Community, we can cover countless customer needs, like information, support, inspiration, interaction and involvement.

 

Our unique design elements
The SBB Community offers the following design elements:

- Fully responsive design: supports an optimal representation on all devices.
- Interactive header (hero) image: display a vital community and invites the users to dive into the community.
Picture1.png
- Activity wall: display latest posts in an attractive presentation.
2.png
- Optimized forum boards: enables sorting of posts according to different criteria (latest, most important, open and solved)
3.png
- Improved and fully customized blog module: provides category filter, blog posts excerpts, paging and lean article design.
4.png- Preview Communities: provides three different areas of user participation. Every area offers “Idea and wishes” (ideation module; customized), “Errors and bug reports” (forum module; customized) and “Votes” (polls module; customized).
5.pngApart from the existing responsive design, all the design elements mentioned above, were implemented with a major redesign on 2 February 2017.

 

How we executed our design
Designing for performance is key today. Since the redesigns goal was to match the makeover of SBB.ch as closely as possible we needed to make sure that we were in total control of the frontend assets. Only by doing this we could make sure that everything looked similar – typography, layout, colors – and behaved lightning-fast.

Being on time is one of the traits that a railway company has to fulfill online too. We made an experiment to try a new approach to the development of skins for Lithium. We wrote all of the CSS stylesheets from scratch. At some point we could have declared the experiment as failed since the common procedure was to take a base skin from Lithium and overwrite start overwriting everything. This wasn’t an option since this produces overly complex code and hard to maintain.

The experiment succeeded and the results exceeded our expectations. We were able to reduce the file size of the CSS from 183 KB down to 26 KB (-86%). On a regular 3G connection that’s about 2.5s against 0.5s – a huge improvement for a mobile crowd.

 

Metrics to prove the success of our design excellence 
Since the major redesign on 2 February 2017, the community metrics have improved as follows:

- Traffic: 36% more page views, 41% more visits and 40% more unique visitors. Around half of this traffic is mobile.
- Members: 77% more completed registrations, member time (minutes per member) is increasing by 14%.
- Posts: 84% more posts.
- Kudos: x3 kudos and x2 kudos per post.

Source: Lithium Social Intelligence, Comparison of time periods 11/01/2016 – 01/31/2017 (before redesign) and 02/01/2017 – 04/30/2017 (after redesign).