Door een headless aanpak te hanteren bij het ontwikkelen van je webshop, open je de deur naar een volledig nieuwe ervaring: je shop als app in de App Store en Google Play Store. Headless betekent dat de frontend een zelfstandige applicatie is, die enkel een API nodig heeft om data op te vragen en te sturen. Dit is dezelfde manier waarop native apps functioneren. Met moderne web-app technologie en slimme design patterns maak je het mogelijk om jouw bezoekers een gebruikerservaring te bieden sneller is, intuïtiever, en écht het maximale uit mobiele e-commerce haalt.
Maar is dit interessant voor jouw organisatie? Laten we inzoomen op de overwegingen, voordelen en uitdagingen. Wat levert het op, en waar moet je rekening mee houden?
Heb je nog geen iOS- en Android-app? Dan biedt het omzetten van je webshop naar een app interessante kansen. Klanten krijgen sneller toegang tot je producten, hun winkelwagen blijft bewaard, en ze kunnen eenvoudig hun bestelstatus checken. Daarnaast maakt het gemak van opgeslagen gegevens – zoals adressen, betaalmethoden en accountinformatie – het nóg makkelijker om aankopen te voltooien, wat impulsieve bestellingen stimuleert.
Kun je met een app een geheel nieuwe groep klanten bereiken? Waarschijnlijk niet. Wel is het een kans om nieuwe marketingstrategieën te verkennen, zoals het promoten van (Download nu onze app in de App Store!) en het opzetten van acties om het gebruik van de app te stimuleren. Apps worden vaak gebruikt voor herhaalaankopen, wat een mooie invalshoek biedt om klantloyaliteit te vergroten.
Daarnaast biedt een app unieke mogelijkheden om klanten persoonlijk te benaderen. Denk aan gepersonaliseerde aanbiedingen op basis van eerdere aankopen ‘direct in de app’, of exclusieve voordelen voor app-gebruikers, zoals early access tot sales of productlanceringen. Dit soort interacties kan de binding met je merk versterken en zorgen voor een gevoel van exclusiviteit.
Het publiceren van je Magento- of Adobe Commerce-webshop als app wordt extra interessant wanneer je de bezoeker meer kunt bieden dan alleen de verkoop van producten uit het assortiment. Denk aan een winkel die reparaties of onderhoud als dienst aanbiedt. Via de app kan de klant bijvoorbeeld de status van een reparatie volgen of akkoord geven voor het vervangen van een onderdeel.
Er zijn meer van dat soort functionaliteiten te bedenken die waarde toevoegen en perfect binnen een app passen:
Offerte- en calculatietools voor de buitendienst, exclusief toegankelijk in de ‘Mijn Account’-sectie van verkoopmedewerkers.
Bij IoT-producten: In de app kan de productstatus, zoals het laadpercentage, eenvoudig worden uitgelezen en getoond in de ‘Mijn Account’-sectie.
Uitgebreide wishlists of bestellijsten die regelmatig aangepast en herbesteld moeten worden, eenvoudig te beheren via de app.
Beheer van afspraken, waarbij klanten via de app afspraken kunnen plannen, wijzigen en herinneringen ontvangen in de mijn account-sectie.
Voor Daxtrio ontwikkelden we de bestelportaal, een interface waarin zorgprofessionals hun magazijnvoorraad kunnen beheren en daarop gebaseerde inkoopadviezen kunnen aanvragen. Met behulp van de camera van de telefoon van de gebruiker, bieden we een geïntegreerde EAN code scanner waarmee producten makkelijker kunnen worden opgezocht. De bestelportaal functionaliteit integreert naadloos in de mijn account sectie van het e-commerce platform en is een belangrijke reden om de Daxtrio app te downloaden.
Hoe bied je bezoekers een ervaring die écht als een app voelt?
Het vraagt om een andere kijk op gebruikerservaring dan bij responsive design. Het gaat zelfs verder dan mobile-first, waar de interface eerst voor mobiel wordt ontworpen en daarna wordt opgeschaald naar desktop.
App-design vereist dat de gebruikerservaring niet alleen gebaseerd is op e-commerce best practices, maar ook op app-design principles. Bijvoorbeeld:
Minder pop-ups: Als elke navigatie-actie in de app een vorm van ‘soft navigation’ is die bijna instantaan is, is een megamenu dan nog nodig? Of laat je bezoekers razendsnel doorklikken naar dieper gelegen categoriepagina’s met eenvoudige visuele knoppen op de pagina?
Geen pagina’s, maar ‘views’: Bij voorkeur, als de techniek het ondersteund, swipable overlays.
Geen footer: Apps hebben geen footers, dus is een footer in het design echt nodig? Zoek liever naar een slimmere manier om de content van de footer toegankelijk te maken.
Geen hovers, maar clicks: In apps bestaan geen hover-acties, net als bij mobiel design. Interacties die normaal via een muis-hover werken (zoals het tonen van alternatieve productfoto’s in een productgrid) moeten op een slimme en gebruiksvriendelijke manier anders worden opgelost.
Een back button of share button moet je zelf toevoegen aan de interface, aangezien de browser UI (met browser back button en website-URL) ontbreekt.
Heeft jouw organisatie al eerder apps laten ontwikkelen? Dan weet je hoeveel native app-development kan kosten. Het beheren van zowel een e-commerce platform als afzonderlijke iOS- en Android-apps resulteert in twee (of zelfs drie) volledig gescheiden projecten, elk met hun eigen resource- en budgetvereisten. Door de functionaliteit van een app direct in de frontend van je webshop te integreren, bundel je alle inspanningen tot één project. Dit vermindert de complexiteit en leidt tot aanzienlijke besparingen op ontwikkelkosten. Tenzij je app specifieke mobiele OS-functies gebruikt, zoals Bluetooth Low Energy (BLE) voor IoT-verbindingen, biedt een enkel ontwikkelplatform gebaseerd op React alles wat je nodig hebt.
Een bijkomend voordeel: in de nieuwe situatie zijn platform updates direct beschikbaar voor app-gebruikers, zonder dat er een nieuwe app-build nodig is. Dit voorkomt problemen met gebruikers die een oude versie van de app gebruiken, waardoor backward compatibility niet langer een uitdaging is.
Er zijn wel een paar aandachtspunten. Technisch gezien zijn er specifieke vereisten: de webshop moet offline compatibel zijn, beschikken over een manifest, en gewrapt kunnen worden (met Capacitor, Cordova of React Native WebView). Daarnaast moet je voldoen aan de keuringsprocessen van Apple en Google om de app daadwerkelijk te kunnen publiceren.
Het allerbelangrijkste? De technologie achter je webshop moet een ervaring bieden die aanvoelt als een echte app.
Dat betekent dezelfde snelheid, consistente rendering, soft navigations en design patterns die gebruikers herkennen en verwachten. Om dit te realiseren is een frontend-first JavaScript-framework, zoals React of Vue.js, eigenlijk noodzakelijk. Een frontend gebouwd met Adobe’s standaard technologie of een thema voldoen hier niet aan.
De oplossing hiervoor is een headless Magento frontend. Wij bouwen deze met GraphCommerce: een plug-and-play Magento frontend die al 70% van de benodigde features standaard biedt. Dit framework maakt een next-level gebruikerservaring mogelijk, bereidt je webshop voor op app-publicatie en helpt jouw organisatie transformeren naar composable commerce.
Download onze demo Magento app nu in de App Store en Google Play Store. GraphCommerce is een vervangende frontend, ontwikkeld met web-app technologie. Hiermee behoud je de krachtige backend van Magento of Adobe Commerce, terwijl je een snellere, modernere en gebruiksvriendelijkere frontend toevoegt.
Het publiceren van een webshop als app is vanaf september dit jaar (2024) een stuk aantrekkelijker geworden. Met de invoering van de Digital Markets Act (DMA) zijn er in de EU grote veranderingen doorgevoerd in het App Store- en iOS-ecosysteem (apple.com).
Een van de belangrijkste wijzigingen is dat betalingen niet langer via Apple’s eigen systeem, In-App Purchases (IAP), hoeven te lopen. Voorheen waren apps verplicht dit systeem te gebruiken, wat betekende dat bedrijven tot 30% commissie per transactie kwijt waren. Nu kun je betalingen in de app dus rechtstreeks laten afhandelen via je bestaande PSP, zoals Mollie, MultiSafepay of Adyen.
Daarnaast zijn de distributiemogelijkheden verruimd. Naast publicatie in de Apple App Store kunnen apps via alternatieve appstores of als directe download worden aangeboden. Dit geeft bedrijven meer vrijheid in hoe ze hun app beschikbaar stellen aan klanten.
De privacyregels volgens de AVG zijn verder aangescherpt. Bedrijven moeten transparant zijn over de verwerking van persoonsgegevens en expliciete toestemming vragen voor dataverzameling. Apple controleert streng bij het aanmelden van apps en heeft extra maatregelen geïmplementeerd om gebruikers te beschermen, in lijn met de nieuwe richtlijnen van de DMA.
Het publiceren van een app gebouwd met webtechnologie heeft een aantal limitaties
Web-apps hebben nog geen toegang tot alle mobiele OS-functies, zoals pushmeldingen, Bluetooth-functies, bestandsbeheer, Face ID, Touch ID en ARKit.
De routing voor betalingen via verschillende Payment Service Providers (van app naar browser en terug) brengt complexe uitdagingen met zich mee, waardoor we momenteel alleen betalen op rekening ondersteunen.
Multistore-functionaliteit is mogelijk, maar vereist extra aandacht en werk om goed te implementeren.
Interesse in een app? Of voelt het nog een beetje als een ver-van-je-bed-show? Zelfs als een app nu nog niet op de planning staat, biedt de technische unlock van een headless strategie – en uiteindelijk een app – een frisse kijk op de ontwikkeling van je e-commerce platform. Het kan zelfs een goede reden zijn om je backlog opnieuw te prioriteren.
Een app is natuurlijk niet voor elk merk dé oplossing. Maar wie weet? Misschien blijkt een combinatie van een app en een goed doordacht klantloyaliteitsprogramma precies de killer combinatie te zijn waarmee je de concurrentie buiten spel zet.
Lijkt het je interessant om hierover verder te praten? Laat het me weten, ik hoor graag hoe jullie hierin staan.