Waarom zou je in hemelsnaam coderen met artificiele intelligentie?
AI is de laatste jaren hard opgekomen. Er zijn al zoveel applicaties die het continu gebruiken. Denk maar aan algoritmes van sociale media zoals TikTok, Instagram en Facebook bijvoorbeeld. Alles wat jij ziet, wordt jou voorgeschoteld aan de hand van AI. Je hebt het zelf waarschijnlijk al gemerkt: als je een bepaalde hoeveelheid aandacht spendeert aan een post of topic, dan zal je de komende dagen en weken dit soort content telkens opnieuw zien terugkomen. Hier heeft AI een rol in!
Artificiële intelligentie werkt goed, heel goed zelfs. Developers kunnen het gebruiken om bugs te fixen, om hen te assisteren tijdens live coding (voorspellen van functies en variabelen) en bij het automatiseren van vervelende taken. AI staat niet stil en wordt ook steeds beter! Je kan nu zelfs simpel, in enkele heel eenvoudige stappen, een game coderen met AI. Je hoeft zelfs niets te kennen van coderen, ongelofelijk toch?
Om het principe van een game coderen met AI duidelijk te maken, gebruikte ik – Rien, stagiair webdevelopment bij Graviteit – ChatGPT om een web game te bouwen aan de hand van vier eenvoudige prompts.
In 4 stappen een game coderen met AI – met de hulp van ChatGPT: hoe doe je dat?
Prompt 1: Hey ChatGPT, ik wil een web game maken om m’n vaardigheden te testen! Kun je me hierbij helpen?
Response: Natuurlijk! Ik kan je helpen bij het maken van een eenvoudig web game om je behendigheid te testen!
Na elke reply volgt een stukje HTML-code dat je kan plakken in een .html- (voor de structuur), .css- (voor de layout) en .js- (JavaScript; voor functionaliteit) bestand, bijvoorbeeld in Visual Studio Code. We krijgen nu echter nog geen volledig spel te zien, we missen nog een aantal dingen om het echt een web game te noemen.
Prompt 2: Dit is een beetje saai. Kun je het wat interessanter maken?
Response: Zeker! Hier is een verbeterde versie van het spel met extra functies en verbeteringen.
Nu krijgen we wat extra functionaliteit binnen het spel, we hoeven niet meer te klikken op de cirkel maar enkel nog te hoveren. Onze score is nu ook zichtbaar, we hebben enkel nog een manier nodig om het spel te beëindigen.
Prompt 3: Ik mis nog een manier om het spel te beeindigen.
Response: Klopt! Hier is een bijgewerkte versie van het spel met een eindscherm en een manier om het spel te beëindigen.
Dit is een functionele web game maar toch missen we nog een thema en wat extra styling.
Prompt 4: Ik wil in mijn spel graag een raket en een achtergrond met sterren (full-screen). Verander het thema naar de Graviteitstijl 😉
Response: oké! Om het thema te veranderen naar een ruimtethema, kun je de CSS-stijlen en achtergrond aanpassen. Hier is de bijgewerkte versie van het spel.
Ziezo, dit is de finale versie van de game. Ik heb m’n collega’s uitgedaagd om een zo’n hoog mogelijke score te halen, zonder valsspelen (FRANK), is Laurence de winnaar van de Galactic Rocket Run!
Wil jij ook een game coderen met AI? Test het gerust eens uit met ChatGPT.
Wedden dat je het kan?
