Home Credit Bank

Axiom Design System

Problem

The design system of the Home Credit Bank was outdated, the components were disorganized and in the wrong places and there were a lot of unnecessary colors and styles.

Goal

Update the styles of the design system - remove unnecessary fonts, unnecessary colors, unnecessary components, add new components. Arrange the states of all components, create up-to-date descriptions of styles for development.

Before changes

All components are collected in one place. There are pages describing each component separately, but there is no system for sections to select the required state of the component by clicking. Styles are not spelled out, there are many extra colors and typefaces. Incomprehensible and long, too detailed description of the components.

After the changes

I added all available styles and removed unnecessary colors and font styles. I also added section to each component so that one can click on any state from the child component. Lastly, I added a description of the grids and created a guide for the new slider.

Adding structure and variants to components

Next case