Case samenvatting

Expertise

Development en Prototyping

Platforms

Nuxt.js, Vue.js en Google Vision API

Deliverables

Progressive web app

Vergroot het bewustzijn over plastic afval

De uitdaging: mensen bewust maken van plastic zwerfvuil

Plastic zwerfafval verandert in plastic soep en bedreigt onze oceanen. Het goede nieuws: in de voortzetting van zijn strijd tegen een plasticvrije oceaan gaat de Plastic Soup Surfer deze zomer op avontuur met zijn 3D geprinte foil SUP board, gemaakt van gerecycled plastic. En jij kunt bijdragen! De Plastic Soup Surfer wil dat iedereen meedoet aan deze “Pick Up 10” campagne. Wat je doet: je raapt plastic afval op en maakt er een foto van. Je opgepakte plastic wordt verwerkt in de surfplank; dankzij je foto’s verzamelen we merknamen en fabrikanten. Zo kunnen we de mensen die in de positie zijn om werkelijk iets te veranderen aan de kern van het probleem, confronteren. Maar hoe kunnen wij, louter front-end developers, helpen het verschil te maken?

We worden meestal gevraagd om een betere gebruikerservaring te bouwen, of teams te helpen efficiënter te werken. Maar in dit geval wordt onze doelgroep juist niet aangespoord om meer of sneller te consumeren. Wat kunnen wij doen?

De oplossing: gamified plastic afval opruimen

Bij De Voorhoede zijn we nogal technology minded. Dus begonnen we met een idee dat gedreven werd door technologie: kunnen we op een foto afval automatisch herkennen? Blijkt van wel! En dat niet alleen: we kunnen herkennen of het plastic is, of het een flesje is, of er een merknaam op staat en nog veel meer. Hoe? We gebruiken Google’s Vision API, een cloud service die afbeeldingen analyseert dankzij machine learning. Na een snelle test waren we overtuigd dat ons idee klopte. Maar een technisch bewezen idee is nog verre van iets bruikbaars voor de Plastic Soup Surfer.

Handgetekende visualisatie van het idee voor de Pick Up 10-app
Het idee: met machine learning plastic afval herkennen

De informatie die we terugkrijgen van Google Vision geeft ons allerlei mogelijkheden. In eerste instantie helpt het de Plastic Soup Surfer en partner Litterati in het gevecht voor duurzaamheid. Maar als developers kunnen we de data ook gebruiken om punten toe te kennen aan wat er in de foto te zien is. Met andere woorden: we kunnen plastic afval verzamelen gamifyen! Om onze ideeën snel om te zetten in een werkend prototype organiseerden we een hackathon met de designers van Hike One en Merijn Tinga, de Plastic Soup Surfer zelf.

Plastic soup - Merijn Tinga
De hackathon waarmee de Pick Up 10 campagne werd afgetrapt

Het is indrukwekkend wat je met een groep creatievelingen kan bereiken in een dag. Na een ochtend hadden we met 4 teams een werkend concept ontwikkeld om je uit te dagen om mee te doen, waarmee je foto’s kan nemen, de Google Vision API was geïmplementeerd, we hadden een beloningssysteem gebouwd en uitgedacht hoe gebruikers hun vrienden kunnen uitnodigen om de app ook te gaan gebruiken. Aan het eind van de hackathon knoopten we alles aan elkaar en presto! We hadden een prototype van de app:

Van prototype naar eindproduct was een fluitje van een cent. Dankzij het prototype wisten we al wat de technische uitdagingen waren, en welke interactiepatronen we moesten bouwen. De focus kwam daardoor op het bouwen van een robuuste app. We hoefden ons geen zorgen te maken over de haalbaarheid, of dat de app wel prettig zou bedienen. We stelden een backlog op, bouwden een solide API-implementatie, verfijnden de user flow, strooiden wat verslavende elementjes rond en ziedaar: Pick Up 10 is af! We hopen dat onze inzet je inspireert om zoveel mogelijk plastic zwerfafval op te ruimen omwille van de oceaan, en je je vrienden en familie uitdaagt om jouw score te verbeteren.

Mobiele schermen van pick up 10
Pick Up 10 screenshots

Laten we bespreken wat we kunnen doen

Nena de Clercq

Head of Sales & Operations

post@voorhoede.nl
Laten we bespreken wat we kunnen doen