Inspiratie

Mijn inspiratiebord, uitgelegd door Claude

Een bord voor screenshots van websites die ik mooi vind. Claude bekijkt elke screenshot, schrijft uit waarom het werkt en deelt hem in bij een stijlgroep. Via een eigen MCP-server kan Claude het bord daarna gebruiken bij ontwerpwerk.

inspiratie.gerbenput.com

Node.js · Express · PostgreSQL · sharp · Anthropic API · MCP · Docker

Inspiratie: Schermafbeelding van de live site — Scroll: dit is de echte site

Het verhaal

Het idee

Als ik een mooie site zie, maak ik een screenshot. Die verdwenen in een map. Nu krijgt elke screenshot een uitleg en een stijlgroep, en kan ik bij een nieuw ontwerp zeggen: maak het zoals die.

Het ontwerp

Een risograph-zine in kobaltblauw en fluorroze op korrelig papier: dikke condensed koppen, scheve stempels op de kaarten en een bewerkvenster als opengeslagen boek.

Onder de motorkap

Uploads worden met sharp verkleind en als WebP in PostgreSQL bewaard. Claude analyseert ze één voor één met een vast antwoordformaat. Een eigen MCP-server zonder SDK geeft Claude alleen-lezen toegang.

Het bord per stijlgroep, met stempels en kleuren (voorbeeldscreenshots)
Een screenshot met de uitleg van Claude, als opengeslagen boek
Inloggen, met de risograph-illustratie

In detail

Slepen of plakken: Screenshots slepen, plakken met Ctrl+V of kiezen, met een bron en een eigen notitie.
Uitleg door Claude: Titel, kleuren, typografie, opbouw en waarvoor het bruikbaar is.
Stijlgroepen: Claude hergebruikt bestaande groepen, zodat het bord geordend blijft.
MCP-server: Stijlen, screenshots en de volledige pagina in stukken opvragen, alleen-lezen.
Export: Het hele bord of één stijlgroep als Markdown voor Claude.
Veilig: Eén wachtwoord, een token dat alleen kan lezen en een limiet op foute pogingen.

Volgend project DroneAI Pre-flight briefing voor je drone