Ga naar inhoud
Collective Lab

← Verhalen  ·  Vincent van Maurik

HARTslag

Een volledig klikbaar website-prototype, een complete huisstijl en webteksten voor een nieuw christelijk platform — in één keer developer-klaar opgeleverd.

Klant
Vincent van Maurik
Type
Webdesign
Jaar
2026
Wat we deden
Webdesign · Klikbaar prototype · Huisstijl & logo · AI-webteksten · Developer-handover
HARTslag website-prototype — homepage met hero en agenda
De missie

HARTslag is een christelijk platform in Zuidwest-Friesland dat creatieve en geestelijk geïnspireerde initiatieven verbindt, toerust en faciliteert. Voor de start van het platform ontwierp ik een volledig klikbaar website-prototype, een complete huisstijl en de Nederlandse webteksten — opgeleverd als developer-klare handover.

De uitdaging

HARTslag was net opgericht en wilde zichtbaar worden richting kerken, makers en vrijwilligers in Zuidwest-Friesland. Er was nog niets: geen website, geen huisstijl en geen teksten — en geen ruimte om vooraf een groot ontwerptraject te financieren.

De vraag was om snel een concreet, tastbaar beeld neer te zetten van hoe het platform eruit kon zien, zodat het bestuur kon beslissen en een developer daarna één-op-één kon bouwen.

Wat we bouwden

Ik koos voor een prototype-first aanpak: in plaats van losse schetsen leverde ik een volledig klikbaar HTML-prototype van de hele site — home, over HARTslag, initiatieven, agenda, doe mee, samenwerken, werkwijze en contact.

De Nederlandse webteksten zijn met AI gegenereerd en geredigeerd, afgestemd op de toon van een christelijk platform: warm, uitnodigend en helder.

Daarnaast legde ik de complete huisstijl vast op een aparte huisstijlpagina: logo-varianten, het kleurenpalet rond HARTslag-rood en inkt-navy, de typografie (Bricolage Grotesque, Mulish en Newsreader) en het hartslag-motief — de pulslijn die als rode draad door alle uitingen loopt.

Het geheel is opgeleverd als nette handover, met design-tokens en herbruikbare componenten in de stylesheets, zodat een developer het ontwerp direct kan nabouwen zonder gokwerk.

HARTslag huisstijl — kleurenpalet
HARTslag huisstijl — kleurenpalet
HARTslag huisstijl — typografie
HARTslag huisstijl — typografie
De vrucht

Wat het opleverde — in cijfers en in wat mensen ervan merken.

8 pagina's
volledig klikbaar prototype
1 huisstijl
logo, kleur, typografie & motief
Developer-klaar
design-tokens en componenten in de handover

Wordt jouw missie het volgende verhaal?

Vertel kort waar je aan werkt. We plannen een vrijblijvende kennismaking — om te luisteren en mee te denken.