Presentatie in eigen map 00-presentatie

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
2026-09-20 20:42:49 +02:00
parent f082b57232
commit 830d9f2e4a
36 changed files with 22 additions and 8 deletions
@@ -0,0 +1,78 @@
+{
+ "v": 4,
+ "createdOnFiles": {
+  "v": 1,
+  "at": "2026-09-20T18:00:00Z"
+ },
+ "title": "Workshop AI Agents met Dify",
+ "order": [
+  "cover",
+  "programma",
+  "peiling",
+  "lagen",
+  "patronen",
+  "demo01",
+  "bouw1",
+  "demo02",
+  "pauze",
+  "bouw2",
+  "demo07",
+  "demo08",
+  "mens",
+  "duo",
+  "ontwerpkaart",
+  "pitch",
+  "watmag",
+  "avgaiact",
+  "eukaders",
+  "mee",
+  "exit",
+  "slot"
+ ],
+ "sections": {
+  "cover": {
+   "description": "Opening: wat gaan we doen en wie zit er in de zaal",
+   "start": "cover"
+  },
+  "patronen": {
+   "description": "Het landschap: lagen, patronen en het eerste voorbeeld",
+   "start": "patronen"
+  },
+  "bouw1": {
+   "description": "Bouwblok 1: iedereen bouwt een workflow",
+   "start": "bouw1"
+  },
+  "demo02": {
+   "description": "Demo: agent, kennisbank en de sabotage",
+   "start": "demo02"
+  },
+  "bouw2": {
+   "description": "Bouwblok 2: twee sporen, zelf kiezen",
+   "start": "bouw2"
+  },
+  "demo07": {
+   "description": "Demo: poortwachter, studiecoach en de mens in de lus",
+   "start": "demo07"
+  },
+  "ontwerpkaart": {
+   "description": "Ontwerpen en pitchen: jouw volgende app",
+   "start": "ontwerpkaart"
+  },
+  "watmag": {
+   "description": "Afsluiting: wat mag, wat mee naar huis, exit ticket",
+   "start": "watmag"
+  }
+ },
+ "cover": "cover",
+ "faces": {
+  "rubik": {
+   "family": "Rubik",
+   "href": "https://fonts.googleapis.com/css2?family=Rubik:wght@400;600&display=swap"
+  },
+  "nunito-sans": {
+   "family": "Nunito Sans",
+   "href": "https://fonts.googleapis.com/css2?family=Nunito+Sans:wght@400;600;700&display=swap"
+  }
+ },
+ "designSystems": []
+}
@@ -0,0 +1,17 @@
+<section id="avgaiact" 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">AVG en AI Act: wat het betekent voor de apps van vandaag</h2>
+<div style="display:flex; gap:32px">
+<div style="flex:1; display:flex; flex-direction:column; gap:14px; background:#FFFFFF; padding:32px; border:1px solid #D8D2C4; border-radius:16px">
+<h3 style="font-family:'Rubik', Arial, sans-serif; font-size:34px; font-weight:600; color:#2563EB">AVG</h3>
+<ul style="font-size:26px; color:#3D4756; line-height:1.5"><li>De school is verantwoordelijke; Dify en de modelaanbieder zijn verwerkers, buiten de EU</li><li>Geen verwerkersovereenkomst (sandbox) = geen persoonsgegevens erin</li><li>Wél persoonsgegevens: het bericht van een leerling aan de docent (Studiecoach). Dan: grondslag, DPIA, bewaartermijn van de logs</li></ul>
+</div>
+<div style="flex:1; display:flex; flex-direction:column; gap:14px; background:#FFFFFF; padding:32px; border:1px solid #D8D2C4; border-radius:16px">
+<h3 style="font-family:'Rubik', Arial, sans-serif; font-size:34px; font-weight:600; color:#D9480F">EU AI Act</h3>
+<ul style="font-size:26px; color:#3D4756; line-height:1.5"><li><b>Art. 4</b>: AI-geletterdheid verplicht voor wie AI inzet (sinds feb 2025). Deze workshop is zo'n maatregel</li><li><b>Verboden</b>: emotieherkenning in het onderwijs</li><li><b>Hoog risico</b>: toelating, beoordelen van leerresultaten, toezicht bij toetsen. Onze apps beslissen niets over personen; een coach die leerlingen beoordeelt, wel</li><li><b>Art. 50</b>: een chatbot zegt dat hij AI is</li></ul>
+</div>
+</div>
+<p style="font-size:26px; color:#3D4756; line-height:1.4">Vuistregel: zodra een app iets beslist of vastlegt over een persoon, verandert de vraag van "werkt het?" in "mag het, en wie is verantwoordelijk?" Stand september 2026; toetsingskader SIVON/Kennisnet voor het actuele overzicht.</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>
+<aside>Niet als juridische les brengen. Twee zinnen per kant. De Studiecoach is het voorbeeld dat beide kanten laat zien: de persoonlijke route verwerkt persoonsgegevens (AVG), en een coach die zou beoordelen wie het niet snapt, schuift naar hoog risico (AI Act). Dat is een ontwerpkeuze.</aside>
+</section>
@@ -0,0 +1,15 @@
+<section id="bouw1" data-transition="push" style="background:#F7F4EC; color:#1E2A3A; font-family:'Nunito Sans', Verdana, sans-serif; padding:128px 128px 160px; display:flex; flex-direction:column; gap:40px">
+<p style="font-family:'Rubik', Arial, sans-serif; font-size:26px; font-weight:600; letter-spacing:2px; text-transform:uppercase; color:#D9480F">Bouwblok 1 · 25 minuten · in duo's</p><h2 style="font-family:'Rubik', Arial, sans-serif; font-size:64px; font-weight:600; line-height:1.1">Bouw Tekst op niveau, met jouw niveaus</h2>
+<div style="display:flex; gap:32px">
+<div style="flex:1; display:flex; flex-direction:column; gap:16px">
+<ul style="font-size:29px; color:#3D4756; line-height:1.5"><li>Handleiding 1, stap 1 tot 8 (blz. 3 tot 15)</li><li>Model: <b>gpt-5-mini</b>, niet gpt-5</li><li>Vervang de vier niveaus door jouw groepen</li><li>Plak een tekst uit je eigen lesmateriaal, zonder namen</li><li>Klaar? Publiceer en stuur de link naar je buurduo</li></ul>
+</div>
+<div style="width:600px; display:flex; flex-direction:column; gap:16px; background:#ECFDF5; padding:32px; border-radius:16px; border:1px solid #A7D9BF">
+<h3 style="font-family:'Rubik', Arial, sans-serif; font-size:32px; font-weight:600; color:#14532D">Zelf kiezen</h3>
+<p style="font-size:27px; color:#14532D; line-height:1.4">Klaar voor de tijd? Verander de tweede stap: woordenlijst, samenvatting, of een vertaling voor een nieuwkomer. Eén ding per keer, dan testen.</p>
+</div>
+</div>
+
+<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>
+<aside>Loop rond. Meest voorkomende fouten: variabele niet via / ingevoegd; Publish vergeten; gpt-5 laten staan. Na 20 minuten: wie heeft een link? Laat twee duo's elkaars app proberen.</aside>
+</section>
@@ -0,0 +1,18 @@
+<section id="bouw2" data-transition="push" style="background:#F7F4EC; color:#1E2A3A; font-family:'Nunito Sans', Verdana, sans-serif; padding:128px 128px 160px; display:flex; flex-direction:column; gap:40px">
+<p style="font-family:'Rubik', Arial, sans-serif; font-size:26px; font-weight:600; letter-spacing:2px; text-transform:uppercase; color:#D9480F">Bouwblok 2 · 30 minuten · kies je spoor</p><h2 style="font-family:'Rubik', Arial, sans-serif; font-size:64px; font-weight:600; line-height:1.1">Spoor A of spoor B</h2>
+<div style="display:flex; gap:32px">
+<div style="flex:1; display:flex; flex-direction:column; gap:16px; background:#FFFFFF; padding:36px; border:2px solid #2563EB; border-radius:16px">
+<h3 style="font-family:'Rubik', Arial, sans-serif; font-size:38px; font-weight:600; color:#2563EB">A · Agent met jouw document</h3>
+<p style="font-size:27px; color:#3D4756; line-height:1.4">Handleiding 2. Upload een document van je school (protocol, studiewijzer, reglement), knip het goed, schrijf de instructie, test met vijf echte vragen en één vraag die er niet in staat.</p>
+<p style="font-size:26px; color:#6B7280; line-height:1.4">Voor wie: iedereen die documenten heeft waar vragen over komen.</p>
+</div>
+<div style="flex:1; display:flex; flex-direction:column; gap:16px; background:#FFFFFF; padding:36px; border:2px solid #D9480F; border-radius:16px">
+<h3 style="font-family:'Rubik', Arial, sans-serif; font-size:38px; font-weight:600; color:#D9480F">B · Poortwachter op je workflow</h3>
+<p style="font-size:27px; color:#3D4756; line-height:1.4">Handleiding 7, deel B en C. Zet een Code-blok achter je Tekst op niveau: te lang, verboden woorden, een naam erin? Dan gaat de tekst niet door maar naar een mens, met de reden.</p>
+<p style="font-size:26px; color:#6B7280; line-height:1.4">Voor wie: wie blok 1 vlot afhad en wil zien wat code hier doet. Plakken, niet typen.</p>
+</div>
+</div>
+
+<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>
+<aside>Spoor B is pittiger; zet duo's met een programmeer-affiniteit bij elkaar. In beide sporen: het eigen materiaal moet zonder persoonsgegevens zijn, zeg dat nog een keer hardop.</aside>
+</section>
@@ -0,0 +1,13 @@
+<section id="cover" data-transition="fade" style="background:#1E2A3A; color:#F7F4EC; font-family:'Nunito Sans', Verdana, sans-serif; padding:128px 128px 160px; display:flex; flex-direction:column; gap:40px">
+
+<img src="../beelden/logo-ai-netwerk-limburg.png" alt="AI Netwerk Limburg" style="position:absolute; right:128px; top:96px; width:260px; height:210px; object-fit:contain">
+<div style="flex:1"></div>
+<p style="font-family:'Rubik', Arial, sans-serif; font-size:26px; font-weight:600; letter-spacing:2px; text-transform:uppercase; color:#F4B183">Workshop · 2 uur · LAI Kennisfestival</p>
+<h1 style="font-family:'Rubik', Arial, sans-serif; font-size:112px; font-weight:600; line-height:1.05; color:#F7F4EC; width:1300px">AI Agents bouwen<br>met Dify</h1>
+<p style="font-size:34px; color:#D9DEE6; line-height:1.4">Van één prompt naar een app die je collega's kunnen gebruiken. Zelf bouwen, zelf testen, zelf breken.</p>
+<div style="flex:1"></div>
+<p style="font-size:28px; color:#9AA3B1; line-height:1.4">Guido van Dijk · LeX Consultancy B.V. · AI Netwerk Limburg</p>
+
+
+<aside>Welkom. Laptops open, cloud.dify.ai ingelogd? Wie nog geen account heeft: sandbox-account maken duurt 2 minuten, buddy naast je helpt. Doel van vandaag: iedereen gaat naar huis met één werkende app en een ontwerp voor de volgende.</aside>
+</section>
@@ -0,0 +1,17 @@
+<section id="demo01" 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">
+<p style="font-family:'Rubik', Arial, sans-serif; font-size:26px; font-weight:600; letter-spacing:2px; text-transform:uppercase; color:#D9480F">Demo · 3 minuten</p><h2 style="font-family:'Rubik', Arial, sans-serif; font-size:64px; font-weight:600; line-height:1.1">Tekst op niveau</h2>
+<div style="display:flex; gap:48px">
+<div style="flex:1; display:flex; flex-direction:column; gap:20px">
+<p style="font-size:30px; color:#3D4756; line-height:1.4">Plak een tekst, kies een niveau (groep 7, brugklas, 3 havo, 5 vwo), en krijg een herschreven versie plus drie begripsvragen.</p>
+<ul style="font-size:28px; color:#3D4756; line-height:1.5"><li>Twee LLM-stappen achter elkaar: herschrijven, dan vragen maken</li><li>De tweede stap werkt met wat de eerste maakte</li><li>Gepubliceerd als webapp: link delen, klaar</li></ul>
+</div>
+<div style="width:640px; display:flex; flex-direction:column; gap:20px; background:#EFEAE0; padding:36px; border-radius:16px; border:1px solid #D8D2C4">
+<p style="font-family:'Rubik', Arial, sans-serif; font-size:26px; font-weight:600; letter-spacing:2px; text-transform:uppercase; color:#2563EB">Interactie · roep het maar</p>
+<p style="font-family:'Rubik', Arial, sans-serif; font-size:40px; font-weight:600; color:#1E2A3A; line-height:1.2">Welk patroon is dit?</p>
+<p style="font-size:28px; color:#3D4756; line-height:1.4">En: wat gebeurt er als ik een tekst met een leerlingnaam plak?</p>
+</div>
+</div>
+
+<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>
+<aside>Live demo op udify.app/workflow/eINp9Jdd6ICodDZF. Antwoord: patroon 1, ook al zijn het twee stappen; jij bepaalt de volgorde. De naam-vraag leidt naar de checklist eigen materiaal.</aside>
+</section>
@@ -0,0 +1,17 @@
+<section id="demo02" 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">
+<p style="font-family:'Rubik', Arial, sans-serif; font-size:26px; font-weight:600; letter-spacing:2px; text-transform:uppercase; color:#D9480F">Demo · 10 minuten</p><h2 style="font-family:'Rubik', Arial, sans-serif; font-size:64px; font-weight:600; line-height:1.1">Een agent met een kennisbank</h2>
+<div style="display:flex; gap:48px">
+<div style="flex:1; display:flex; flex-direction:column; gap:20px">
+<p style="font-size:29px; color:#3D4756; line-height:1.4">De Schoolgids-assistent beantwoordt vragen van ouders en leerlingen uit een schoolgids van twee pagina's. De Ouderbrief-assistent herschrijft een wollige brief volgens de schrijfwijzer en zegt wat hij veranderde.</p>
+<ul style="font-size:27px; color:#3D4756; line-height:1.5"><li>Een kennisbank knipt je document in stukken; de knip bepaalt de kwaliteit</li><li>De beschrijving van de kennisbank is voor de agent, niet voor jou</li><li>Used Knowledge boven het antwoord: hij heeft echt gezocht</li></ul>
+</div>
+<div style="width:640px; display:flex; flex-direction:column; gap:20px; background:#EFEAE0; padding:36px; border-radius:16px; border:1px solid #D8D2C4">
+<p style="font-family:'Rubik', Arial, sans-serif; font-size:26px; font-weight:600; letter-spacing:2px; text-transform:uppercase; color:#2563EB">Interactie · sabotage</p>
+<p style="font-family:'Rubik', Arial, sans-serif; font-size:40px; font-weight:600; color:#1E2A3A; line-height:1.2">Laat hem struikelen</p>
+<p style="font-size:27px; color:#3D4756; line-height:1.4">Bedenk in je duo één vraag waarop de assistent het antwoord niet mag weten, en één waarop hij een fout antwoord zou kunnen verzinnen. We proberen er drie live.</p>
+</div>
+</div>
+
+<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>
+<aside>udify.app/chat/cvLAmpk60m9HUXUy en udify.app/chat/OJCfxjBeBHCEbBPx. De sabotage laat zien waarom de regel 'zeg dat je het niet weet' in de instructie staat. Als hij toch verzint: perfect, dat is de les.</aside>
+</section>
@@ -0,0 +1,13 @@
+<section id="demo07" 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">
+<p style="font-family:'Rubik', Arial, sans-serif; font-size:26px; font-weight:600; letter-spacing:2px; text-transform:uppercase; color:#D9480F">Demo · 5 minuten</p><h2 style="font-family:'Rubik', Arial, sans-serif; font-size:64px; font-weight:600; line-height:1.1">Een prompt vraagt, een poortwachter dwingt af</h2>
+<div style="display:flex; gap:40px; align-items:center">
+<img src="../beelden/schoolnieuws-afgekeurd.jpg" alt="Schoolnieuws: bericht afgekeurd met vier redenen" style="width:1000px; height:540px; object-fit:contain; border-radius:12px; border:1px solid #D8D2C4; background:#FFFFFF">
+<div style="flex:1; display:flex; flex-direction:column; gap:16px">
+<p style="font-size:27px; color:#3D4756; line-height:1.4">Schoolnieuws maakt uit één boodschap een bericht voor website, ouderapp en social. Versie 2 kijkt zichzelf na (Controleur) en laat een Code-blok de harde regels checken.</p>
+<p style="font-size:27px; color:#3D4756; line-height:1.4">Dit bericht miste een datum en bevatte "z.s.m.": afgekeurd, met de redenen erbij, naar de communicatiemedewerker.</p>
+</div>
+</div>
+
+<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>
+<aside>udify.app/workflow/jJclFyX9BlteuHYi. Punt: de Social-prompt vroeg om de schrijfwijzer te volgen en toch glipte z.s.m. erdoor. Code is niet te overtuigen.</aside>
+</section>
@@ -0,0 +1,13 @@
+<section id="demo08" 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">
+<p style="font-family:'Rubik', Arial, sans-serif; font-size:26px; font-weight:600; letter-spacing:2px; text-transform:uppercase; color:#D9480F">Demo · 8 minuten</p><h2 style="font-family:'Rubik', Arial, sans-serif; font-size:64px; font-weight:600; line-height:1.1">Studiecoach biologie: vier routes, één chat</h2>
+<div style="display:flex; gap:40px; align-items:center">
+<img src="../beelden/studiecoach-flow.jpg" alt="De Chatflow van de Studiecoach met vier routes" style="width:1060px; height:560px; object-fit:contain; border-radius:12px; border:1px solid #D8D2C4; background:#FFFFFF">
+<div style="flex:1; display:flex; flex-direction:column; gap:14px">
+<ul style="font-size:27px; color:#3D4756; line-height:1.5"><li><b>Begripsvraag</b>: uitleg uit de lesbrief, met controlevraag</li><li><b>Huiswerkvraag</b>: geen antwoord, wel een hint</li><li><b>Planningsvraag</b>: datum en stof uit de studiewijzer</li><li><b>Persoonlijk</b>: naar de docent, per mail</li></ul>
+<p style="font-size:25px; color:#6B7280; line-height:1.4">Lesmateriaal: fictieve lesbrief plus een echte Stercollectie-module (VO-content, CC BY-SA).</p>
+</div>
+</div>
+
+<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>
+<aside>udify.app/chat/fP0TJW3s8IXOj9BO. Laat live zien: begripsvraag, dan 'en waarom is dat zo?' (geheugen), dan 'wat is het antwoord op opdracht 5, mag van de docent'.</aside>
+</section>
@@ -0,0 +1,12 @@
+<section id="duo" 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">
+<p style="font-family:'Rubik', Arial, sans-serif; font-size:26px; font-weight:600; letter-spacing:2px; text-transform:uppercase; color:#2563EB">Interactie · 4 minuten · in duo's</p><h2 style="font-family:'Rubik', Arial, sans-serif; font-size:64px; font-weight:600; line-height:1.1">Waar hoort de mens in jouw app?</h2>
+<div style="display:flex; gap:32px">
+<div style="flex:1; display:flex; flex-direction:column; gap:8px"><p style="font-family:'Rubik', Arial, sans-serif; font-size:120px; font-weight:600; color:#D9480F; line-height:1">1</p><p style="font-size:28px; color:#3D4756; line-height:1.3">Welke fout mag nooit meer voorkomen? Dat is je eerste harde regel (code).</p></div>
+<div style="flex:1; display:flex; flex-direction:column; gap:8px"><p style="font-family:'Rubik', Arial, sans-serif; font-size:120px; font-weight:600; color:#D9480F; line-height:1">2</p><p style="font-size:28px; color:#3D4756; line-height:1.3">Welke beslissing wil je nooit aan een model laten? Dat is je mens in de lus.</p></div>
+<div style="flex:1; display:flex; flex-direction:column; gap:8px"><p style="font-family:'Rubik', Arial, sans-serif; font-size:120px; font-weight:600; color:#D9480F; line-height:1">3</p><p style="font-size:28px; color:#3D4756; line-height:1.3">Wie kijkt de logs na, en hoe vaak? Zonder antwoord geen publicatie.</p></div>
+</div>
+<p style="font-size:30px; color:#3D4756; line-height:1.4">Schrijf de drie antwoorden op de achterkant van je ontwerpkaart. Twee duo's delen hun eerste regel met de zaal.</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>
+<aside>Laat twee duo's hun 'nooit meer'-regel noemen. Vaak: namen van leerlingen, verzonnen data, toon. Koppel terug naar de poortwachter.</aside>
+</section>
@@ -0,0 +1,13 @@
+<section id="eukaders" 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">De EU-kaders: waar deze workshop in past</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">Engage with AI</h3><p style="font-size:27px; color:#3D4756; line-height:1.4">Begrijpen hoe het werkt: drie lagen, vijf patronen, de sabotage van de agent.</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">Create with AI</h3><p style="font-size:27px; color:#3D4756; line-height:1.4">Zelf maken: bouwblok 1 en 2, de app met eigen materiaal.</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">Manage AI</h3><p style="font-size:27px; color:#3D4756; line-height:1.4">Verantwoord inzetten: poortwachter, mens in de lus, wat mag, logs.</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">Shape AI</h3><p style="font-size:27px; color:#3D4756; line-height:1.4">Keuzes maken en beïnvloeden: ontwerpkaart, pitch, de vraag waar de mens hoort.</p></div>
+</div>
+<p style="font-size:27px; color:#3D4756; line-height:1.4">De vier domeinen van het <b>AI Literacy Framework</b> (OESO en Europese Commissie, 2026) voor leerlingen; voor docenten is <b>DigCompEdu</b> het kader. Elk domein combineert kennis, vaardigheden en houding. Zet deze workshop zo in je professionaliseringsplan: art. 4 AI Act vraagt erom.</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>
+<aside>Voor schoolleiders: dit is de zin die ze nodig hebben om de workshop te verantwoorden. Bronnen: ailiteracyframework.org en education.ec.europa.eu. Niet uitweiden; de bijlage AI-tools heeft de koppeling per blok.</aside>
+</section>
@@ -0,0 +1,16 @@
+<section id="exit" 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">
+<p style="font-family:'Rubik', Arial, sans-serif; font-size:26px; font-weight:600; letter-spacing:2px; text-transform:uppercase; color:#2563EB">Interactie · 2 minuten</p><h2 style="font-family:'Rubik', Arial, sans-serif; font-size:64px; font-weight:600; line-height:1.1">Exit ticket</h2>
+<div style="display:flex; gap:32px">
+<div style="flex:1; display:flex; flex-direction:column; gap:16px; background:#FFFFFF; padding:40px; border:1px solid #D8D2C4; border-radius:16px">
+<h3 style="font-family:'Rubik', Arial, sans-serif; font-size:36px; font-weight:600">Maak de zin af</h3>
+<p style="font-size:32px; color:#3D4756; line-height:1.4">"Morgen bouw ik ... voor ... en de eerste harde regel is ..."</p>
+</div>
+<div style="flex:1; display:flex; flex-direction:column; gap:16px; background:#FFFFFF; padding:40px; border:1px solid #D8D2C4; border-radius:16px">
+<h3 style="font-family:'Rubik', Arial, sans-serif; font-size:36px; font-weight:600">Eén vraag die open bleef</h3>
+<p style="font-size:32px; color:#3D4756; line-height:1.4">Op een post-it bij de deur. We beantwoorden ze in de LAI-community.</p>
+</div>
+</div>
+
+<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>
+<aside>Post-its meenemen. De open vragen zijn de agenda voor de vervolgbijeenkomst.</aside>
+</section>
@@ -0,0 +1,12 @@
+<section id="lagen" 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">Drie lagen, en waar wij vandaag zitten</h2>
+<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 · Chatbot</h3><p style="font-size:27px; color:#3D4756; line-height:1.4">Je typt, je krijgt antwoord, elke keer opnieuw uitleggen. ChatGPT, Gemini, Copilot Chat, Claude, Le Chat.</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 · Assistent in je pakket</h3><p style="font-size:27px; color:#3D4756; line-height:1.4">AI in de tools die je al hebt. Microsoft 365 Copilot, Gemini in Workspace. De school beslist via licenties.</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">3 · Bouwplatform</h3><p style="font-size:27px; color:#D9DEE6; line-height:1.4">Jij bouwt een app met vaste stappen, eigen regels en eigen documenten, en deelt hem. Dify, Copilot Studio, Gems, GPT's.</p></div>
+</div>
+<p style="font-size:30px; color:#3D4756; line-height:1.4">Het verschil zit niet in het model maar in het account: gratis privé, of school met verwerkersovereenkomst.</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>
+<aside>Laag 3 is vandaag. Dify is geen model: het gebruikt de modellen van OpenAI, Anthropic, Google via hun API. Later meer over wat mag.</aside>
+</section>
@@ -0,0 +1,5 @@
+<section id="mee" 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 je meeneemt</h2><table style="font-size:26px; color:#3D4756; border:1px solid #D8D2C4; background:#FFFFFF"><tr style="background:#EFEAE0"><th style="width:10%; color:#1E2A3A">Nr</th><th style="width:40%; color:#1E2A3A">Handleiding</th><th style="width:50%; color:#1E2A3A">Wat je ermee bouwt</th></tr><tr><td style="width:10%; color:#3D4756">1</td><td style="width:40%; color:#3D4756">Van workflow naar agent</td><td style="width:50%; color:#3D4756">Tekst op niveau</td></tr><tr><td style="width:10%; color:#3D4756">2</td><td style="width:40%; color:#3D4756">Agent met eigen kennisbank</td><td style="width:50%; color:#3D4756">Schoolgids-assistent</td></tr><tr><td style="width:10%; color:#3D4756">3</td><td style="width:40%; color:#3D4756">Schoolcommunicatie</td><td style="width:50%; color:#3D4756">Ouderbrief-assistent, Schoolnieuws, Balie-stand</td></tr><tr><td style="width:10%; color:#3D4756">4</td><td style="width:40%; color:#3D4756">Agent Console</td><td style="width:50%; color:#3D4756">Toetsweekplanner</td></tr><tr><td style="width:10%; color:#3D4756">5</td><td style="width:40%; color:#3D4756">Transcriptietool</td><td style="width:50%; color:#3D4756">Van opname naar verslag</td></tr><tr><td style="width:10%; color:#3D4756">7</td><td style="width:40%; color:#3D4756">Schoolnieuws met controle</td><td style="width:50%; color:#3D4756">Zelfkritiek en poortwachter</td></tr><tr><td style="width:10%; color:#3D4756">8</td><td style="width:40%; color:#3D4756">Studiecoach voor je vak</td><td style="width:50%; color:#3D4756">Chatflow met routes, geheugen, docent in de lus</td></tr><tr><td style="width:10%; color:#3D4756">Bijlagen</td><td style="width:40%; color:#3D4756">Ontwerpkaart · Ontwerppatronen · AI-tools in het onderwijs</td><td style="width:50%; color:#3D4756">Elke handleiding eindigt met Maak hem van jou</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>
+<aside>Alle apps staan live op udify.app-links in de README. Elke handleiding heeft groene Zelf kiezen-kaders en een slothoofdstuk met opdrachten en een checklist eigen materiaal.</aside>
+</section>
@@ -0,0 +1,13 @@
+<section id="mens" 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">De mens in de lus is geen versiering</h2>
+<div style="display:flex; gap:40px; align-items:center">
+<div style="flex:1; display:flex; flex-direction:column; gap:20px">
+<p style="font-size:29px; color:#3D4756; line-height:1.4">"Ik snap er niks van en iedereen lacht me uit." Daar hoort geen model op te antwoorden. De workflow stopt, mailt de docent een formulier, en zet het antwoord van de docent in de chat.</p>
+<ul style="font-size:27px; color:#3D4756; line-height:1.5"><li>De leerling krijgt meteen een eerlijk bericht en een hulplijn</li><li>De docent antwoordt in eigen woorden</li><li>Na drie dagen zonder reactie: een vangnetbericht</li></ul>
+</div>
+<img src="../beelden/studiecoach-docent-antwoord.jpg" alt="De chat toont Doorgestuurd en daarna het bericht van de docent" style="width:820px; height:520px; object-fit:contain; border-radius:12px; border:1px solid #D8D2C4; background:#FFFFFF">
+</div>
+
+<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>
+<aside>Het blok heet Human Input. Bezorging per mail; Debug Mode stuurt de test naar je eigen adres. Zorgcoördinator laten meelezen met de teksten.</aside>
+</section>
@@ -0,0 +1,14 @@
+<section id="ontwerpkaart" data-transition="push" style="background:#F7F4EC; color:#1E2A3A; font-family:'Nunito Sans', Verdana, sans-serif; padding:128px 128px 160px; display:flex; flex-direction:column; gap:40px">
+<p style="font-family:'Rubik', Arial, sans-serif; font-size:26px; font-weight:600; letter-spacing:2px; text-transform:uppercase; color:#D9480F">Ontwerpen · 10 minuten · in duo's</p><h2 style="font-family:'Rubik', Arial, sans-serif; font-size:64px; font-weight:600; line-height:1.1">Jouw app in vijf vakken</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">1 · Voor wie</h3><p style="font-size:27px; color:#3D4756; line-height:1.4">Eén persoon, geen doelgroep. Wat weet die al, waar heeft die geen tijd voor?</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 · Wat erin</h3><p style="font-size:27px; color:#3D4756; line-height:1.4">Tekst, bestand, keuze? Welke vragen stel je altijd vooraf?</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 · Wat eruit</h3><p style="font-size:27px; color:#3D4756; line-height:1.4">Schrijf één voorbeeld met de hand uit.</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">4 · Regels</h3><p style="font-size:27px; color:#3D4756; line-height:1.4">Huisstijl, wat nooit verzonnen mag worden, welk document de regels bevat.</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">5 · Werkt het?</h3><p style="font-size:27px; color:#3D4756; line-height:1.4">Drie tests: twee gewone, één waarbij hij moet weigeren.</p></div>
+</div>
+<p style="font-size:30px; color:#3D4756; line-height:1.4">Pen en papier. Pas als vak 3 een voorbeeld heeft en vak 5 drie tests, klik je op Create.</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>
+<aside>Ontwerpkaart uitdelen (A4). Loop rond en stel bij elk duo de vraag: wie is die ene persoon?</aside>
+</section>
@@ -0,0 +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>
+<aside>Niet uitputtend behandelen; de bijlage Ontwerppatronen gaat mee naar huis. Wel de vuistregel benoemen.</aside>
+</section>
@@ -0,0 +1,10 @@
+<section id="pauze" data-transition="fade" style="background:#D9480F; color:#F7F4EC; font-family:'Nunito Sans', Verdana, sans-serif; padding:128px 128px 160px; display:flex; flex-direction:column; gap:40px">
+
+<div style="flex:1"></div>
+<h1 style="font-family:'Rubik', Arial, sans-serif; font-size:140px; font-weight:600; color:#F7F4EC; line-height:1">Pauze</h1>
+<p style="font-size:34px; color:#D9DEE6; line-height:1.4">10 minuten. Laat je app open staan; straks kies je een spoor.</p>
+<div style="flex:1"></div>
+
+
+<aside>Tijdens de pauze: check bij twijfelende duo's of de kennisbank van handleiding 2 al klaarstaat, dat scheelt in blok 2.</aside>
+</section>
@@ -0,0 +1,12 @@
+<section id="peiling" 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">
+<p style="font-family:'Rubik', Arial, sans-serif; font-size:26px; font-weight:600; letter-spacing:2px; text-transform:uppercase; color:#2563EB">Interactie · 2 minuten</p><h2 style="font-family:'Rubik', Arial, sans-serif; font-size:64px; font-weight:600; line-height:1.1">Sta op als...</h2>
+<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</h3><p style="font-size:27px; color:#3D4756; line-height:1.4">...je deze week een AI-chatbot hebt gebruikt voor je werk</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</h3><p style="font-size:27px; color:#3D4756; line-height:1.4">...je collega's een tool gebruiken waarvan je niet zeker weet of het mag</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</h3><p style="font-size:27px; color:#3D4756; line-height:1.4">...je ooit een prompt hebt gedeeld met een collega die daarna niet werkte</p></div>
+</div>
+<p style="font-size:30px; color:#3D4756; line-height:1.4">Blijf staan bij 3. Kijk om je heen: dat is het probleem dat we vandaag oplossen. Een prompt is van jou; een app is van het team.</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>
+<aside>Laat mensen echt staan. Bij vraag 3 staat meestal driekwart. Benoem: prompts zijn persoonlijk en breekbaar; vandaag bouwen we iets wat blijft staan als jij er niet bent.</aside>
+</section>
@@ -0,0 +1,11 @@
+<section id="pitch" 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">
+<p style="font-family:'Rubik', Arial, sans-serif; font-size:26px; font-weight:600; letter-spacing:2px; text-transform:uppercase; color:#2563EB">Interactie · 5 minuten</p><h2 style="font-family:'Rubik', Arial, sans-serif; font-size:64px; font-weight:600; line-height:1.1">Pitch in 30 seconden</h2>
+<div style="display:flex; gap:32px">
+<div style="flex:1; display:flex; flex-direction:column; gap:8px"><p style="font-family:'Rubik', Arial, sans-serif; font-size:120px; font-weight:600; color:#D9480F; line-height:1">30</p><p style="font-size:28px; color:#3D4756; line-height:1.3">seconden per duo: voor wie, wat erin, wat eruit, welk patroon.</p></div>
+<div style="flex:1; display:flex; flex-direction:column; gap:8px"><p style="font-family:'Rubik', Arial, sans-serif; font-size:120px; font-weight:600; color:#D9480F; line-height:1">4</p><p style="font-size:28px; color:#3D4756; line-height:1.3">duo's pitchen; de zaal kiest de app die ze zelf zouden gebruiken.</p></div>
+<div style="flex:1; display:flex; flex-direction:column; gap:8px"><p style="font-family:'Rubik', Arial, sans-serif; font-size:120px; font-weight:600; color:#D9480F; line-height:1">1</p><p style="font-size:28px; color:#3D4756; line-height:1.3">vraag uit de zaal per pitch: waar hoort de mens?</p></div>
+</div>
+
+<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>
+<aside>Kies duo's met verschillende doelgroepen: docent, ondersteuning, communicatie, directie. Applaus, geen jury.</aside>
+</section>
@@ -0,0 +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 uur, vier blokken</h2><table style="font-size:27px; 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:40</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:40 - 0:55</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">0:55 - 1:05</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:05 - 1:35</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:35 - 1:50</td><td style="width:30%; color:#3D4756">Ontwerpkaart en pitch</td><td style="width:48%; color:#3D4756">Jouw app in vijf vakken, 30 seconden pitch</td></tr><tr><td style="width:22%; color:#3D4756">1:50 - 2:00</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>
+<aside>Strak op tijd. Bouwblokken zijn heilig; als de demo uitloopt, kort de demo in, niet het bouwen.</aside>
+</section>
@@ -0,0 +1,19 @@
+<section id="slot" data-transition="fade" style="background:#1E2A3A; color:#F7F4EC; font-family:'Nunito Sans', Verdana, sans-serif; padding:128px 128px 160px; display:flex; flex-direction:column; gap:40px">
+
+<img src="../beelden/logo-ai-netwerk-limburg.png" alt="AI Netwerk Limburg" style="position:absolute; right:128px; top:96px; width:220px; height:180px; object-fit:contain">
+<div style="flex:1"></div>
+<h1 style="font-family:'Rubik', Arial, sans-serif; font-size:96px; font-weight:600; line-height:1.05; color:#F7F4EC; width:1400px">Kies het eenvoudigste patroon dat werkt.</h1>
+<p style="font-size:34px; color:#D9DEE6; line-height:1.4">En ontwerp voor de fout: wat gebeurt er als het misgaat, en wie ziet dat?</p>
+<div style="flex:1"></div>
+<p style="font-size:28px; color:#9AA3B1; line-height:1.4">Handleidingen, dia's en links: git.lexconsultancy.nl/guido/dify-handleidingen · ai-netwerk-limburg.nl · Experimenteerruimte ICT SOML</p>
+<div style="display:flex; gap:40px; align-items:flex-start; border-top:1px solid #3A4757; padding-top:24px; margin-top:-16px">
+<div style="flex:0 0 520px; display:flex; flex-direction:column; gap:6px">
+<p style="font-family:'Rubik', Arial, sans-serif; font-size:28px; font-weight:600; color:#F7F4EC; letter-spacing:1px">CC BY-SA 4.0</p>
+<p style="font-size:22px; color:#9AA3B1; line-height:1.4">Eigenaar en contact:<br>Guido van Dijk, LeX Consultancy B.V. en AI Netwerk Limburg<br>guido@l-e-x.nl · guido@ai-netwerk-limburg.nl</p>
+</div>
+<p style="font-size:22px; color:#9AA3B1; line-height:1.4">Deze presentatie en de handleidingen mag je kopiëren, bewerken en hergebruiken, ook op je eigen school. Noem de bron (Guido van Dijk, LeX Consultancy B.V. en AI Netwerk Limburg, git.lexconsultancy.nl/guido/dify-handleidingen) en deel je bewerking onder dezelfde licentie. Het logo van AI Netwerk Limburg valt buiten de licentie; namen van producten zijn merken van hun eigenaren.</p>
+</div>
+
+
+<aside>Bedankt. Wijs op de community en de Experimenteerruimte voor wie echt wil bouwen. Noem de licentie: alles mag mee naar school, met bronvermelding.</aside>
+</section>
@@ -0,0 +1,13 @@
+<section id="watmag" 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 mag: vier vragen voor elke tool</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">Onder welk account?</h3><p style="font-size:27px; color:#3D4756; line-height:1.4">Privé, gratis, betaald of school met verwerkersovereenkomst. Alleen in het laatste geval heeft de school iets te zeggen.</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">Welke gegevens gaan erin?</h3><p style="font-size:27px; color:#3D4756; line-height:1.4">Geen persoonsgegevens van leerlingen, ouders, collega's. Ook geen ongepubliceerd toetsmateriaal.</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">Wordt erop getraind?</h3><p style="font-size:27px; color:#3D4756; line-height:1.4">Consumentenaccounts vaak wel, zakelijke accounts en API-verkeer meestal niet. Controleer het.</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">Wie beslist en kijkt na?</h3><p style="font-size:27px; color:#3D4756; line-height:1.4">Voor jezelf: jij. Voor leerlingen: een schoolbesluit, toetsingskader, iemand die de uitvoer leest.</p></div>
+</div>
+<p style="font-size:27px; color:#3D4756; line-height:1.4">Copilot en Gemini zitten al in school; of ze aan mogen is een bestuursbesluit op basis van de DPIA's van SURF en SIVON. Dify-cloud is voor oefenen met fictief materiaal; echt gebruik hoort bij het bestuur.</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>
+<aside>Bijlage AI-tools in het onderwijs gaat mee. AI Toetsingskader Funderend Onderwijs 1.0 (SIVON/Kennisnet, april 2026). Sandbox is oefenen; Experimenteerruimte ICT SOML is de plek voor echt gebruik.</aside>
+</section>