PWA voor Magento: web en app ineen voor betere gebruikerservaring

De ontwikkeling van een eigen app wordt voor e-commercebedrijven weer een stuk relevanter. De relatief nieuwe technologie achter Progressive Web Apps (PWA’s) neemt voor zowel de retailer als consument een hoop drempels weg. Welke kansen biedt de opkomst van PWA’s voor webwinkels en wat maakt Magento mogelijk?

De scheidslijn tussen websites en apps vervaagt. De horde om een aparte app te bouwen en vervolgens klanten te moeten aanmoedigen om deze te downloaden verdwijnt daardoor. Voor retailers is dit een vrij welkome ontwikkeling: het is over het algemeen zeer lastig om met een toch al kostbare app zoveel toegevoegde waarde te bieden dat klanten een appstore bezoeken. En de applicatie vervolgens opslaan en blijven gebruiken.

Progressive Web App?

Sites en shops die als PWA zijn ontwikkeld, laten zich vanuit een browser opslaan op een telefoon. Alleen de ‘schil’, gemaakt van webtalen zoals HTML, JavaScript en data, wordt bewaard. De data wordt naar gebruik ingeladen – vandaar ook de term ‘progressief’. Anders dan bij een mobiele (native) app vraagt een PWA om slechts een fractie aan schijfruimte.

Helemaal nieuw is de technologie achter PWA’s niet. Maar nu behalve Google (Chrome) ook Apple (Safari) overstag is, biedt het in ieder geval voor e-commercebedrijven de nodige kansen. Met behulp van de nieuwste ontwikkeltechnieken en browserinnovaties is het mogelijk om in een PWA allerlei native functionaliteiten aan te bieden, die bovendien ook nog eens snel én in sommige gevallen offline bruikbaar zijn. Een app-like beleving dus, maar dan via de site of shop zelf.

Video: Google over de ontwikkelingen en kansen rondom PWA’s

Met een PWA kunnen webwinkels bijvoorbeeld gemakkelijk informatie toesturen via een pushnotificatie (helaas nog niet op iOS volgens de W3 standaard). De laatste communicatie over de bezorging van een pakket, een ontvangen retournering of aangemaakte credit verschijnt daardoor ook zonder eigen native app op iemands scherm. Met de verwachte groei van het aantal ‘libraries’ nemen daarnaast de technische mogelijkheden toe om de productbeleving te verrijken. Zo is vanuit een Progressive Web App de camera aan te spreken (weliswaar nog niet beschikbaar in iOS). Het duurt waarschijnlijk niet lang meer voordat iedere webwinkel dan ook de augmented reality-laag in een smartphone kan gebruiken. En klanten zo net als bij IKEA hun virtuele producten in een fysieke omgeving kunnen zien.

Magento en PWA’s

Magento heeft al gezegd veel te verwachten van de komst van PWA’s. Net als met de komst van responsive design kan het een revolutie ontketenen. In een speciaal ontwikkelde PWA Studio biedt het ontwikkelaars dan ook de nodige tools om de interface als PWA op te bouwen.

Zelf hebben we goede ervaringen met Vue Storefront, een zeer populaire open source-oplossing die hier is te bekijken in een demo. Magento dient in dat geval als een headless platform met daarin alle belangrijke data en software-integraties – bijvoorbeeld voor de koppeling met een ERP. Via een API wordt vervolgens alle data doorgezet naar de front-end op basis van VueJS. Een mooie bijkomstigheid is dat de data worden geïmporteerd in een tussengelegen database van Elastic. De snelheid van de webwinkel en PWA nemen hierdoor enorm toe. Ook een ‘laag’ om een voice-app te maken, is sinds kort beschikbaar.

In ons geval is de ontwikkeling van een PWA interface in de basis gelijk aan ieder ander ontwikkeltraject. Door middel van usability research en design sprints wordt de beoogde gebruikerservaring omgezet in een passende e-commerceomgeving met bijbehorende functionaliteiten. Omdat de Vue-technologie nog relatief nieuw is, zijn echter nog niet alle bouwblokken standaard aanwezig. Een catalogus en integratie met PayPal zijn er bijvoorbeeld wel, oplossingen voor lokale payment providers zijn er nog niet. Zolang de betreffende bedrijven of community nog geen oplossing bieden, vragen zulke integraties dus om het nodige maatwerk.

Video: demonstratie van open source-oplossing Vue Storefront icm. Magento 2

Wie durft?

Voor nog niet iedere organisatie biedt de PWA al uitkomst. Behalve dat de technologie relatief nieuw is, speelt ook de doelgroep een rol in die overweging. Gemiddeld genomen zie je bij een wat oudere doelgroep een tragere adoptie van nieuwe technieken. Voor het bereiken van deze klanten is een Progressive Web App wellicht nog niet zo nodig. Bij jongeren nemen de verwachtingen van een webshop en de snelheid ervan juist toe. Zeker onder deze gebruikers leidt een betere mobiele ervaring tot een hoger conversiepercentage.

Net als met de overstap naar Magento 2 zie je dat met name grotere e-commercebedrijven afwachtend zijn. Ze laten de markt liever eerst kinderziektes oplossen, dan dat ze zelf als ‘proefkonijn’ instappen. De investering in een PWA is in zekere zin een investering in de toekomst. Met name de middelgrote en kleinere e-commercebedrijven zetten hierin (op de achtergrond) al de eerste stappen. Omdat ze met hun noodzakelijke overstap naar Magento 2 moeten investeren in een nieuwe front-end, kiezen ze nu liever voor een PWA dan een responsive variant. Daarmee zijn ze met één investering in ieder geval verzekerd van een toekomstbestendige omgeving.

Nog dit jaar zal onder e-commercebedrijven de interesse in PWA’s groeien, zo is mijn verwachting. Dat de support op Magento 1 binnenkort stopt draagt hier zeker aan bij. Dit betekent natuurlijk niet dat native apps geen enkele rol van betekenis meer spelen. Er blijven situaties bestaan waarin native maatwerk nodig is of een zelfstandige app meer toegevoegde waarde biedt. Maar het feit dat er met één platform over de kanalen heen eenzelfde gebruikerservaring is te ontwikkelen, is een volgende en erg belangrijke standaard op het web.

Meer weten over de laatste innovaties rondom Magento? Lees dan de whitepaper ‘Maximale groei met het Magento platform‘.