Section No. 1

PWA | Webshop

Wat heb ik gedaan

Voor de webshop heb ik een PWA (Progressive WebApp) opgezet, door een PWA op te zetten kunnen mensen de webshop op hun homescreen zetten van de telefoon.

Hoe heb ik dit gedaan

Dit heb ik gedaan door middel van een service worker en een app manifest. Deze twee bestanden zorgen er voor dat de site als PWA “gedownload” kan worden op een Android of IOS. Binnen het manifest wordt de styling, iconen en kleuren aangegeven van de PWA. De json file verteld tegen de browser dat er voor website X een PWA beschikbaar is. De service worker is nodig om de json file actief te stellen en te laten communiceren.

Wat heb ik eraan gehad

Door dit te doen, heb ik mijn kennis binnen het PWA vlak weer opgefrist. Het was een tijd geleden dat ik een PWA had opgezet voor een website. Dit kennis kan ik weer meenemen naar de volgende projecten binnen de minor.

Doorgevoerd in het project

De kennis die opgedaan is, verwerkt in de webshop. Door dit kunnen de bezoekers zoals bij “wat ik heb gedaan” besproken is, de website op hun scherm zetten. Dit is een stukje gebruikers gemak, mensen zijn nog al lui ingesteld. Dus als je de mensen het gemakkelijker kan maken door een PWA toe te voegen, is dit voor een webshop al snel veel van waarde.

Relevantie leerdoel UIX

Als UIX designer wil je een zo’n prettig mogelijk gebruik voor de end user. Hierbij heb ik dus gekeken hoe de webshop een nog betere experience kan bieden dan alleen de site al doet. Hier bij ben ik in het diepen gesprongen en een PWA opgezet. Om te kijken of dit daadwerkelijk ook helpt bij de ervaring van de webshop heb ik een a/b test opgezet (Leerdoel level twee).  Deze test was dan als volgt opgezet, ik had de gebruiker bepaalde doelen gegeven: bestel een sneaker, customize een sneaker en neem contact met ons op. Deze doelen moesten zo snel mogelijk behaald worden. Eerst liet ik de gebruiker de website op mobiel hiervoor gebruiken, dit ging al vloeiend en zonder enige problemen. Toen de PWA, dit ging nog sneller omdat de gebruiker de site niet hoefde op te zoeken en omdat een PWA lokaal data op slaat op de telefoon. 8/10 users had een voorkeur voor de PWA, omdat deze gemakkelijk konden bereiken via hun mobiel zonder iets anders in te typen. De andere twee vonden nog een app overbodig op hun telefoon, dus hadden een voorkeur voor de website.

Al met al, werd de PWA goed ontvangen tijdens de a/b testen. Door de simpliciteit en het snelle gebruik van de toepassing.