{"id":4866,"date":"2023-03-16T16:08:54","date_gmt":"2023-03-16T16:08:54","guid":{"rendered":"https:\/\/www.parnes.com\/blog\/?p=4866"},"modified":"2025-08-26T11:17:32","modified_gmt":"2025-08-26T11:17:32","slug":"mazy-chatgpt-gor-ett-enkelt-3d-spel-i-doom-stil","status":"publish","type":"post","link":"https:\/\/www.parnes.com\/blog\/index.php\/2023\/03\/16\/mazy-chatgpt-gor-ett-enkelt-3d-spel-i-doom-stil\/","title":{"rendered":"Mazy – ChatGPT g\u00f6r ett enkelt 3D-spel i Doom-stil"},"content":{"rendered":"\n

Provade att be ChatGPT4 att g\u00f6ra ett enklare labyrintspel i Wolfenstein \/ Doom-anda. Det blev ett interaktivt sampel d\u00e4r jag kunde g\u00e5 omkring med vanliga WASD och styra kameran med musen. OBS det fungerar inte p\u00e5 mobiler.<\/p>\n\n\n\n

H\u00e4r \u00e4r spelet som det ser ut just nu<\/a>. Sj\u00e4lva labyrinten \u00e4r inne i kuben. <\/p>\n\n\n\n

Uppdatering. 250826 gjorde jag en kort test med samma prompt i ChatGPT5 och efter n\u00e5gra iterationer s\u00e5 kom jag fram till f\u00f6ljande exempel<\/a> d\u00e4r “gubben” g\u00e5r sj\u00e4lv i en XMade-karta. Nedan forts\u00e4tter orginalinl\u00e4gget. <\/p>\n\n\n

\n
\"\"<\/a><\/figure>\n<\/div>\n\n
\n
\"\"<\/a><\/figure>\n<\/div>\n\n\n

H\u00e4r kan ni prova “spelet”. Ni g\u00e5r omkring med tangenterna WASD och styr med musen. Notera att man inte g\u00e5r i den riktning man tittar (som \u00e4r normalt i spel) utan man r\u00f6r sig alltid i samma riktning som man trycker. <\/p>\n\n\n\n

Det tog n\u00e5gra f\u00f6rs\u00f6k att f\u00e5 till n\u00e5got som fungerade men ChatGPT hj\u00e4lpte mig v\u00e4ldigt bra p\u00e5 v\u00e4gen och f\u00f6rklarade de olika \u00e4ndringarna med b\u00e5de vad och vart de skulle in i koden. <\/p>\n\n\n\n

Mazy<\/h2>\n\n\n\n

Jag gav den f\u00f6ljande instruktioner f\u00f6rst och den valde sj\u00e4lv programmeringsspr\u00e5k (finns inte s\u00e5 m\u00e5nga alternativ till JavaScript f\u00f6r detta) och den valde biblioteket three.js (det finns m\u00e5nga olika att v\u00e4lja p\u00e5). Under det kan ni se delar av svaret inklusive den f\u00f6rsta delen av f\u00f6rklaringen. <\/p>\n\n\n\n

Skapa ett 3D-spel som Wolfenstein eller Doom. G\u00f6r det i en enda HTML-fil utan f\u00f6rklaringar. Kameran ska vara ut f\u00f6rsta-person och jag ska kunna g\u00e5 omkring. G\u00e4tt olika f\u00e4rger och bilder p\u00e5 v\u00e4ggarna.<\/pre>\n\n\n
\n
\"\"<\/a><\/figure>\n<\/div>\n\n\n
ChatGPT har fortfarande inte access till omv\u00e4rlden s\u00e5 alla l\u00e4nkar till texturer (bilder) p\u00e5 v\u00e4ggar och golv blev fel. Dessa har jag fixat manuellt genom att bara g\u00f6ra om l\u00e4nkarna till bilder jag hittat p\u00e5 n\u00e4tet och som liknar 3D-spels-milj\u00f6er. <\/p>\n\n\n\n
Kontrollerna i spelet \u00e4r inte som ett riktigt spel men det kan s\u00e4kert ChatGPT ocks\u00e5 fixa. <\/p>\n\n\n\n
Fixa fel<\/h2>\n\n\n\n
Jag fick som sagt n\u00e5gra fel innan jag kunde “spela” och h\u00e4r kan ni se n\u00e5gra iterationer med ChatGPT. <\/p>\n\n\n\n
F\u00f6rst fick jag ett fel med initieringen av att l\u00e5sa muspekaren i f\u00f6nstret. <\/p>\n\n\n
\n
\"\"<\/a><\/figure>\n<\/div>\n\n\n
Sedan lade den sj\u00e4lv till lite extra kod f\u00f6r att g\u00f6ra r\u00f6relserna j\u00e4mnare. Dock gjorde ChatGPT lite fel (igen) men det fixade den n\u00e4r jag fr\u00e5gade fint. <\/p>\n\n\n
\n
\"\"<\/a><\/figure>\n<\/div>\n\n\n
R\u00f6ra sig snabbare <\/h2>\n\n\n\n
Sedan ville jag kunna r\u00f6ra mig snabbare s\u00e5 jag fr\u00e5gade om det. <\/p>\n\n\n
\n
\"\"<\/a><\/figure>\n<\/div>\n\n\n
Kastat om h\u00f6ger och v\u00e4nster<\/h2>\n\n\n\n
Sedan uppt\u00e4ckte jag att den hade v\u00e4xlat h\u00f6ger och v\u00e4nster i r\u00f6relsen. Ett fel som nog m\u00e5nga programmera ocks\u00e5 g\u00f6r ibland.<\/p>\n\n\n
\n
\"\"<\/a><\/figure>\n<\/div>\n\n\n
B\u00f6rja inne i labyrinten<\/h2>\n\n\n\n
Slutligen ville jag b\u00f6rja inne i labyrinten och det fixade ChatGPT \u00e5t mig.<\/p>\n\n\n
\n
\"\"<\/a><\/figure>\n<\/div>\n\n\n
Inte krocka med v\u00e4ggarna<\/h2>\n\n\n\n
Slutligen bad jag den om kod f\u00f6r att inte krocka med v\u00e4ggarna. Jag fick n\u00e5got som ser r\u00e4tt ut men det fungerar inte riktigt utan ist\u00e4llet s\u00e5 g\u00e5r man l\u00e5ngsammare genom v\u00e4ggarna. Blev lite cool effekt. Jag tar med svaret h\u00e4r i alla fall som exempel. <\/p>\n\n\n
\n
\"\"<\/a><\/figure>\n<\/div>\n\n
\n
\"\"<\/a><\/figure>\n<\/div>\n\n\n
Notera kommentaren i slutet av svaret om hur jag b\u00f6r g\u00e5 vidare med mer avancerade bibliotek med en fysikmotor.  <\/p>\n\n\n\n
Slutsats<\/h2>\n\n\n\n
ChatGPT4 \u00e4r klart b\u00e4ttre p\u00e5 att programmera och detta “spel” den skapade \u00e4r helt klart imponerande. Det tog mig ca 15 minuter att komma s\u00e5 h\u00e4r l\u00e5ngt och \u00e4ven om jag \u00e4r en v\u00e4ldigt erfaren programmerare (40+ \u00e5r som programmerare) s\u00e5 hade jag inte fixat detta p\u00e5 15 minuter. Programmering tar tid \u00e4ven om man \u00e4r erfaren. <\/p>\n\n\n\n
ChatGPT blir h\u00e4r verkligen \u00e4r hj\u00e4lpl\u00e4rare som kan svara p\u00e5 mina fr\u00e5gor och hj\u00e4lpa komma vidare och f\u00f6rklara s\u00e5 jag ocks\u00e5 l\u00e4r mig n\u00e5got. Jag har tidigare anv\u00e4nt GitHub CoPilot (som anv\u00e4nder AI-hj\u00e4rnan Codex fr\u00e5n OpenAI) v\u00e4ldigt mycket och d\u00e4r f\u00e5r man f\u00f6rslag p\u00e5 vad som ska l\u00e4ggas in men man f\u00e5r inte m\u00f6jligheten att st\u00e4lla fr\u00e5gor och det blir inte samma m\u00f6jlighet till l\u00e4rande med CoPilot. <\/p>\n\n\n\n
Jag \u00e4r \u00f6vertygad om att ChatGPT kommer att kunna hj\u00e4lpa m\u00e5nga att l\u00e4ra sig programmera.  <\/p>\n\n\n\n
Ps. ChatGPT4 sl\u00e4pptes bara f\u00f6r n\u00e5gon dag sedan och f\u00f6r att f\u00e5 access m\u00e5ste man betala f\u00f6r ChatGPT Plus. ChatGPT4 kan resonera mycket b\u00e4ttre men \u00e4r samtidigt mycket l\u00e5ngsammare. N\u00e4r den genererade programkoden ovan s\u00e5 fick jag v\u00e4nta en stund. N\u00e4stan om att titta p\u00e5 n\u00e5gon som programmerar i realtid. Det \u00e4r visserligen bra f\u00f6r jag satt och l\u00e4ste koden medan ChatGPT4 producerade den. L\u00e4rande igen… <\/p>\n","protected":false},"excerpt":{"rendered":"
Provade att be ChatGPT4 att g\u00f6ra ett enklare labyrintspel i Wolfenstein \/ Doom-anda. Det blev ett interaktivt sampel d\u00e4r jag kunde g\u00e5 omkring med vanliga WASD och styra kameran med musen. OBS det fungerar inte p\u00e5 mobiler. H\u00e4r \u00e4r spelet som det ser ut just nu. Sj\u00e4lva labyrinten \u00e4r inne i kuben. Uppdatering. 250826 gjorde … Continue reading Mazy – ChatGPT g\u00f6r ett enkelt 3D-spel i Doom-stil<\/span> →<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":4877,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1055,1054,1046,1044],"tags":[],"class_list":["post-4866","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-ai","category-chatgpt","category-digitalisering","category-digitalisering-i-skolan"],"_links":{"self":[{"href":"https:\/\/www.parnes.com\/blog\/index.php\/wp-json\/wp\/v2\/posts\/4866","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.parnes.com\/blog\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.parnes.com\/blog\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.parnes.com\/blog\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.parnes.com\/blog\/index.php\/wp-json\/wp\/v2\/comments?post=4866"}],"version-history":[{"count":8,"href":"https:\/\/www.parnes.com\/blog\/index.php\/wp-json\/wp\/v2\/posts\/4866\/revisions"}],"predecessor-version":[{"id":5322,"href":"https:\/\/www.parnes.com\/blog\/index.php\/wp-json\/wp\/v2\/posts\/4866\/revisions\/5322"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.parnes.com\/blog\/index.php\/wp-json\/wp\/v2\/media\/4877"}],"wp:attachment":[{"href":"https:\/\/www.parnes.com\/blog\/index.php\/wp-json\/wp\/v2\/media?parent=4866"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.parnes.com\/blog\/index.php\/wp-json\/wp\/v2\/categories?post=4866"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.parnes.com\/blog\/index.php\/wp-json\/wp\/v2\/tags?post=4866"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}