Redesign en nieuwe features voor Heron, klaar vóór het vuurwerkseizoen

Heron Fireworks verkoopt Duits vuurwerk aan Nederlanders, net over de grens bij Arnhem. De webshop draaide al jaren op hetzelfde thema en de inhoud droeg nog de sporen van de overstap vanaf Magento 1: elke pagina een eigen layout, oude doorverwijzingen, teksten die nergens meer aan te passen waren zonder ontwikkelaar.

Het platform zelf was gezond. Wat ontbrak was een voorkant die bij het merk past, en een beheeromgeving waarin Heron zelf de openingstijden, acties en banners kan bijhouden. Dat werd een afgebakend project met een vaste prijs, met één harde deadline: live vóór de eerste verkoopdagen van het najaar.

Heron heeft sterke kleuren, magenta en cyaan, en die zijn op een lichte achtergrond al snel schreeuwerig. We hebben ze daarom op een bijna zwarte basis gezet, waar ze doen wat vuurwerk hoort te doen. Grote koppen in een condensed letter, de lopende tekst rustig, veel ruimte rond de productfoto's.

De homepage is opgebouwd uit blokken die Heron zelf vult: een hero met een uitgelicht product, de nieuwste producten, aanbiedingen en een blok voor de winkel. Productkaarten kregen labels voor winkelvoorraad, online bestelbaar en de KVK-korting voor zakelijke klanten. De informatiepagina's, van contact tot ophaalpunt, zijn opnieuw ingedeeld op één gedeelde breedte, zodat de site zich als één geheel gedraagt als je erdoorheen klikt.

Het grootste deel van het werk zit onder de motorkap: een reeks eigen modules die elk één ding beheerbaar maken. Openingstijden als weekschema's met een ingangsdatum, plus uitzonderingen voor feestdagen en dagen op afspraak; de balk bovenaan de site toont daarmee live of de winkel open is. Banners met een plaatsing, een sorteervolgorde en een van-tot-venster. Een FAQ per taal. Uitgelichte producten via een vinkje op het product.

Voor het assortiment is er een Excel-werkbank: producten en categorieën exporteren, in de spreadsheet bewerken en weer importeren, inclusief afbeeldingen per artikelnummer. En als de voorverkoop voorbij is, zet Heron de winkel zelf op slot met een onderhoudspagina, terwijl de eigen IP-adressen gewoon binnen kunnen.

Vuurwerk haal je op, en dat doen honderden klanten in dezelfde paar dagen. In de checkout kiest de klant daarom eerst een afhaaldag en dan een tijdvak. Elk tijdvak heeft een capaciteit; is een vak vol, dan verdwijnt het uit de lijst.

Bij het plaatsen van de bestelling controleert de server de capaciteit nog een keer, met een lock op het tijdvak, zodat twee klanten die tegelijk afrekenen niet allebei de laatste plek krijgen. Annuleert iemand, dan komt de plek weer vrij. Hoeveel plekken er nog over zijn ziet alleen Heron in de admin, bewust niet de klant.

Heron verkoopt vanuit Duitsland aan een gemengd publiek. De shop draait nu in drie talen op hetzelfde domein: Nederlands op de root, Duits en Engels in een submap. Menu, categorieën, FAQ, informatiepagina's en de checkout zijn vertaald, en de routes ook: het Duitse contactformulier staat gewoon op /de/kontakt.

Zoekmachines krijgen per pagina de taalvarianten mee. De content per taal beheert Heron los van elkaar, in dezelfde admin.

Het hele traject draaide op een stagingomgeving die de klant kon meekijken en waarop we in drie rondes hebben getest en bijgeschaafd. Onderweg is Magento bijgewerkt naar de nieuwste versie, zodat het nieuwe werk op een actuele basis staat.

De livegang zelf was een verhuizing naar nieuwe hosting. De inhoud van staging vormde de basis; klanten, adressen en bestelhistorie kwamen uit de oude productieomgeving mee. De voorraad is gelijkgezet met de kassa in de winkel, en de oude database staat nog klaar als terugvaloptie. Op 3 september stond de vernieuwde shop live, op tijd voor de eerste KVK-verkoopdagen van het seizoen.

Veel shops die er gedateerd uitzien, draaien op een prima fundament. Dan is een redesign vooral een kwestie van de voorkant opnieuw opbouwen, de content beheerbaar maken en onderweg de achterstand in versies wegwerken. Dat kan als afgebakend project met een vaste prijs, zoals hier.

Daarna gaat de shop bij ons in technisch beheer, zodat het bijgehouden blijft. Hoe winkel en webshop bij Heron op hetzelfde platform draaien, lees je in de case over de handscanners in de winkel.