Tchibo
E-Commerce App

About the project

The goal of the project was to optimize the Tchibo App, which in many places consisted of integrations of the mobile version of the Tchibo website. Therefore we analyzed optimization potentials and implemented usability improvements, native app elements and built new app exclusive features. All improvements have been tested in qualitative usability tests and quantitative A/B tests to make sure we achieved the performance goals we were trying to reach.

Design Systems

To achieve an autonomous app design which still aligns with brand guidelines we built two new design systems. One global design system where all the base tokens like colors, fonts, spacings, roundings etc. are defined. Connected to that were the already existing web design system and our newly built app design system. By doing that global token updates would automatically update components in each respective library, but gave us the freedom to develop app components independently from the web system.

popup image

Accessibility

As of June 28, 2025 the European Accessibility Act (EAA) will become mandatory for all digital products including the Tchibo app, therefore it was necessary to make sure that the entire Tchibo app is WCAG level AA compliant.

I had the responsibility to make all the components in our newly built design system accessible. That contained checking if all interactive elements had the correct target area sizes, all color contrast requirements were met, all texts were scalable until 200% without breaking the app design or making it unusable and also checking in with the developers to see if their implementations were meeting all other AA requirements.

popup image

Home, PLP & PDP

We restructured the home page of the app to give users a multitude of entry points into relevant topics, products and features. Teasers for new collections, recently viewed products, ongoing sales, product recommendations and crosslinking teasers were part of that.

The Product Listing Page (PLP) was also optimized by offering relevant filters and improving the navigation structure. Also the product tiles were optimized to suit all product categories and accessibility requirements.

The Product Detail Page (PDP) was optimized to give users the most relevant information to make an informed but quick purchase decision. Here we restructured content, offered an add to cart button which is sticky and always in the viewport and improved several selection components like chips, dropdowns, tab switches and accordions.

popup image
Next Project
E.ON
Responsive platform