Decathlon France: Svelte components for the Vitamin design system

I built reusable Svelte components for Vitamin, the design system used across all of the Decathlon group's e-commerce applications. Documented in Storybook and tested with Cypress, they were made for the group's internal teams to adopt.

Client: Decathlon France
Role: Senior frontend developer, Svelte · Vitamin design system
Duration: 5 months, February to June 2022
Setting: Freelance, via DPS Syneido, fully remote, technical autonomy on the frontend

001

001·Context

The design system and the e-commerce platform

I worked with the product and UX teams on two fronts: the Vitamin design system and the group's e-commerce platform.

002

002·Approach

How I worked for Decathlon France

Brief and my role: New reusable components for Vitamin and new features for the e-commerce platform, both on the frontend.
Constraints: Components shared across the group's e-commerce applications had to be reliable and documented well enough for internal teams to adopt them.
Technical decisions: Svelte components added to the design system, product-management features, and work on the display and performance of search results.
Checks and releases: I documented the components in Storybook and tested them with Cypress.

003

003·Deliverables

What I delivered for Decathlon France

Svelte componentsReusable UI components in Svelte, integrated into the design system
E-commerce featuresNew product-management features on the e-commerce platform
Search resultsOptimised display and performance of the platform's search results

004

004·Technologies and screenshots