OppoSuits
OppoSuits zette in 2012 een heel nieuw product op de wereld: mannenpakken in opvallende prints. Een product tussen mode en verkleedkleren dat nog niet eerder bestond. In korte tijd groeide het uit tot een internationaal bekend merk en product, dat de aandacht trok van winkelketens als Macy’s, Walmart en de Bijenkorf. E-commerce speelt een belangrijke rol in het succes van het bedrijf. Reach Digital realiseerde de Magento webshop in 2012 en is sinds de start van het bedrijf Opposuit's e-commerce partner.
Voorraad in NL, UK, DE, US, CA
De fabrikant verzendt voorraad direct naar fullfillment locaties. Een bestelling wordt op basis van verzendadres gekoppeld aan een warenhuis. We realiseerden custom koppelingen met de systemen van totaal 8 verschillende verzendpartijen en hun (maatwerk) systemen. Bestellingen worden automatisch naar deze partijen verzonden, voorraadmutaties en verzendnotificaties komen terug naar de webshop. Per product is altijd live in te zien wat de voorraad per voorraadlocatie is.
Virtuele voorraad
Productie wordt maanden vooruit gepland. We realiseerden virtuele voorraad functionaliteit, compatible met de multi warehouse functionaliteit. Verwachte leveringen kunnen door klantenservice in het systeem worden geregistreerd, waarna B2B bestellingen aan deze leveringen kunnen worden gekoppeld. Een deel van de verwachte voorraad kan beschikbaar worden gesteld voor B2C. Bezoekers zien dan in de webshop bij maten die niet op voorraad zijn een verwachte levertijd staan, maar kunnen wel gewoon hun bestelling plaatsen en betalen.
B2B functionaliteit
OppoSuits liggen in winkels als Macy’s, Walmart, Nordstrom en de Bijenkorf. Daarnaast is er een grote groep retailpartners die direct via de achterkant webshops bestelt. Door een geavanceerd rechtensysteem, is toegang tot hun inkooporders, klanten en verzendingen afgeschermd. Productprijzen zijn afgestemd op afname en prijsafspraken. Voor het verwerken van grote orders realiseerden we bestellijst upload functionaliteit.
UX winkelwagen en checkout
OppoSuits heeft veel traction via internet of tv, maar touch points zijn ook evenementen, carnaval, feestdagen of een pilsje in de kroeg. Met een aankoop en afreken flow gebaseerd op best practices en geoptimaliseerd tot in de kleinste details, zorgen we ervoor dat niets een enthousiaste aankoop in de weg staat.
Card layout voor producten
Door producten in het winkelwagenoverzich en op de checkoutpagina vorm te geven als een 'product card', bundelen we alle informatie rondom een product bij elkaar. Het wijzigen van het productaantal is intuitief en update automatisch de productprijs en totalen. De weergave van producten is consistent in de mini winkelwagen, op de winkelwagenpagina en in de checkout.
1-Pagina-checkout
Gezien het internationale karakter, bevat de afrekenpagina veel informatie. Door de losse adresvelden uit te vullen op 2 regels, winnen we ruimte. Het kortingscode invoerveld tonen we pas na een klik op een secundair opgemaakte call to action button. Zo vallen we de bezoeker met één invoerveld minder lastig. Grote call to actions het kiezen van verzend- of betaalmethode en plaatsen van een order voorkomen onbedoelde touch-events.
Notificaties
Wanneer een bezoeker op een willekeurige plaats in het proces de aantal van zijn bestelling ophoogt, dan wordt realtime gecontroleerd of deze bestelling mogelijk is. Zo niet, dan wordt de bezoeker op de hoogte gesteld met een productmelding verwerkt in de card layout. Op deze plaats wordt ook een notificatie getoond wanneer het product een preorder betreft.
Custom web components
Voor de frontend van OppoSuits gebruiken we custom Web Components. Dit is een 'nieuwe' browserstandaard waarmee het mogelijk wordt om functionaliteit te bouwen die net als native componenten (bijvoorbeeld select of input) in iedere browser hetzelfde werkt en er hetzelde uitziet.
Voor OppoSuits zijn Web Components de toekomst. Ze bieden een robuuste cross device user experience. Daarnaast staan ze compleet los van de backend. Bij een toekomstige migratie naar Magento 2 kunnen we ze hergebruiken.
Web Component productgrid
De productgrid is gebouwd met een custom Web Component. Bij het laden, reserveerd een kleine (base64 encoded) inline versie van de afbeelding alvast ruimte. Zo verspringt de pagina niet. Foto's worden ingeladen zodra ze binnen de viewport vallen (lazyload) en op basis van device pixel ratio, zodat ze er altijd scherp uitzien. Bij muiseover wordt een crossfade en schaaleffect toegepast, waardoor het voor de bezoeker lijkt alsof hij inzoomt op het product. In werkelijkheid tonen we 2 verschillende productafbeeldingen.
Gethematiseerde categoriepagina's
Feestdagen zijn piekmomenten voor de webshop. Vanuit SEO is het interessant om voor belangrijke feestdagen categoriepagina’s te maken met content die hierop aansluit, zodat deze pagina's een prominente positie veroveren in zoekmachines. Met gethematiseerde categoriepagina's verhogen we het wow-effect van deze pagina's en de share-ability van deze pagina's. Zo doen deze pagina's het op social media beter. De pagina’s zijn geïmplementeerd als dunne laag over de standaardfunctionaliteit van categorie pagina’s heen en eenvoudig weer af te tuigen.
Cross border trading van eigen voorraad
De webshop is beschikbaar in 8 verschillende talen, in 5 verschillende valuta's. We bouwden een oplossing voor het berekenen van BTW tarieven bij het kruislings verzenden van grote bestellingen van een voorraadlocatie in het ene, naar een klant in het andere land. Amerikaanse BTW tarieven worden berekend via de API van Taxify.co, vanwege de complexe regelgeving op basis van staat, county en producttype.
Performance, performance, performance
Publiciteit op bijvoorbeeld Reddit, Bored panda of Amerikaanse televisie zorgen voor flinke pieken in bezoekers. Implementatie van een CDN zorgt ervoor dat statische content altijd worden geserveerd door een server uit het zelfde land als de bezoeker, wat downloadtijd minimaliseert. Een - met custom web components en 8 storeviews geintegreerde - full page cache oplossing zorgt dat een groot deel van de requests uit cache kan worden geladen, wat laadtijd sterk verminderd.
Creditlimieten
B2B klanten hebben contact met klantenservice wanneer ze nieuwe bestellingen willen plaatsen. Om klantenservice inzicht te bieden in het totaal van openstaande facturen en het crediet limiet van de klant, realiseerden we een Exact Online koppeling die deze informatie bij klanten opslaat. Een nieuwe bestelling is door hen niet in te voeren indien de creditlimiet overschreden is. Door middel van het maatwerk rollen- en rechtensysteem bieden we finance en managers de mogelijkheid om een bestelling alsnog te kunnen accorderen.
Paymentlinks voor B2B
Bankoverschrijving is voor het innnen van betaling van Magento B2B orders op internationele schaal geen werkbare oplossing. Door betalen eenvoudig te maken, wordt frictie weggenomen in dit proces. We realiseerden de mogelijkheid om vanuit het Magento adminpanel paymentlinks te genereren voor klanten, geheel los van bestellingen. Een paymentlink wordt naar de klant gemaild, die vervolgens op deze pagina - gefaciliteerd door payment service provider Adyen - de betaling voor het openstaande bedrag kan voldoen. Via het paymentlink-verzicht is voor finance realtime inzichtelijk wat de status is van betalingen.
Third party billing voor verzendingen
Grote zakelijke klanten hebben eigen contracten met verzendpartijen. In Magento slaan we op klantniveau het contractnummer van de klant op. Bij het aanmaken van de B2B order is het voor klantenservice mogelijk om de verzending te koppelen aan dit contractnummer. Te factureren verzendkosten komen op nul te staan. Bij het verzenden van de bestelling naar de fullfillmant partij, kunnen de kosten van de verzending tussen klant en verzendpartij volgens eigen afspraken worden verrekend.