[ตอนที่ 3] สร้างเกมเว็บด้วย AI ใน 30 นาที

กลายเป็นซีรีส์แบบกะทันหัน แต่สนุกดีเลยโอเค

ตอนนี้เริ่มมีคำถามเกี่ยวกับการแก้ไขข้อผิดพลาดเล็กๆ น้อยๆ และการปรับปรุงเพิ่มขึ้นเรื่อยๆ

ดูเหมือนจะบันทึกคำถามทั้งหมดได้ยาก แต่ลองบันทึกดูบ้างดีกว่า

Q13. ในเกมด้านบน เพิ่มพื้นที่แคนวาสเพื่อแสดงภาพพื้นหลัง ตัวละคร และมอนสเตอร์เหนือพื้นที่คอนโซลหน่อยสิ

-> หลังจากนั้นเพื่อเพิ่มกราฟิก จึงได้ร้องขอคำถามดังกล่าวและเพิ่มพื้นที่แคนวาส พร้อมทั้งแยกฟังก์ชันที่จำเป็นออกเป็น 3 ไฟล์ ในขณะเดียวกันได้เพิ่มฟังก์ชันการวาดภาพพื้นหลัง ตัวละคร และมอนสเตอร์ พร้อมทั้งเพิ่ม healthbar เหนือตัวละครและมอนสเตอร์ (ว้าว) ได้แจ้งว่าต้องเตรียม hero, goblin, orc, troll, dragon, background เอง จึงได้ขอสร้างภาพโดยใช้แท็บใหม่ใน perplexity (แบบ Flux model illustrator)

เมื่อป้อนเป็นภาษาเกาหลีแล้ว การสร้างภาพไม่ทำงานตามปกติ จึงได้ร้องขอตามด้านล่าง

Q13.1. fantasy, hero, right side, 2d pixel, 100x100size, character draw

Q13.2. fantasy, goblin, right side, 2d pixel, 100x100size, character draw

Q13.3. fantasy, orc monster, left side, 2d pixel, 100x100size, draw it.

13.4. fantasy, troll monster, left side, 2d pixel, 100x100size, draw it.

13.5. fantasy, dragon monster, left side, 2d pixel, 100x100size, draw it.

13.6. fantasy, forest, width 800pixel, height 400pixel, draw images

Q14. แสดงซอร์สทั้งหมดอีกครั้งหน่อยสิ

-> ได้ร้องขอให้แสดงทั้งหมดเพื่อการสะท้อนผล

Q15. ส่วนท้ายของไฟล์ game.js หายไป แสดงไฟล์นั้นอีกครั้งหน่อยสิ

-> ส่วนท้ายของไฟล์ game.js หายไปเล็กน้อย จึงได้ร้องขอให้แสดงไฟล์นั้นอีกครั้ง

Q16. ไฟล์ game.js ยาวเกินไป สามารถแยกตามฟังก์ชันหลักได้ไหม

-> เนื่องจากไฟล์ js เดียวมีความยาวมากเกินไป จึงได้ร้องขอให้แยกตามฟังก์ชันเพื่อการจัดการในอนาคต และได้ดำเนินการดังต่อไปนี้

ได้ครับ แน่นอน ผมสามารถแยกไฟล์ game.js ตามฟังก์ชันหลักเพื่อให้จัดการได้ง่ายขึ้นได้ ดังนี้ครับ:

characters.js: นิยามคลาส Character, Player, Monster
items.js: นิยามคลาส Weapon, Armor และข้อมูลที่เกี่ยวข้อง
game.js: คลาส Game และตรรกะเกมหลัก
ui.js: ฟังก์ชันที่เกี่ยวข้องกับ UI (การวาดแคนวาส การอัปเดตสถานะ ฯลฯ)
main.js: ฟังก์ชันที่เกี่ยวข้องกับการเริ่มต้นและการเรียกใช้เกม

Q17. ไฟล์ main.js หายไป แสดงไฟล์นั้นอีกครั้งหน่อยสิ

-> ไฟล์ที่ 5 จากด้านหลังหายไป จึงได้ร้องขอให้แสดงอีกครั้ง

Q18. แสดงซอร์ส HTML ที่รวมไฟล์ js ที่แยกแล้วหน่อยสิ

-> ร้องขอให้แสดงซอร์ส HTML ที่รวมไฟล์ที่แยกแล้ว

Q19. มีบั๊กที่ healthbar ไม่แสดงบนแคนวาสระหว่างการต่อสู้ ตรวจสอบและแก้ไขซอร์สหน่อยสิ

-> แสดงผลปกติ แต่ health bar จะปรากฏเฉพาะตอนเริ่มต้นเท่านั้น และไม่ปรากฏระหว่างการต่อสู้ จึงได้ร้องขอให้แก้ไข

Q20. เกิดข้อผิดพลาดเมื่อวาด monsterImage ใน ui.js แก้ไขหน่อยสิ

-> เกิดข้อผิดพลาดในฟังก์ชัน จึงได้ร้องขอให้แก้ไข

เสร็จสิ้นการทำงานช่วงพักกลางวัน ผลลัพธ์ทำงานได้ดี

https://ggoban.com/hof/