Touchtribe ontwikkelde een klantportaal voor Milieu Service Nederland

Milieu Service Nederland

Klantportaal voor beste digitale serviceverlening

Milieu Service Nederland is de ondernemende afvalpartner voor zakelijk Nederland. Met vooruitstrevende oplossingen helpen zij organisaties verder op het gebied van afvalinzameling, zero waste en circulaire bedrijfsvoering. Innovatie speelt hierbij een belangrijke rol. Zo bouwde Milieu Service Nederland een platform dat het afval van hun klanten matcht met de juiste inzamelaar en verwerker. Het doel? Zoveel mogelijk grondstoffen in de keten houden, zodat een volledig circulaire economie weer een stap dichterbij komt. Wij ontwikkelden het klantportaal ‘MijnMSN’ waarin klanten services, zakelijke informatie (zoals onder andere facturen en rapportages) en communicatie kunnen inzien en beheren.

Digitale functionaliteiten binnen het MSN klantportaal

Backend for frontend (BFF)

Milieu Service Nederland wil innoveren. Klanten vragen steeds meer digitale serviceverlening, van inzicht in informatie zoals afvalstoffenrapportages, digitale facturen en inzicht in de ledigingskalender. Daarnaast willen klanten zelf acties kunnen ondernemen, zoals het aanvragen van extra diensten.

Milieu Service Nederland brengt als ketenregisseur iedereen binnen de afvalketen bij elkaar en is hiermee de schakel tussen organisaties aan de ene kant en inzamelaars en verwerkers aan de andere kant. Met meer dan 100+ partners zijn ze het grootste afvalplatform van Nederland.

Om de diensten van partners en de vraag van klanten bij elkaar te brengen bouwden wij in AWS een backend for frontend waar alle data uit meerdere bronnen binnenkomt:

  • Alle backoffice systemen en relationele klantgegevens zijn door low code agency Webflight opgezet in Mendix.

  • Vanuit een ander systeem komen alle producten en diensten van lokale afvalverwerkers.

  • Gebruikers van de app moeten toegang hebben tot alle data uit de verschillende systemen. Hiervoor is een Cognito userpool opgezet, waarmee gebruikers via Single-Sign-On toegang hebben.

Vanuit de backend for frontend wordt alle data via GraphQL API’s uitgeserveerd in het klantportaal ‘Mijn Milieuservice’.

Alles in 1 klantportaal ‘MijnMSN’

Voor klanten was er geen mogelijkheid om digitaal zaken aan te vragen. Voor een extra container of lediging moest er gebeld worden met de servicedesk van Milieu Service Nederland. De service medewerker belegde vervolgens de vraag bij de uitvoerende partner. 

Om klanten realtime inzicht te geven in de uitvoering van diensten, is de interface voor leveranciers (partners) ook gedigitaliseerd. Partners met verschillende technologische volwassenheid zijn aangesloten, van moderne API integraties tot Excel uploads en manuele invoer. Dit proces optimaliseren was een belangrijk onderdeel in het verbeteren van de digitale serviceverlening.


Milieu Service Nederland kaart overzicht locaties
Ledigingen aanvragen in het mijn-MSN klantportaal

Features voor beste klant experience

Milieu Service Nederland richt zich op grotere bedrijven met meerdere locaties. Alle contracten die worden afgesloten zijn maatwerk. Om de best mogelijke dienstverlening te kunnen bieden moet het digitale klantportaal daarom voldoen aan de voorwaarden:

  • Klanten moeten zelf inzicht en controle hebben in hun locaties en afgenomen services en contracten per locatie.

  • Inzicht in ophaaltijden.

  • Downloaden van ledigingskalender, milieurapportages en afvalstof overzichten. 

  • Facturen downloaden (werd voorheen eenmalig gemaild).

  • Klanten moeten zelf gebruikers per locatie kunnen autoriseren.

Het portaal is opgebouwd als PWA, maar heeft een echte app ‘look en feel'

Daan de Vries, Senior Frontend developer bij Touchtribe
Mijn-MSN portaal op mobiel

Portaal met ‘app look & feel’

Het design van het klantportaal is zo geïmplementeerd dat het aanvoelt alsof je een app gebruikt. Zo zijn alle pagina transities geanimeerd, zowel op mobiel als op desktop. Daarnaast zijn er slimme responsive functies toegevoegd, zoals de tab bar aan de onderkant van het scherm waar de belangrijkste knoppen onder 1 tab gemakkelijk met de duim benaderbaar zijn.

Het portaal is op basis van NextJS ontwikkeld en maken gebruik van de laatste development innovaties om de beste gebruikerservaring te bieden:

Mijn MSN portal gebruikt server side rendering voor optimale snelheid

Server side rendering

Server-side rendering (SSR) is een techniek waarbij de webapplicatie op de server wordt gerenderd en de HTML-code naar de browser van de gebruiker wordt gestuurd. Dit verbetert de gebruikerservaring omdat de inhoud sneller wordt getoond en zoekmachines beter in staat zijn om de inhoud te indexeren. SSR is vooral nuttig voor webapplicaties met veel dynamische inhoud.

Static site generation Milieu Service Nederland

Static site generation

Static Site Generation (SSG) is een techniek die statische websites genereert vanuit bronbestanden zoals tekst, afbeeldingen en sjablonen met een generator. Het verbetert de snelheid, veiligheid en schaalbaarheid van de website en is goedkoper omdat er geen serverkosten zijn voor het uitvoeren van de applicatie.

Het MSN klantportaal gebruikt Client-side fetching voor de beste user experience

Client-side fetching

Client-side fetching is een techniek waarbij data van een server wordt opgehaald en verwerkt door een webapplicatie die wordt uitgevoerd in de browser van de gebruiker. Client-side fetching kan de gebruikerservaring verbeteren omdat data snel kan worden geladen en de pagina niet hoeft te worden ververst. Het kan de prestaties van een webapplicatie verbeteren omdat de browser de verwerking van data kan uitvoert. Echter, het kan ook beveiligingsrisico's met zich meebrengen als de gegevens niet op de juiste manier worden beveiligd en verwerkt.

Toekomstvast klantportaal

Door het gebruik van het klantportaal heeft Milieu Service Nederland een efficiëntere en snellere dienstverlening kunnen realiseren voor hun klanten. Klanten hebben nu realtime inzicht in de uitvoering van diensten en kunnen zelf diensten aanvragen. Dit heeft geleid tot een verbetering van de klanttevredenheid en een grotere tevredenheid van klanten met de dienstverlening van Milieu Service Nederland. Milieu Service Nederland blijft zich richten op innovatie en verdere verbetering van digitale serviceverlening. Zo kunnen ze organisaties nog beter van dienst en helpen met hun missie: Nederland afvalvrij en CO2-neutraal laten ondernemen.

  • Top 250

    Top 250 Groeibedrijven

    MSN is in 2020 opgenomen in de lijst Top 250 Groeibedrijven

  • 20%

    Gemiddelde jaarlijkse groei

    Van 2016 t/m 2019 een gemiddelde jaarlijkse groei van minimaal 20%