feat(workshop): dia's over wat een agent wel en niet is, en het draaiboek erop aangepast

- twee nieuwe dia's (26 in totaal): Wat is een agent, Wat een agent niet is
- deel 1 opnieuw ingedeeld: landschap 10 minuten, demo met sabotage 10
- alle dianummers in het draaiboek bijgewerkt; 18 paginas
- README en CHANGELOG

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>

00-presentatie/project/slides/nietagent.html

@@ -0,0 +1,13 @@
+<section id="nietagent" data-transition="fade" style="background:#F7F4EC; color:#1E2A3A; font-family:'Nunito Sans', Verdana, sans-serif; padding:128px 128px 160px; display:flex; flex-direction:column; gap:40px">
+<h2 style="font-family:'Rubik', Arial, sans-serif; font-size:64px; font-weight:600; line-height:1.1">Wat een agent niet is</h2>
+<div style="display:flex; gap:24px">
+<div style="flex:1; display:flex; flex-direction:column; gap:16px; background:#FFFFFF; padding:36px; border:1px solid #D8D2C4; border-radius:16px"><h3 style="font-family:'Rubik', Arial, sans-serif; font-size:34px; font-weight:600; color:#1E2A3A; line-height:1.2">Geen mens</h3><p style="font-size:27px; color:#3D4756; line-height:1.4">Geen oordeel, geen zorgplicht, geen verantwoordelijkheid. Een leerling die schrijft dat het thuis misgaat, hoort bij de mentor. Daarom bouwen we een mens in de lus.</p></div>
+<div style="flex:1; display:flex; flex-direction:column; gap:16px; background:#FFFFFF; padding:36px; border:1px solid #D8D2C4; border-radius:16px"><h3 style="font-family:'Rubik', Arial, sans-serif; font-size:34px; font-weight:600; color:#1E2A3A; line-height:1.2">Geen feitenmachine</h3><p style="font-size:27px; color:#3D4756; line-height:1.4">Hij weet niets, hij voorspelt tekst. Zonder kennisbank en zonder de regel 'zeg dat je het niet weet' verzint hij een antwoord dat er goed uitziet.</p></div>
+<div style="flex:1; display:flex; flex-direction:column; gap:16px; background:#FFFFFF; padding:36px; border:1px solid #D8D2C4; border-radius:16px"><h3 style="font-family:'Rubik', Arial, sans-serif; font-size:34px; font-weight:600; color:#1E2A3A; line-height:1.2">Geen programma</h3><p style="font-size:27px; color:#3D4756; line-height:1.4">Hij doet niet twee keer precies hetzelfde. Moet iets zeker zijn, zoals een datum of een woordlimiet, dan doet code dat, of een mens.</p></div>
+<div style="flex:1; display:flex; flex-direction:column; gap:16px; background:#1E2A3A; padding:36px; border:1px solid #1E2A3A; border-radius:16px"><h3 style="font-family:'Rubik', Arial, sans-serif; font-size:34px; font-weight:600; color:#F7F4EC; line-height:1.2">Geen beslisser</h3><p style="font-size:27px; color:#D9DEE6; line-height:1.4">Niet over toelating, cijfers of toezicht bij toetsen. Dat is hoog risico onder de AI Act, en dat bouw je niet op een woensdagmiddag.</p></div>
+</div>
+<p style="font-size:30px; color:#3D4756; line-height:1.4">Een agent is geen collega en geen orakel. Het is gereedschap met een instructie, en jij blijft de eigenaar.</p>
+
+<p style="position:absolute; left:128px; bottom:64px; font-size:24px; color:#8A8F98">Workshop AI Agents met Dify · LeX Consultancy · AI Netwerk Limburg · CC BY-SA 4.0</p><img src="../beelden/logo-lex.png" alt="LeX Consultancy" style="position:absolute; right:128px; bottom:52px; width:90px; height:52px; object-fit:contain">
+<aside>De belangrijkste dia voor AI-geletterdheid. Vraag na de tweede kaart: wie heeft wel eens een antwoord gekregen dat klopte qua vorm maar niet qua feiten? Bijna iedereen. Koppel de vier kaarten aan wat ze straks bouwen: kennisbank (twee), poortwachter (drie), mens in de lus (een), en de AI Act komt terug aan het eind.</aside>
+</section>

00-presentatie/project/slides/patronen.html

@@ -1,5 +1,5 @@
 <section id="patronen" data-transition="fade" style="background:#F7F4EC; color:#1E2A3A; font-family:'Nunito Sans', Verdana, sans-serif; padding:128px 128px 160px; display:flex; flex-direction:column; gap:40px">
 <h2 style="font-family:'Rubik', Arial, sans-serif; font-size:64px; font-weight:600; line-height:1.1">Vijf patronen: hoeveel mag het model zelf beslissen?</h2><table style="font-size:28px; color:#3D4756; border:1px solid #D8D2C4; background:#FFFFFF"><tr style="background:#EFEAE0"><th style="width:34%; color:#1E2A3A">Patroon</th><th style="width:40%; color:#1E2A3A">Wie beslist de stappen</th><th style="width:26%; color:#1E2A3A">Vandaag</th></tr><tr><td style="width:34%; color:#3D4756">1 · Eén aanroep</td><td style="width:40%; color:#3D4756">Jij, vooraf; het model doet één ding</td><td style="width:26%; color:#3D4756">Tekst op niveau</td></tr><tr><td style="width:34%; color:#3D4756">2 · Redeneren met gereedschap</td><td style="width:40%; color:#3D4756">Het model, stap voor stap, met kennisbank</td><td style="width:26%; color:#3D4756">Schoolgids-assistent</td></tr><tr><td style="width:34%; color:#3D4756">3 · Plannen en uitvoeren</td><td style="width:40%; color:#3D4756">Eerst een plan, dan losse uitvoerders</td><td style="width:26%; color:#3D4756">Schoolnieuws: drie kanalen</td></tr><tr><td style="width:34%; color:#3D4756">4 · Zelfkritiek</td><td style="width:40%; color:#3D4756">Het model kijkt zijn eigen werk na</td><td style="width:26%; color:#3D4756">Controleur</td></tr><tr><td style="width:34%; color:#3D4756">5 · Poortwachter</td><td style="width:40%; color:#3D4756">Code of een mens laat het wel of niet door</td><td style="width:26%; color:#3D4756">Poortwachter, docent in de lus</td></tr></table><p style="font-size:28px; color:#3D4756; line-height:1.4">Vuistregel: kies het laagste patroon dat werkt. Elk stapje omhoog kost tijd, credits en verrassingen.</p>
 <p style="position:absolute; left:128px; bottom:64px; font-size:24px; color:#8A8F98">Workshop AI Agents met Dify · LeX Consultancy · AI Netwerk Limburg · CC BY-SA 4.0</p><img src="../beelden/logo-lex.png" alt="LeX Consultancy" style="position:absolute; right:128px; bottom:52px; width:90px; height:52px; object-fit:contain">
-<aside>Niet uitputtend behandelen; de bijlage Ontwerppatronen gaat mee naar huis. Wel de vuistregel benoemen.</aside>
+<aside>Niet uitputtend behandelen; de bijlage Ontwerppatronen gaat mee naar huis. Twee zinnen: hoeveel ruimte geef je het model, en de vuistregel kies het laagste patroon dat werkt. De vorige twee dia's hebben het zware werk al gedaan.</aside>
 </section>

00-presentatie/project/slides/programma.html

@@ -1,5 +1,5 @@
 <section id="programma" data-transition="fade" style="background:#F7F4EC; color:#1E2A3A; font-family:'Nunito Sans', Verdana, sans-serif; padding:128px 128px 160px; display:flex; flex-direction:column; gap:40px">
-<h2 style="font-family:'Rubik', Arial, sans-serif; font-size:64px; font-weight:600; line-height:1.1">Tweeënhalf uur, twee bouwblokken</h2><table style="font-size:25px; color:#3D4756; border:1px solid #D8D2C4; background:#FFFFFF"><tr style="background:#EFEAE0"><th style="width:22%; color:#1E2A3A">Tijd</th><th style="width:30%; color:#1E2A3A">Blok</th><th style="width:48%; color:#1E2A3A">Wat je doet</th></tr><tr><td style="width:22%; color:#3D4756">0:00 - 0:15</td><td style="width:30%; color:#3D4756">Het landschap</td><td style="width:48%; color:#3D4756">Peiling, drie lagen, vijf patronen</td></tr><tr><td style="width:22%; color:#3D4756">0:15 - 0:45</td><td style="width:30%; color:#3D4756">Bouwblok 1: workflow</td><td style="width:48%; color:#3D4756">Tekst op niveau, in duo's, eigen niveaus</td></tr><tr><td style="width:22%; color:#3D4756">0:45 - 1:00</td><td style="width:30%; color:#3D4756">Demo en sabotage</td><td style="width:48%; color:#3D4756">Agent met kennisbank; laat hem struikelen</td></tr><tr><td style="width:22%; color:#3D4756">1:00 - 1:15</td><td style="width:30%; color:#3D4756">Pauze</td><td style="width:48%; color:#3D4756"></td></tr><tr><td style="width:22%; color:#3D4756">1:15 - 1:45</td><td style="width:30%; color:#3D4756">Bouwblok 2: kies je spoor</td><td style="width:48%; color:#3D4756">A kennisbank-agent · B poortwachter</td></tr><tr><td style="width:22%; color:#3D4756">1:45 - 2:05</td><td style="width:30%; color:#3D4756">Ontwerpkaart en pitch</td><td style="width:48%; color:#3D4756">Waar hoort de mens, jouw app in vijf vakken, pitch</td></tr><tr><td style="width:22%; color:#3D4756">2:05 - 2:15</td><td style="width:30%; color:#3D4756">Vier omgevingen</td><td style="width:48%; color:#3D4756">Dezelfde agent in Dify, Copilot, ChatGPT en Gemini</td></tr><tr><td style="width:22%; color:#3D4756">2:15 - 2:30</td><td style="width:30%; color:#3D4756">Afsluiting</td><td style="width:48%; color:#3D4756">Wat mag, wat mee naar huis, exit ticket</td></tr></table>
+<h2 style="font-family:'Rubik', Arial, sans-serif; font-size:64px; font-weight:600; line-height:1.1">Tweeënhalf uur, twee bouwblokken</h2><table style="font-size:25px; color:#3D4756; border:1px solid #D8D2C4; background:#FFFFFF"><tr style="background:#EFEAE0"><th style="width:22%; color:#1E2A3A">Tijd</th><th style="width:30%; color:#1E2A3A">Blok</th><th style="width:48%; color:#1E2A3A">Wat je doet</th></tr><tr><td style="width:22%; color:#3D4756">0:00 - 0:20</td><td style="width:30%; color:#3D4756">Het landschap</td><td style="width:48%; color:#3D4756">Peiling, drie lagen, wat een agent wel en niet is, vijf patronen</td></tr><tr><td style="width:22%; color:#3D4756">0:20 - 0:50</td><td style="width:30%; color:#3D4756">Bouwblok 1: workflow</td><td style="width:48%; color:#3D4756">Tekst op niveau, in duo's, eigen niveaus</td></tr><tr><td style="width:22%; color:#3D4756">0:50 - 1:00</td><td style="width:30%; color:#3D4756">Demo en sabotage</td><td style="width:48%; color:#3D4756">Agent met kennisbank; laat hem struikelen</td></tr><tr><td style="width:22%; color:#3D4756">1:00 - 1:15</td><td style="width:30%; color:#3D4756">Pauze</td><td style="width:48%; color:#3D4756"></td></tr><tr><td style="width:22%; color:#3D4756">1:15 - 1:45</td><td style="width:30%; color:#3D4756">Bouwblok 2: kies je spoor</td><td style="width:48%; color:#3D4756">A kennisbank-agent · B poortwachter</td></tr><tr><td style="width:22%; color:#3D4756">1:45 - 2:05</td><td style="width:30%; color:#3D4756">Ontwerpkaart en pitch</td><td style="width:48%; color:#3D4756">Waar hoort de mens, jouw app in vijf vakken, pitch</td></tr><tr><td style="width:22%; color:#3D4756">2:05 - 2:15</td><td style="width:30%; color:#3D4756">Vier omgevingen</td><td style="width:48%; color:#3D4756">Dezelfde agent in Dify, Copilot, ChatGPT en Gemini</td></tr><tr><td style="width:22%; color:#3D4756">2:15 - 2:30</td><td style="width:30%; color:#3D4756">Afsluiting</td><td style="width:48%; color:#3D4756">Wat mag, wat mee naar huis, exit ticket</td></tr></table>
 <p style="position:absolute; left:128px; bottom:64px; font-size:24px; color:#8A8F98">Workshop AI Agents met Dify · LeX Consultancy · AI Netwerk Limburg · CC BY-SA 4.0</p><img src="../beelden/logo-lex.png" alt="LeX Consultancy" style="position:absolute; right:128px; bottom:52px; width:90px; height:52px; object-fit:contain">
 <aside>Strak op tijd. Bouwblokken zijn heilig; als de demo uitloopt, kort de demo in, niet het bouwen. Op het festival zit de wisseltijd tussen bouwblok 1 en 2, en 15:30 is hard.</aside>
 </section>

00-presentatie/project/slides/watiseenagent.html

@@ -0,0 +1,13 @@
+<section id="watiseenagent" data-transition="fade" style="background:#F7F4EC; color:#1E2A3A; font-family:'Nunito Sans', Verdana, sans-serif; padding:128px 128px 160px; display:flex; flex-direction:column; gap:40px">
+<h2 style="font-family:'Rubik', Arial, sans-serif; font-size:64px; font-weight:600; line-height:1.1">Wat is een agent?</h2>
+<p style="font-size:32px; color:#3D4756; line-height:1.4"><b>Een agent krijgt een doel en bepaalt zelf welke stappen hij zet</b>, met de middelen die jij hem geeft. Een chatbot wacht op je volgende vraag; een agent werkt een opdracht af.</p>
+<div style="display:flex; gap:32px">
+<div style="flex:1; display:flex; flex-direction:column; gap:16px; background:#FFFFFF; padding:36px; border:1px solid #D8D2C4; border-radius:16px"><h3 style="font-family:'Rubik', Arial, sans-serif; font-size:34px; font-weight:600; color:#1E2A3A; line-height:1.2">1 · Een doel en regels</h3><p style="font-size:27px; color:#3D4756; line-height:1.4">Wie ben je, wat doe je, en wat doe je nooit. Dat is de instructie die je vandaag schrijft.</p></div>
+<div style="flex:1; display:flex; flex-direction:column; gap:16px; background:#FFFFFF; padding:36px; border:1px solid #D8D2C4; border-radius:16px"><h3 style="font-family:'Rubik', Arial, sans-serif; font-size:34px; font-weight:600; color:#1E2A3A; line-height:1.2">2 · Middelen</h3><p style="font-size:27px; color:#3D4756; line-height:1.4">Kennis uit jouw documenten, gereedschap om te zoeken, te rekenen of een bestand te maken, en geheugen van het gesprek.</p></div>
+<div style="flex:1; display:flex; flex-direction:column; gap:16px; background:#FFFFFF; padding:36px; border:1px solid #D8D2C4; border-radius:16px"><h3 style="font-family:'Rubik', Arial, sans-serif; font-size:34px; font-weight:600; color:#1E2A3A; line-height:1.2">3 · Ruimte om te kiezen</h3><p style="font-size:27px; color:#3D4756; line-height:1.4">Hij bepaalt de volgorde, kijkt na elke stap wat eruit kwam, en probeert het opnieuw als het misgaat.</p></div>
+</div>
+<p style="font-size:28px; color:#3D4756; line-height:1.4">De Toetsweekplanner kreeg één opdracht: maak een studieplan. Niemand zei 'schrijf een programma'. Hij schreef er zelf een, voerde het uit, en gaf het Excel-bestand terug.</p>
+
+<p style="position:absolute; left:128px; bottom:64px; font-size:24px; color:#8A8F98">Workshop AI Agents met Dify · LeX Consultancy · AI Netwerk Limburg · CC BY-SA 4.0</p><img src="../beelden/logo-lex.png" alt="LeX Consultancy" style="position:absolute; right:128px; bottom:52px; width:90px; height:52px; object-fit:contain">
+<aside>Dit is de dia waar de hele middag op rust. Zeg de eerste zin langzaam. Het voorbeeld van de Toetsweekplanner is het verschil met een workflow: jij vroeg om een plan, niet om een programma. Nog niet over patronen beginnen, dat is de volgende dia.</aside>
+</section>