Secrid Customise

Secrid, het bekende Nederlandse portemonneemerk, innoveert al meer dan een decennium met zijn unieke designs. Als eerste ter wereld introduceerde Secrid de Cardprotector, een beschermde pasjeshouder die niet alleen handig is maar ook voorkomt dat de NFC-chip ongewild wordt gescand. De laatste jaren ziet Secrid een toenemende wens in het personaliseren van producten. Om een portemonnee in eigen smaak te creëren zijn er daarom al diverse kleuren en stijlen beschikbaar. In de Secrid-winkels is het bovendien mogelijk om de Cardprotector te laten graveren. De uitdaging was om deze graveerservice ook online aan te bieden.

Persoonlijk tintje
Steeds meer merken gebruiken productpersonalisatie om een sterke band met hun klanten op te bouwen. Zo kunnen bijvoorbeeld AirPods, laptops en telefoonhoesjes een eigen unieke stijl krijgen. Om hierop in te spelen wilde Secrid een e-commerce webapplicatie van hoge kwaliteit ontwikkelen, waarmee klanten hun eigen Cardprotector kunnen ontwerpen. Met eigen teksten, emoji’s of een kant-en-klaar design. 

Uitdaging van hoge kwaliteit 
In een zogenaamde Jumpstart hebben we binnen een week met Secrid gevalideerd of zo’n tool kan voldoen aan hun hoge eisen van design en gebruiksvriendelijkheid. De vraag was of het mogelijk zou zijn een 3D-model van een portemonnee online te personaliseren met een eigen ontwerp. Dat het een 3D-model moest zijn, was onvermijdelijk. Alle hoeken van de portemonnee moeten zichtbaar zijn. Kleurnauwkeurigheid en lichtval zijn daarbij een extra uitdaging. Het doel was om het product op het scherm precies overeen te laten komen met wat er op de deurmat valt. Met de opgedane inzichten uit de Jumpstart hadden we een veel preciezer beeld van het eindproduct gekregen.

Van concept naar realiteit
De voorbereiding op het bouwen van de tool was al een avontuur op zich. Wie zijn de juiste partners die dit project kunnen ondersteunen? Denk aan grafisch ontwerp, het e-commerceplatform, het ordersysteem en natuurlijk de graveermachine. We hebben Secrid geholpen met deze uitdagende zoektocht. En met resultaat: aan het einde konden we een scherpe inschatting maken en hadden we eventuele verrassingen in het ontwikkeltraject weggenomen.

What you see is what you get
Binnen drie maanden hebben we een volledige webtool ontwikkeld die personalisatie mogelijk maakt. In samenwerking met designbureaus Morrow en Build in Amsterdam is de graveertool toegevoegd aan de bestaande website. Daarbij leidt een duidelijke animatie de klant naar de Secrid Customise-interface. De tool past zich aan op basis van het gekozen model portemonnee: de stijl en kleur van de Cardprotector veranderen mee. Als een ontwerp wordt gemaakt, verschijnt er in real-time een voorbeeld op het 3D-model van de Cardprotector.

Rijke klantervaring
Klanten kunnen een template kiezen of een eigen design maken. Leidend is een premium ervaring. Iedereen moet de tool met gemak kunnen gebruiken. Daarom ligt er grote focus op gebruiksvriendelijkheid. Zonder dat de tool complex aanvoelt, zijn er heel veel mogelijkheden. De positie, grootte en het lettertype van de tekst kunnen worden gekozen en emoji’s kunnen worden toegevoegd. Als het ontwerp klaar is, toont de tool een mooie 3D-render van de portemonnee en kan deze toegevoegd worden aan het winkelmandje.

Geen fluitje van een cent
De graveertool is gekoppeld aan het headless CMS Storyblok dat Secrid al gebruikt. Dit bespaarde tijd, omdat alle 3D-modellen in dit CMS staan. Hierdoor kunnen de ontwerpen die klanten maken, moeiteloos worden verwerkt. De tool werkt met bijna alle portemonnees: om aan de hoge standaarden van Secrid te voldoen wordt er over het bestaande 3D-model met Three.js een render geplaatst met het gemaakte ontwerp. Dit lijkt eenvoudig maar om het er zo echt mogelijk uit te laten zien, moet er rekening gehouden worden met het licht en de kleur van het bestaande 3D-model. De ontwerpopties zijn precies uitgelijnd met alle graveerbare producten. Dat waren er nogal wat: 213 graveerbare wallets om precies te zijn. Een hele klus!

Trek de portemonnee maar open
De klant heeft een ontwerp gemaakt en vervolgens afgerekend, nu hoeft hij of zij alleen nog maar in spanning af te wachten bij de brievenbus. Maar aan de achterkant gebeurt nog een hele hoop. Met een snelle automatische check wordt gecontroleerd of het gemaakte ontwerp voldoet aan de voorwaarden. Om ervoor te zorgen dat het proces van aankoop tot verzending geheel automatisch verloopt, hebben we veel maatwerk ontwikkeld. Door ons goed te verdiepen in de werking van de graveermachine konden we de tool volledig optimaliseren voor een zo hoog mogelijke kwaliteit van het laserwerk op de wallets. De graveermachine werkt namelijk alleen op vector-based bestanden. Met behulp van de open source libraries Fontkit en Paper.js wordt het gemaakte ontwerp op de juiste positie uitgelijnd en eventuele tekst karakter voor karakter omgezet naar een vector.  Dit alles gebeurt razendsnel zodra de betaling van de klant binnen is. Als laatste wordt het gegraveerde product naar de klant verzonden en heeft deze een schitterende persoonlijke portemonnee.

Tijd is geld

Binnen drie maanden zijn we van concept naar livegang gegaan, inclusief de allereerste gravering. Dit alles dankzij een hele goede voorbereiding. Een groot deel van de orders wordt inmiddels gegraveerd, de klanten zijn enthousiast en maken unieke Cardprotectors. De tool blijkt dus een groot succes!