Een prompt is de opdracht of vraag die jij aan AI geeft. Hoe duidelijker jouw prompt, hoe beter het antwoord dat ChatGPT geeft.
ChatGPT is als een superschlawe assistent
Stel je voor dat je een assistent vraagt om iets te maken. Als je zegt "maak iets", weet hij niet wat je wilt. Maar als je zegt "maak een quiz over dieren met 5 vragen en 3 antwoorden per vraag, voor kinderen van 10 jaar" — dan kan hij precies aan de slag.
Dat is precies hoe ChatGPT werkt. Jij geeft de opdracht, ChatGPT voert uit.
❌ Slechte prompt
"Maak een quiz."
✅ Goede prompt
"Maak een quiz over ruimtevaart met 5 vragen voor kinderen van 10 jaar, met 3 antwoorden per vraag."
2
Stap 2
Kies een onderwerp voor jullie quiz
Elk groepje kiest een eigen AI-onderwerp
Jullie quiz gaat over AI. Maar AI heeft heel veel onderwerpen. Kies samen één onderwerp waar jullie quiz over gaat. Klik op een onderwerp hieronder om het direct in de prompt in te vullen:
🤖 Wat is AI?
🧠 Hoe leert een computer?
🚗 Zelfrijdende auto's
🎨 AI en kunst
💬 ChatGPT gebruiken
🔒 Veilig met AI
🤝 AI en mensen
🌍 AI in het dagelijks leven
🚀 AI en de toekomst
🎮 AI in games
📸 AI en foto's
🏥 AI in de zorg
✅ Gekozen onderwerp: — de prompt hieronder is automatisch bijgewerkt!
Tip voor het groepje
Kies een onderwerp dat jullie zelf ook interessant vinden. Dan bedenk je de quizvragen makkelijker en wordt het leuker om te spelen.
3
Stap 3
Kopieer deze prompt
Gebruik deze prompt in ChatGPT
Hieronder staat de kant-en-klare prompt. Klik eerst op een onderwerp in stap 2 om het automatisch in te vullen, dan op "Kopieer de prompt" en plak hem in ChatGPT.
Kopieer onderstaande prompt
Maak een complete, interactieve quizpagina in HTML over het onderwerp: [ONDERWERP].
De quiz moet voldoen aan de volgende eisen:
1. De pagina heeft een duidelijke titel met het onderwerp.
2. Er zijn precies 5 quizvragen over [ONDERWERP].
3. Elke vraag heeft 3 antwoordmogelijkheden (A, B en C).
4. Slechts één antwoord is goed. De goede antwoorden wisselen af (niet altijd A).
5. Na het klikken op een antwoord:
- Staat het goede antwoord groen gemarkeerd.
- Staat het foute antwoord rood gemarkeerd.
- Verschijnt er een korte uitleg (1 of 2 zinnen) waarom het goede antwoord goed is.
6. Er is een "Volgende vraag" knop die pas verschijnt na het beantwoorden.
7. Aan het einde verschijnt de totaalscore van de speler.
8. De vragen zijn geschreven voor kinderen van 10 tot 12 jaar: begrijpelijk, niet te moeilijk.
9. Het ontwerp is kleurrijk, modern en heeft grote knoppen.
10. Alles zit in één enkel HTML-bestand zonder externe bestanden of internet nodig.
Geef alleen de HTML-code terug, zonder uitleg erbuiten.
Nog geen onderwerp gekozen?
Klik op een onderwerp in stap 2. Het gele stukje [ONDERWERP] wordt dan automatisch ingevuld in de prompt hierboven.
4
Stap 4
ChatGPT aan het werk zetten
1
Ga naar chatgpt.comOpen de browser en ga naar chatgpt.com. Log in als je al een account hebt, of vraag de docent om hulp.
2
Plak de prompt in het tekstvakKlik op het tekstvak onderaan en plak de gekopieerde prompt. Controleer of het onderwerp goed staat ingevuld.
3
Druk op Enter of klik op de pijlChatGPT begint nu de HTML-code te schrijven. Dit duurt 15 tot 30 seconden.
4
Controleer de quizvragenLees de vragen en antwoorden die ChatGPT heeft bedacht. Kloppen ze? Zijn ze leuk genoeg? Zo niet, stuur bij (zie tip hieronder).
5
Kopieer de HTML-codeSelecteer alle code (van <!DOCTYPE html> tot </html>) en kopieer die. Of klik op het kopieer-icoontje boven de code als dat beschikbaar is.
Niet tevreden? Stuur bij!
Is een vraag te moeilijk, te makkelijk of klopt er iets niet? Typ dan een vervolgprompt. Bijvoorbeeld:
Voorbeeld vervolgprompt
"Vraag 3 klopt niet helemaal. Pas die vraag aan zodat het antwoord beter uitgelegd wordt."
Voorbeeld vervolgprompt
"Maak de vragen een beetje makkelijker. Ze zijn nu te moeilijk voor kinderen van 10 jaar."
Voorbeeld vervolgprompt
"Maak de achtergrond blauw en de knoppen groter."
5
Stap 5
Testen in CodePen
Bekijk je quiz direct in de browser
Met CodePen kun je de HTML-code van ChatGPT meteen uitproberen in de browser. Zo zie je of alles werkt voordat je hem inlevert. Je hoeft niets te installeren — CodePen werkt gewoon in je browser.
Hoe werkt het?
Ga naar codepen.io/pen/, plak je HTML-code en je quiz verschijnt meteen in beeld.
Klik op het HTML-vak (linksboven)Klik in het grote witte vak waar "HTML" boven staat.
3
Plak alle HTML-codeDruk op Ctrl+A om alles te selecteren en Ctrl+V om de code van ChatGPT te plakken.
4
Bekijk het resultaat rechtsonderJe quiz verschijnt meteen in het voorbeeldvenster rechtsonder in beeld. Werkt het nog niet? Wacht even of klik op "Run".
5
Test de quizKlik antwoorden aan. Klopt de score? Werken de knoppen? Zo niet, ga terug naar ChatGPT en stuur bij.
Alles werkt? Top!
Als de quiz goed werkt in CodePen, is hij klaar om in te leveren. Ga dan door naar stap 6.
6
Stap 6
Inleveren en online zetten
Zo lever je je quiz in
Als jullie tevreden zijn met de quiz, lever je de HTML-code in bij de docent. Die zorgt dat jullie quiz op de website van het groepje komt te staan en meteen te spelen is door iedereen.
1
Kopieer alle HTML-code uit ChatGPTAlles van <!DOCTYPE html> tot en met </html>
2
Geef het door aan de docentDe docent plakt de code in het bestand van jullie groepje (groep-1.html, groep-2.html, enz.)
3
Jullie quiz staat online!Zodra de docent het bestand opslaat, is jullie quiz zichtbaar op de hoofdpagina en kan iedereen hem spelen.
Goed gedaan!
Jullie hebben zojuist een echte website gemaakt met behulp van AI, zonder ook maar één regel code zelf te typen. Dat is precies hoe AI als hulpmiddel werkt.
🎉
Bekijk alvast de andere quizzen
Zodra alle groepjes klaar zijn, kun je ze allemaal spelen op de hoofdpagina.