Overview
CZUB (Česká Zbrojovka Uherský Brod) is one of the world’s leading firearms manufacturers, producing pistols and rifles sold to military, law enforcement, and civilian markets globally. I cooperated on building their new B2B e-commerce application — a platform for business customers to browse and order products, accelerated by SAP Commerce Cloud as the backend foundation.
My Role
I worked as a frontend developer on the Angular-based storefront. Beyond standard feature development, a significant part of the project involved building a design system from scratch — including a design token pipeline, an atomic component library, and a Storybook-based showcase — in close collaboration with the graphic design team.
What I Built
- Angular frontend integrated with SAP Commerce Cloud as the platform accelerator for the B2B storefront.
- A custom design token system developed in cooperation with the graphic team, who provided the tokens which we then mapped into a Tailwind CSS configuration used throughout the application.
- An atomic component library built on top of those design tokens, providing consistent, reusable UI components across the storefront.
- A Storybook implementation serving as a live showcase of the component library, documenting each component’s variants and usage — and positioning the library for reuse on future projects.
Challenges & Solutions
One of the more complex aspects was bridging the gap between the design team’s token definitions and the technical implementation in Tailwind. Design tokens needed to be accurately translated into Tailwind theme configuration so that all visual decisions — colours, spacing, typography — flowed consistently from a single source of truth into the components.
Close and iterative collaboration with the graphic team was key here. We established a shared vocabulary early, which reduced back-and-forth and made the token pipeline straightforward to maintain and extend.
Results
The project delivered a functional B2B e-commerce platform for a globally recognised manufacturer in a specialised industry. The design token system and Storybook library added lasting value beyond the project itself — providing a well-documented, reusable component foundation that other teams can build on in future engagements.