claude

    Doorzoek je Claude Code gesprekken

    Dit is precies wat ik bedoel met digitale democratisering, of perfecte software voor een publiek van één volgens Gaurav Ramesh (dank Erwin!)
    Simon Willison lost een probleem voor zichzelf op, hoe kan ik beter door de transcripts van Claude Code zoeken en navigeren, en deelt dat met de rest van het internet. Hij heeft net als ik het probleem dat je zoveel doet in Claude en Claude Code, dat zoeken ín de chatsessies belangrijk is. Om te achterhalen wat je precies had gedaan, welke opdracht waar is gegeven of waarom bepaalde keuzes zijn gemaakt.

    Zijn Claude Code Transcripts tool is een elegante oplossing, je kiest een chatsessie uit je geschiedenis en je krijgt direct een HTML pagina met de volledige tekst, inclusief de denk-stappen van het model. In de README file van de tool geeft Willison nog meer commando’s en output opties.

    De reden om deze tool te maken vind ik minstens zo opmerkelijk:

    These days I’m writing significantly more code via Claude Code than by typing text into a text editor myself. I’m actually getting more coding work done on my phone than on my laptop, thanks to the Claude Code interface in Anthropic’s Claude iPhone app. Being able to have an idea on a walk and turn that into working, tested and documented code from a couple of prompts on my phone is a truly science fiction way of working. I’m enjoying it a lot.

    Een digitaal document toont verschillende prompts en informatie over het ontwerpen van een service met betrekking tot websites en workflows het is weergegeven binnen een webbrowser op een computer.

    En het werkt best aardig! Zie hier een transcript van een sessie waar ik nu mee bezig ben, om een nieuwe bookmark/like extensie te maken die werkt zoals ik het liefste heb.

    Mooi spul! Claude Code Transcripts

    Agents en skills

    Ik zat begin deze middag met een probleem. Ik wilde Claude Code een agent laten maken die ISO tests (dank je wel Monique) op mijn code kon doen. Zelfstandig, zonder mij te veel lastig te vallen. En natuurlijk met feedback. Maar wat Claude Code gaf was een skill, maar dat was volgens mij niet wat ik nodig had.

    Dat bracht me op het agents versus skills concept wat ik nog steeds niet goed begrijp en volgens mij andere mensen ook niet: agents en skills zien er misschien op het oppervlak hetzelfde uit (allebei mappen met instructies), maar ze zijn totaal anders. Of eigenlijk liggen ze heel dicht bij elkaar in mijn hoofd. Een agent heeft bepaalde skills. Een tekstschrijver kan zelfstandig teksten schrijven en heeft de competenties om dat te doen. Maar waarom zijn die twee dan gescheiden? Het blijkt dus, het gaat niet zozeer om techniek als om je rol:

    • Met Skills ben jij de stuurman en Claude je copiloot.
    • Met Agents ben jij de projectleider en Claude is je team.

    En de keuze bepaalt eigenlijk hoe je Claude Code gaat inzetten.

    Een handleiding versus een collega

    Skills zijn instructiehandboeken. Agents zijn zelfstandige specialisten.

    Een Skill zit in een mapje met een SKILL.md bestand met richtlijnen, voorbeelden en referentiematerialen. Wanneer jij Claude iets vraagt, scant hij of een Skill relevant is. Zo ja, dan laadt hij ze in. Hij leest de instructies en volgt ze op. Ik wacht er ondertussen op totdat Claude klaar is.

    Een Agent is anders. Het zijn Mini-Claude’s met hun eigen system prompt, toolset en afzonderlijke context window van 200.000 tokens. Agents zijn eigenlijk een team van experts: ze hebben elk hun eigen rol en functie. Ze gaan zelfstandig aan de slag, kunnen fouten herkennen, teruggaan, opnieuw proberen en itereren. Ze rapporteren terug met resultaten, niet met “ik ben klaar met je instructies volgen”.

    Praktisch gesteld:

    Een Skill zegt: “Hier staan de richtlijnen voor branding, volg ze netjes.”

    Een Agent zegt: “Jij bent de design expert. Ga zelfstandig controleren of deze site aan onze brand guidelines voldoet. Rapporteer terug wat er mis is en wat je zou aanpassen.”

    Waar het ingewikkelder wordt in mijn hoofd

    Dit is het kernverschil. Maar nu wordt het interessant, want ik moet een keuze maken. En die keuze bepaalt eigenlijk hoe het werk gaat verlopen.

    Ik merkte dat op het moment dat ik Claude Code vraag om bijvoorbeeld: “Controleer mijn code op performance issues.” Claude Code kan kiezen: Skill of Agent?

    Als Claude een Skill maakt, laadt die in mijn huidige window. Claude leest de performance-checklist, volgt stap voor stap wat ik heb geschreven en geeft feedback. Het is snel, synchroon, en ik ben niet afhankelijk van agents die hun eigen gang gaan.

    Als Claude een Agent maakt, maak ik eigenlijk een specialist aan die onafhankelijk werkt. Die Agent gaat mijn code analyseren, kan teruggaan en dieper graven, kan voorstellen testen, kan itereren. Ik hoef niet te wachten. Ik laat de Agent los en ga zelf verder met iets anders. De Agent rapporteert later.

    Delegeren of dirigeren

    Hier zit de echte beslissing. Het gaat niet zozeer om de techniek als om de werkwijze die ik prettig vind met AI-modellen. En dat is iets waar ik ook nog steeds aan moet wennen: wanneer wil ik nou eigenlijk een agent gebruiken en wanneer wil ik een skill gebruiken? Ik weet dat nog steeds niet heel goed. Maar langzaam zie ik wel een patroon.

    Agents zijn voor exploratie en verbetering. Je zet ze in als je:

    • Werk wil delegeren
    • Iets complexs hebt dat iteratie nodig heeft
    • Parallel aan iets anders wil werken terwijl de Agent bezig is
    • Wil dat Claude zelfstandig onderzoekt, aanpassingen doet, fouten corrigeert
    • Meer specialisatie wil dan generieke hulp

    Praktisch voorbeeld: ik heb een codebase met 50 bestanden en ik wil dat Claude die doorloopt, security issues vindt, patches voorstelt en die test. Ik kies dan voor een agent, want die gaat zelfstandig aan de slag. Ik kan ondertussen iets anders doen.

    Skills zijn voor regels en standaarden. Je zet ze in als je:

    • In je main window bent
    • Wil dat Claude je wat slimmer maakt terwijl je aan het stuur zit
    • Het werk synchroon kan (in- en uitvoer in één keer)
    • Bereid bent om te wachten
    • Jezelf de “denker” wil blijven en Claude de “assistent”

    Praktisch voorbeeld: ik heb brand guidelines geschreven en ik wil dat Claude die altijd toepast bij documenten. Ik kies dan voor een skill. Claude leert het, past het toe als het nodig is.

    Neo in de Matrix

    De fout die ik bijna maakte

    Dus ik wilde een ISO-test agent. Claude Code maakte een Skill. Ik zat even te denken: kan ik niet gewoon een Agent maken die die ISO-Skill inlaadt?

    Een agent die een Skill inlaadt is dubbel werk. Je agent zou in feite zeggen: “Wacht, laat me eerst deze handleiding lezen” en dan de instructies volgen. Dat kost dus extra tokens voor iets wat eigenlijk niet nodig is. Dan kan ik net zo goed zelf dat handboek lezen en het werk zelf doen. “Laat maar, ik doe het zelf wel” - en dan ben je sneller klaar.

    Waar ze wel samenwerken

    Nou, er is één scenario waar het wel voordelig is. Niet voor dezelfde taak, maar complementair.

    Stel je de Ticket-beheerder agent voor. Die Agent doet iets groots: aanvragen verwerken, prioriteiten stellen, bepalen wie het gaat oppakken. En incidenteel heeft die Agent iets nodig wat in een Skill staat. Bijvoorbeeld: “Zorg ervoor dat alle output aan onze schrijfstijl voldoet.”

    Dan kan de Ticket-beheerder agent die Schrijfstijl-Skill inladen wanneer nodig. Dat is niet dubbel werk, dat is praktisch. De Agent delegeert een onderdeel van zijn taak naar gespecialiseerde instructies.

    Dit illustreert eigenlijk een belangrijke nuance: Skills zijn voor “volg de regels” - je wilt consistency en standaarden. Agents zijn voor “maak het beter” - je wilt dat iemand nadenkt, itereert, verbetert. De Ticket-beheerder hoeft niet na te denken over schrijfstijl (daar zijn regels voor), maar wel over wat de beste aanpak is om tickets op te lossen.

    De mindset shift

    Ik dacht eerst, Claude Code is een assistent die me helpt. Ik zit aan het stuur en Claude voert uit.

    Maar met agents gebeurt er iets anders. Je gaat delegeren. Je zet specialisten in. Je hebt minder controle per moment, maar je hebt meer output totaal. Omdat agents parallel kunnen werken. Omdat ze zelfstandig kunnen itereren. Omdat ze context ruimte hebben om écht diep te gaan.

    Skills passen in het “Claude helpt me” model. Je bent stuurman. Claude is copiloot.

    Agents passen in het “ik delegeer werk” model. Je bent projectleider. Claude je team.

    En gaandeweg ontdekte ik nog iets: je kunt deze twee ook combineren in je workflow. Je zet Agents in voor de exploratie en verbetering. Laat ze het werk beter maken, dieper graven. En als je tevreden bent met het resultaat, vertaal je die kennis naar Skills. Die worden dan de regels en standaarden die je altijd wilt toepassen. Agents voor de vraag “hoe maken we dit beter?”, Skills voor de regel “dit doen we altijd zo”.

    De volgende stap

    Ik ga mijn ISO-test Skill omzetten naar een Agent. Niet omdat het technisch beter is, maar omdat ik wil dat die zelfstandig code doorloopt, fouten markeert, voorstellen test en rapporteert. Ik wil delegeren. Ik wil dat die specialist eigenaarschap neemt.

    Dus: heb je werk dat complex is? Dat iteratie nodig heeft? Dat je parallel wilt doen? Maak een Agent.

    Heb je werk dat consistent moet en deel van je standaardproces? Maak een Skill.

    De keuze bepaalt eigenlijk hoe je Claude Code gaat ervaren. Of je Claude als assistent voelt, of als team.

    Hoe je een map vol screenshots op jouw manier kunt opschonen

    Mijn map ~/Downloads is echt een vergaarbak van allerlei bestanden, screenshots en tijdelijke zooi. Met name de hoeveelheid screenshots en gedownloade afbeeldingen wil nog wel eens uit de hand lopen. Ik maak er veel, soms voor een blogpost, soms bij een mail, soms vanwege de foutmelding of gewoon omdat het een flauwe meme is. Elke afbeelding heeft dus een andere betekenis voor me. Simpelweg alles weggooien na een periode werkt voor mij niet. Wekelijks of dagelijks keuzes maken welke ik wil bewaren, die standvastigheid heb ik niet. Automatiseren vanuit een aparte map, dat is het probleem verplaatsen.

    Dus ik moest iets anders bedenken.

    Wat bij mij wel kan werken, is een webpagina waar ik thumbnails van de screenshots zie, de juiste kan selecteren en daarna verwijderen. Dat moet te doen zijn. Met een lokale webpagina, die direct alles laat zien van de map Downloads.

    Met de hulp van Claude Opus 4.0 bouwde ik een lokale Python webapplicatie die het volgende doet:

    • Toon alle afbeeldingen in een map en zet ze in een grid, inclusief thumbnail van de afbeelding
    • Met je muis of toetsenbord navigeer je door de afbeeldingen en kun je selecteren welke je wilt verwijderen
    • Of individuele afbeeldingen verwijderen
    • Direct alles (de-)selecteren
    Screenshot van de screenshot manager

    Je kunt de code vinden op Github en alle prompts en uitleg op deze pagina. Je kunt alles direct hergebruiken voor je eigen map(pen). Lees zowel de prompts, het readme-bestand als de instructies van Claude goed door, zodat je weet wat je doet. Pas eventueel de bronmap aan of gebruik de code om met je eigen prompts te verbeteren en naar je eigen situatie om te zetten. Onderaan de instructies vind je nog ideeën om de app verder uit te bouwen. Misschien zit er iets voor je tussen.

    Ik liet AI een adventskalender maken

    De afgelopen weken had ik losse ideeën die nu samen zijn gekomen in een klein project wat ik zojuist live zette. De AIdventskalender 2024. Een persoonlijk project om AI en programmeren samen te brengen. Een adventskalender die elke dag een tip geeft om de feestmaand door te komen met behulp van AI diensten. Voor playlists, gedichten en films. Wat bracht me tot dit project? Drie losse momenten.

    1. Terwijl ik met iemand praatte over adventskalenders, vroeg ik me af of het domein AIdventskalender.nl nog vrij zou zijn. Ja dus.
    2. Mijn oude blog Digging the Digital draait nog altijd op WordPress, maar liever wil ik die omzetten in een statische site, zodat het minder resources kost. En eenvoudiger ergens is te hosten. Ik wil daarom kijken hoe ik die site in Hugo kan omzetten, een framework voor statische sites
    3. In POKI, de Podcast over Kunstmatige Intelligentie, hoorde ik Wietse praten over manieren om programmeerwerk over te laten nemen door AI.

    Breng dat allemaal bij elkaar in mijn hoofd… en ik heb weer een projectje!

    Screenshot van de AIdventskalender

    De route

    In een aantal avonden maakte ik de AIdventskalender. Ik heb echter geen letter code zelf geschreven. Alles is door AI gegenereerd, ik heb het eenvoudigweg steeds geknipt en geplakt in een code-editor. Krijg ik een foutmelding? Dan geef ik de foutmelding aan de chatbot (Claude Pro in dit geval) en die ging aan de slag voor me om het te verbeteren. Ik heb wel meer dan alleen Claude gebruikt. De allereerste versie van de site kwam uit Open Hands, een open source platform met software development agents. Met behulp van AI kun je een eerste ruwe versie van een app laten maken. Die versie heb ik overgenomen in VSCode en ben daarna met behulp van de chatbot Claude stap voor stap alles gaan verbeteren.

    Je kunt een groot deel meelezen in het chatverslag dat ik op Github heb gepubliceerd.

    Notities

    Het hele traject ging zeker niet van een leien dakje. We zijn er nog echt niet om AI zelfstandig aan de slag te zetten voor een project als dit. Wat me zoal opviel in het hele proces:

    • Ik moest sowieso een hoop troubleshooten rondom de lokale installatie van Hugo. Tenminste, dat dacht ik. Maar Claude ging in een rabbit-hole van versies en plugins die uiteindelijk niet nodig bleek te zijn. Door zelf goed op te letten wat er aan antwoorden kwam en tussentijds ook wat bij te lezen via de good old zoekmachine.
    • Wat me brengt bij: Enige kennis is wel handig. Zowel van programmeren in het algemeen als van verschillende pakketten. De code die ik kreeg was soms verouderd, soms besloot Claude andere variabelen te gebruiken. Of het vergat hele stukken opnieuw aan te bieden. Als je de basisprincipes van programmeren enigszins herkent, kun je al snel aangeven waar de chatbot beter zijn best moet doen.
    • Een systeem prompt is zeker handig. Daarmee geef je basis instructies aan de chatsessie. Hier kon ik steeds mee tweaken zoals de opdracht om altijd de volledige code plus eventuele aanpassingen terug te geven.
    • Claude is heel vriendelijk. Aan de hand van de code en de werking had het al snel door dat ik een adventskalender maakte. Daarop kwam het met suggesties om de kalender wat meer aan te kleden. Niet alle suggesties waren even waardevol, maar er zat soms wat aardigs tussen wat me op nieuwe richtingen bracht.
    • Met logisch nadenken kom je best ver. Als ik zelf het idee had dat we onnodige code maakte, dan vroeg ik dat, stelde een alternatief voor en hoe Claude dat zou oppakken. Soms gingen we dan de goede kant op, soms gaf Claude aan waarom het wel handig is om een bepaalde keuze te maken.
    • Je eigen creativiteit helpt. Bijvoorbeeld, ik wilde een Javascript om de deur van elke dag echt als deur te openen en sluiten. Na wat iteraties met Claude had ik een versie waar ik tevreden over ben. Claude had dit zelf (nog) niet bedacht.
    • Ik liet Claude een eenvoudig Bash-script schrijven om direct 24 dagen aan ideeën rondom Kerstmis en AI te genereren. En om deze direct in het juiste bestandsformat op te slaan. Om eerlijk te zijn, de teksten waren allemaal te generiek. Voor elk deurtje heb ik de tekst zelf herschreven en er eigen links bij gezocht. Dus eigenlijk is de content is van mij, de code van Claude.
    • Er zaten steeds een paar dagen tussen de sessies dat ik met Claude werkte. Ik kon soms met de bestaande chatsessie doorgaan. Maar door de populariteit van Claude, kreeg ik meldingen dat chatsessies niet té lang moesten worden en ik beter een nieuwe sessie kon beginnen. Dat betekende dat ik weer allerlei kennis moest overhevelen, zoals bestanden en afspraken.
    • Sowieso helpt het om bestanden te uploaden met je code. HTML, Javascript, CSS, Claude eet alles en kan je dan veel gerichter helpen. Zelfs screenshots van mijn browser-console met debug-berichten konden Claude de goede kant op sturen.

    Ik had nog geen ervaring met Github Actions, een manier om automatisch taken en workflows uit te voeren in Github repositories. Met behulp van Claude kreeg ik alle uitleg, achtergrondinformatie en stappenplan. Toegepast op mijn situatie. Door iets nieuws te leren (Github Actions in dit geval) en het direct in een lopend project toe te passen, geeft mij meer voldoening dan eerst alle achtergronden te kennen en het stapje voor stapje via een Hello World voorbeeld te leren. Zo ook met het werken in Hugo templates, de projectstructuur en hoe content en templates samen tot een site leiden.

    Creativiteit is een vereiste

    Ik ben over de afgelopen 2 weken zo’n 6 uur met dit project bezig geweest. Van registratie van de domeinnaam tot publicatie van de huidige versie. Leuk om hier eens mee bezig te zijn. Ik heb geen ambitie om software engineer te worden, of een full stack developer. Maar soms heb je van die ideeën die je wel zelf tot leven wil brengen. De code die ik door Claude heb laten maken zal door menselijke intelligentie en kennis zeker sneller, compacter en efficiënter kunnen. Goede creatieve developers zijn echt nog altijd nodig. Hun kennis, levenservaring en creatief vermogen brengt een project veel verder dan wat AI nu kan. Als dit een proof of concept is, dan zou ik het vervolg zeker door een creatieve developer verder laten oppakken.

    Geniet de komende maand van de AIdventskalender! Alles is statisch gehost, je kunt de broncode zelf bekijken en verbeteren als je wilt.

    Wat vind je er van?