A platform on sustainability as an interactive element in CSR marketing - Sparkasse Bodensee


The project objective was to design and develop a sustainability platform for the presentation of local sustainability projects and the calculation of an individual carbon footprint for Sparkasse Bodensee customers.

To the website


Julius Gronau
September 27, 2021


UI/UX design
CO2 Calculator
corporate identity
software development


A sustainability platform as an interactive element in CSR marketing - Sparkasse Bodensee

The challenge

In the banking sector, the topic of sustainability has become much more important in recent years. Many banks are asking themselves today: How can companies become more sustainable? Sparkasse Bodensee also wants to do its part and has been committed to the fight against climate change for some time.

A bank that is committed to sustainability

The savings bank from Baden-Württemberg is currently implementing numerous measures to improve its own eco-balance and to actively shape climate protection. While environmentally conscious actions are increasing from year to year, there is still a lack of successful external presentation of a sustainable brand identity.

Sparkasse Bodensee - Nature image and sustainability slogan

But how do you present sustainable action in a clear way?

The 60-page sustainability report in PDF format gave customers an extremely detailed insight into the actions implemented by Sparkasse Bodensee, but it was not really user-friendly. A new CSR strategy for the website was needed.

60 pages of sustainability report for download. That could be better, couldn't it?

So we sat down with the Sparkasse Bodensee team and worked together on how to present the sustainability efforts on the sustainability website in a visually appealing and exciting format.

The first mockups as a result of UI/UX brainstorming

Sustainability platform Sparkasse Bodensee - Mockup CO2 Calculator

Sparkasse Bodensee Sustainability Platform - Mockup Sustainability Blog

The solution

What if website visitors could not only read, but also act themselves?

An interactive and informative sustainability platform in a

This idea came to mind relatively quickly and did not let us go so quickly. What animates the user more than when he can really experience something on the page? The playful presentation of content (gamification) statistically generates increased engagement and longer customer loyalty among users.

How convenient that twigbit has been working on a CO2 calculator for some time, which we were able to adapt to the requirements and wishes of Sparkasse Bodensee in an iterative process. With the sustainability calculator, website visitors can easily calculate their own CO2 consumption. In addition, it offers numerous possibilities to integrate product placements for climate-friendly products and services.

Sparkasse Bodensee CO2 Calculator final version

Thanks to its responsive design, the CO2 calculator easily adapts to any output medium. Whether laptop or smartphone - the calculation of one's own CO2 emissions offers the perfect introduction to ecological awareness and sustainable action.

The CO2 calculator is intuitive and self-explanatory. In less than 10 minutes, you receive a reliable statement on your individual CO2 consumption. The values of the CO2 calculator are based on the latest scientific findings.

Textbook qualified product placement with a web plugin full of possibilities

However, the CO2 calculator not only offers end consumers a great opportunity to question their own ecological actions. In addition, the CO2 calculator offers numerous opportunities to integrate product placements for climate-friendly products and services. The intrinsic motivation to reduce one's own CO2 footprint creates an emotional motive to buy. Of course, the premium partners of Sparkasse Bodensee were doubly pleased about this.

Playful presentation of the sustainability report

The possibility to calculate one's individual ecological footprint increases the general customer engagement on the website. Another goal of the redesign, however, was to present the company's own services in connection with sustainability in a clear and informative way. Instead of struggling through 60 pages, the most important information should be compactly visible for the reader.

Since we can't transfer 60 pages one-to-one to a website, we first had to think conceptually about what information should be illustrated on the sustainable website. Something that immediately caught our eye was a kind of guideline for the sustainable activities of Sparkasse Bodensee.

Dynamic animations and clickable statistics bring life to the platform.

Our design team embellished this guideline with specially designed illustrations and then rounded it off with a chic "path animation". Furthermore, the sustainability goals set by the Sparkasse Bodensee were transferred into a chic overview, in which the user can click through the last years and thus see the enormous savings of the branch.

Sustainability platform - path animation
Sustainability platform - Our sustainability in figures

Closing words

Sustainable branding on the website is not only a hot topic for the Sparkasse. While many companies rely on the PDF download of the sustainability report, the Sparkasse Bodensee has proactively gone one step further and now offers its website visitors an interactive platform where they can find out a lot about sustainability for themselves and for the Sparkasse. A great topic and a great partner, we at twigbit are happy about the successful collaboration with Sparkasse Bodensee.

You want to share your new knowledge?