De vraag
Mijn werk loopt uiteen van onderzoek en software tot planttechnologie en twee consumentenmerken. Een lijst met functies of GitHub-repositories laat onvoldoende zien hoe die gebieden samenkomen. Ik wilde één plek waar bezoekers de vraag achter ieder project, mijn bijdrage en het resultaat kunnen begrijpen.
De aanpak
Ik ontwikkelde de bestaande codebase in Next.js, React en TypeScript door tot een gestructureerd projectarchief. Engels en Nederlands delen één contentmodel en dezelfde paginatemplates. Iedere case verbindt de vraag, aanpak, uitdagingen en uitkomst met relevante broncode, publicaties, visuals of video's. Zoeken en categoriefilters helpen bezoekers het werk te vinden dat hen interesseert.
De uitdaging
De site moet verschillende doelgroepen bedienen en tegelijk samenhang houden. Vertalingen, projectlinks, metadata en navigatie moeten consistent blijven terwijl het archief groeit. Openbare toelichtingen moeten bovendien zorgvuldig omgaan met de grens tussen portfoliomateriaal en vertrouwelijke werkgeversinformatie.
Gebouwd rond de bezoeker
Een rustige, redactionele vormgeving stelt de projectverhalen centraal, met responsieve pagina's, een licht en donker thema en een taalwissel die het huidige project behoudt.
- Herbruikbare projectpagina's met mijn rol, onderbouwend materiaal en verbonden projecten.
- Lokale afbeeldingen, ingebouwde videospelers en een contactformulier met validatie en terugkoppeling over verzending.
- Semantische inhoud, zichtbare toetsenbordfocus en ondersteuning voor minder beweging zijn onderdeel van de interface.
Van inhoud naar een gepubliceerde website
Next.js exporteert de pagina's als statische HTML. Render bouwt en publiceert de site vanuit GitHub main. Het contentmodel genereert ook routes, de sitemap en machineleesbare projectinformatie. Canonieke URL's, taalverwijzingen en gestructureerde data beschrijven de samenhang tussen pagina's.
Wat het opleverde
Een live en onderhoudbaar portfolio op frenkkester.com, met Engels op de hoofdpagina en Nederlands onder /nl/. Nieuwe projecten worden via gedeelde contentrecords toegevoegd en verschijnen automatisch in het archief en de gegenereerde overzichten. De site presenteert mijn werk en laat tegelijk zien hoe ik informatie omzet in een bruikbaar product.
Inzichten
Contentstructuur is onderdeel van productontwerp. Door vertalingen, onderbouwing en navigatie in één model te bewaren, kan de site groeien en toch prettig en samenhangend leesbaar blijven.
Bewijs & materiaal
- WEBBekijk de website
Het live portfolio dat je nu bekijkt. De broncoderepository is privé.