Naar de inhoud
Alle projecten

Het operationsteam van NHG werkte in vier losse Mendix-apps, elk met een eigen menu en eigen gewoontes. We brachten ze samen in één back-office, op een navigatie die het team zelf hielp bouwen en een design system dat Mendix begrijpt.

Drie schermen van de nieuwe NHG back-office als zwevende panelen, het ene achter het andere: het garantieoverzicht met een zoekpaneel in NHG-blauw, de verliesdeclaratie met de twaalf genummerde stappen, en vooraan de documenten van een garantie.

De uitdaging

NHG, de Nationale Hypotheek Garantie, is het vangnet voor huiseigenaren die hun hypotheek niet meer kunnen betalen na een ingrijpende gebeurtenis: een scheiding, het verlies van een baan, het overlijden van een partner. Achter dat vangnet zit een operationsteam dat garanties administreert, betalingsachterstanden volgt en verliesdeclaraties van geldverstrekkers beoordeelt.

Dat werk gebeurde in vier back-office apps, gebouwd in Mendix: Workflow, Garantieadministratie, Beheer en Claims. Elke app had een eigen menu, waardoor er permanent twee menubalken in beeld stonden, één om tussen apps te wisselen en één om binnen een app te navigeren. Knoppen stonden nu eens onderaan de pagina en dan weer halverwege. Er was geen gedeelde ontwerptaal waar een developer op kon terugvallen.

NHG besloot de vier apps samen te voegen. Dat was het moment om ook de ervaring opnieuw te ontwerpen, en daar vroegen ze ons voor.

Een dossier van een garantie loopt door meerdere processen en langs meerdere collega's. Voordat we iets ontwierpen, wilden we weten hoe dat werk er van dag tot dag uitziet. We interviewden zes mensen uit het team over hun taken, waar ze vastliepen en wat ze in de huidige apps omzeilden.

We werkten wekelijks een dag bij NHG op kantoor. Zo konden we een vraag stellen op het moment dat hij opkwam, en kon het team meekijken terwijl het ontwerp vorm kreeg, in plaats van pas aan het eind.

De grootste vraag was de navigatie. Vier apps met elk een eigen menu leveren tientallen functies op, van garanties zoeken tot achterstandsbrieven controleren, en die moesten in één structuur passen die het team zonder nadenken kon lezen.

Daarvoor schreven we elke functie op een kaartje en vroegen we drie collega's om ze, los van de huidige indeling, te groeperen en die groepen een naam te geven. Ze dachten hardop, zodat we hoorden welke kaartjes lastig waren en waarom. Een card sorting laat zien hoe gebruikers het werk zelf in hun hoofd hebben ingedeeld, iets wat je uit een gesprek alleen zelden helder krijgt. Uit drie sessies kwam een indeling die per proces was opgebouwd, met garanties binnen één klik bereikbaar.

Sandra, Marco en Jeroen van NHG sorteren de functies van vier apps in een structuur die voor hen logisch is.
  • Workflow

  • Garantieadministratie

  • Beheer

  • Claims

Vier apps, elk met een eigen menubalk

NHG App

  • Taken
  • Rapporten
  • Garantieadministratie
  • Claims
  • Woningbehoud
  • Veiling
  • Klantreis
  • Finance
  • ESB

Instellingen

Eén gevalideerde menubalk met negen logische onderdelen

Mendix, het low-code platform waarop NHG bouwt, levert zijn eigen bouwstenen. Een ontwerp dat daar geen rekening mee houdt, ziet er in Figma goed uit en kost daarna weken om na te bouwen. Daarom zetten we het design system op van fundament naar scherm: kleuren, typografie en iconen, dan componenten als knoppen, tabellen en formulieren, dan paginatemplates die vastleggen waar acties staan.

Elk onderdeel bespraken we met het Mendix-team van NHG voordat het definitief werd. Iconen werden een iconenfont in plaats van losse bestanden omdat dat in Mendix sneller werkt, en de templates sluiten aan op de widgets die het platform al kent. Het resultaat is een systeem in de huisstijl van NHG dat developers kunnen bouwen zonder elke pagina opnieuw te hoeven bedenken.

Ontworpen voor dossierwerk

“Het designwerk van [het team] maakt een aantal voorheen frustrerende taken veel sneller en makkelijker. De samenwerking verliep soepel, met heldere communicatie en een laagdrempelige, hands-on aanpak. Hun vermogen om eindgebruikers te betrekken en uit te leggen viel echt op en maakte de transitie naadloos.”

Gerrie de Vries

Business Analist, NHG

De impact

Door de navigatie samen met het team te ontwerpen en het design system af te stemmen op Mendix, kreeg operations een back-office waarin een dossier één plek heeft en een actie altijd op dezelfde plek staat.

We maten het effect met een User Experience Questionnaire, ingevuld door het hele team voor en na het herontwerp. Het werk gaat sneller, is duidelijker en het team is gemotiveerder om de applicatie te gebruiken.

  • 19%

    Sneller werken

    Het team schat zijn taken 19% efficiënter in, zo'n 35 uur per gebruiker per jaar.

  • 7–15%

    Minder fouten

    De duidelijkheid steeg met 7%, wat zich vertaalt in 7 tot 15% minder fouten.

  • +7%

    Motivatie

    Het team heeft meer zin om de applicatie te gebruiken dan voor het herontwerp.

  • +13%

    Tevredenheid

    De algehele tevredenheid over de applicatie steeg met 13%.