RIS

The project was initiated to develop a comprehensive design and component system for digital banking applications. The goal was to create a unified and scalable UI/UX that enables both designers and developers to implement solutions efficiently and consistently. As part of the project, over 150 components were created, aligned with different layouts for various use cases. Close collaboration with the client ensured that the design and development processes were optimally tailored to the bank's requirements.

A central element of the project was the use of Figma as a design tool, where a comprehensive component library was built. Figma tokens (variables) for colors and dimensions were utilized to ensure high flexibility and easy adaptability. The concept follows the Atomic Design principle, allowing components to be structured modularly and reused efficiently. This provides a clear framework and facilitates future extensions or adjustments to new requirements.

In parallel with the design library, a frontend component library was developed in React, using TailwindCSS for efficient and flexible styling. Particular emphasis was placed on high code quality and type safety, which is why the entire library was implemented in TypeScript. Additionally, component accessibility was considered from the outset to ensure inclusive usage. Due to its modular structure and the consistent application of best practices, the library is not only easily extendable but also serves as an optimal foundation for scalable and future-proof applications.

The close integration of design and development resulted in a powerful and future-oriented component system that supports digital transformation in the banking sector. The developed solutions enable the client to implement new digital products more quickly and efficiently. Thanks to the structured and modular approach, both designers and developers benefit from improved collaboration, while end users enjoy a modern, consistent, and intuitive user interface.