Solution
From the data model to a finished order. Six steps that created a platform letting customers design their own sports jersey without a graphic designer — and letting the client manage the whole catalogue from one admin.
Information architecture & design
I designed the site and configurator so the customer starts with the sport and product and then layers on the visual details — all on one page.
Custom CMS modules
In Winter CMS I built custom modules for sports, products, designs, materials, collars, zips and other extras. The client now adds a new jersey, material or extra in minutes — no developer, no waiting.
Vue.js configurator with live preview
The heart of the project — a Vue.js app where the customer clicks colours, design and extras and sees the result immediately. Reactive state, optimistic UI and smooth transitions. No waiting, no bouncing back and forth.
SVG jersey rendering
The jersey preview renders as SVG — sharp on a 4K monitor and on a phone, zoom without quality loss, and production files that are mathematically precise. A colour change appears instantly, without a reload.
Path to the order
From the configurator the customer moves into the order — quantities, sizes, player names, numbers, fonts. One flow, no forwarding e-mails, no extra steps. The client gets complete files ready for production.
Website redesign & analytics
Around the configurator we built a new site with 14 pages for individual sports, sections on materials, production and references from real teams. Analytics show where customers drop off in the configurator — and that data drives further optimisation.
