Retail · fitnessapparatuur, online en in de winkels
Fitwinkel
Fitwinkel verkoopt fitnessapparatuur, online en via fysieke winkels. Het bedrijf stapte over van Logic4 naar Shopify en wilde daar sneller mee live. Ik ben aangehaakt voor het frontendwerk op de nieuwe shop, en heb daarnaast twee aangrenzende trajecten opgepakt: een offertetool voor zakelijke klanten en een eigen urenregistratiemodule die de dure externe tool vervangt.
frontend parallel aan de Logic4-naar-Shopify-migratie
zakelijke offertes bekijken en ondertekenen in één flow
urenregistratie in eigen hub, geen kosten per oproepkracht
De situatie
De kern was een platformmigratie: van Logic4 naar Shopify. Dat soort overstappen heeft een harde deadline, want het oude en het nieuwe systeem moet je niet langer dan nodig naast elkaar laten draaien. Fitwinkel wilde daarom vaart maken met de nieuwe shop, zonder dat de frontend daaronder zou lijden.
Rond de winkel zaten nog twee processen die op losse tools draaiden. Zakelijke klanten kregen offertes die buiten de webshop om liepen, zonder een nette online plek om ze te bekijken en te accorderen. En de urenregistratie van het personeel ging via Shiftbase, dat voor de functies die Fitwinkel daadwerkelijk gebruikte aan de prijzige kant was: voor elke oproepkracht moest er weer worden bijbetaald.
Alle drie de stukken vroegen om iemand die snel kon schakelen tussen frontend en koppelingen, en die naast de winkel ook de processen eromheen kon oppakken.
Onze aanpak
Op de webshop lag de nadruk op snelheid en kwaliteit tegelijk. De Shopify-theme is opgebouwd bovenop Horizon, met een strikte scheiding tussen de standaard-theme en het maatwerk: alle eigen secties, snippets en scripts staan onder een eigen prefix, zodat updates van de basis-theme nooit het maatwerk overschrijven. Zo kon er snel worden doorontwikkeld zonder dat er bij elke upstream-update iets brak.
Voor de offertetool kreeg ik de API-documentatie aangeleverd en heb ik daar een losse Nuxt-applicatie op gebouwd. Het uitgangspunt was simpel: een zakelijke klant opent een link, ziet zijn offerte er verzorgd uit en kan hem in dezelfde flow ondertekenen. De backend bleef bij Fitwinkel; ik leverde de frontend die erop koppelt.
De urenregistratie pakten we breder aan. De functies die Fitwinkel in Shiftbase gebruikte, zijn naar hun eigen hub gehaald: aan de backend kant kwam er een urenregistratiemodule bij die een API aanbiedt, en daar bovenop bouwde ik een aparte Nuxt-app voor de medewerkers. Door het in eigen huis te draaien vervalt de afrekening per oproepkracht.
De oplossing
De Shopify-shop draait op een Horizon-theme met maatwerk in vanilla JavaScript en Web Components, bewust zonder zwaar framework in de frontend, zodat de pagina's snel blijven. Denk aan eigen filters (zoals een hellingshoek-filter met dubbele schuifregelaar), een winkelzoeker met kaart, merkenoverzichten en gestructureerde data voor SEO. De checkout is uitgebreid met Shopify Functions en kleine Preact-extensies voor zaken als bezorgdatum en een goededoelenbijdrage.
De offertetool is een Nuxt-app in Vue met Tailwind. Een zakelijke klant opent zijn offerte via een unieke link, ziet de regels en totalen, de accountmanager met contactgegevens en relevante referentieprojecten, en kan de offerte direct digitaal ondertekenen met een handtekening op het scherm. Openen en tekenen worden teruggekoppeld naar de backend, zodat Fitwinkel ziet wat er gebeurt.
De urenregistratie bestaat uit twee delen. In de hub (Python met FastAPI) zit de module die klokken, pauzes, correctieverzoeken en een accorderingsproces afhandelt, met koppeling naar de salarisadministratie. Medewerkers kunnen inklokken via hun account of via een persoonlijke kloklink. Daarbovenop draait een Nuxt-app voor medewerkers: in- en uitklokken, pauzes doorgeven, hun eigen uren teruglezen per periode en correcties aanvragen. Het beheer en de goedkeuring blijven in de hub.
Het resultaat
De nieuwe Shopify-shop kon sneller live doordat het frontendwerk parallel aan de migratie kon doorlopen, met een opzet die updates van de basis-theme opvangt zonder dat het maatwerk sneuvelt.
Zakelijke klanten hebben nu een nette online plek om hun offerte te bekijken en te ondertekenen, in plaats van een proces dat buiten de webshop om liep. Voor Fitwinkel is zichtbaar wanneer een offerte is geopend en getekend.
De urenregistratie draait in eigen huis. De functies die in Shiftbase werden gebruikt zitten nu in de eigen hub, met een eigen app voor medewerkers, zodat de kosten per oproepkracht vervallen en het proces meegroeit met het bedrijf.
Gebruikte technieken
Kevin · oprichter Inventy
Herken je dit in jouw bedrijf?
Plan een gratis kennismaking van 30 minuten. We vertellen je eerlijk of jouw situatie zich leent voor een vergelijkbaar resultaat.