RAWINNIPA / PRACTICAL WEB DEVELOPMENT
AI Web
Studio.
ออกแบบและพัฒนาเว็บไซต์ด้วย AI
เปลี่ยนโจทย์ให้เป็นเว็บไซต์ที่ใช้งานได้
ด้วย prompt, skills และการตรวจงานจริง
มหาวิทยาลัยสงขลานครินทร์ วิทยาเขตภูเก็ต
อบรม 2 วัน วันละ 4 ชั่วโมง รวม 8 ชั่วโมง มี source code, prompt และเนื้อหาสำหรับฝึกต่อ
“สร้างเว็บให้เช่าอุปกรณ์ถ่ายภาพ
เลือกวัน ตรวจสอบของว่าง
และบันทึกการจองได้”
ทุกขั้นมีเหตุผล ทุกผลลัพธ์ต้องตรวจสอบได้
สร้างไปด้วยกัน
สี่ธุรกิจ สี่โจทย์ที่ต่างกัน
เปิดทดลองก่อน แล้วเรียนรู้ว่า
แต่ละส่วนสร้างและตรวจสอบอย่างไร
บ้านและแบรนด์ที่เล่าเรื่องได้
Content · ฟอร์มติดต่อ · SEO
เปลี่ยนอุปกรณ์เป็นธุรกิจ
วันว่าง · การจอง · D1
ทำให้สินค้าเป็นพระเอก
Product story · GSAP · เปรียบเทียบรุ่น
ค้นหาพื้นที่ที่เป็นคุณ
UI/UX Pro Max · ตัวกรอง · รายการโปรด
เว็บตัวอย่างใช้ข้อมูลสมมติ การจองและใบเสนอราคาเป็นแบบฝึกหัด ไม่มีการรับชำระเงินจริง
เส้นทางการเรียนรู้
จากไม่รู้จะสั่ง AI อย่างไร
สู่เว็บที่อธิบายได้ทุกส่วน
อบรม 2 วัน วันละ 4 ชั่วโมง รวม 8 ชั่วโมง เป็นส่วนหนึ่งของรายวิชา 977-121 เลือกทำกิจกรรมหลักในห้อง แล้วใช้บทเรียนทั้ง 12 บทและ lab เสริมสำหรับอ่านและฝึกต่อด้วยตัวเอง
DAY 1ออกแบบและสร้างเว็บด้วย AI4 ชั่วโมง · Brief, skills, design และเว็บบริษัท
DAY 2ตรวจงานและนำเว็บขึ้นใช้งาน4 ชั่วโมง · ข้อมูล, motion, deploy และ capstone
เตรียมเครื่อง / ต่อยอดการออกแบบ
เลือกเครื่องมือให้ตรงงาน
เตรียมตัวก่อนเข้าเรียน และฝึกต่อจากเวลาอบรม 8 ชั่วโมง
ติดตั้ง AI tools ให้พร้อม
Claude Code, Codex, Claude Desktop และ ChatGPT Desktop พร้อมวิธีตรวจว่าเริ่มใช้งานได้
เปิดคู่มือติดตั้ง →02 / DESIGN WORKFLOWจากแบบออกแบบไปสู่โค้ด
Claude Design, Google Stitch และ Figma MCP พร้อม prompt และวิธีตรวจข้อมูลที่ส่งต่อ
เปิดบทเรียนออกแบบ →03 / WEBSITE → MOBILE APPจากเว็บบ้านสบาย สู่แอปในมือ
ใช้เว็บที่สร้างแล้วมาออกแบบ mobile app พร้อม prompt ของแต่ละเครื่องมือ และ prototype ให้ลองค้นหา ดูรายละเอียด และบันทึกบ้านที่สนใจ
เปิดบทเรียนและลอง prototype →04 / CLOUDFLARE SETUPพร้อม deploy ด้วย Wrangler
ติดตั้ง CLI, ล็อกอินผ่านเบราว์เซอร์ และสร้าง API token ที่มีสิทธิ์ตรงกับ Workers และ D1
เปิดคู่มือ login และ API token →05 / RESEARCH → BRAND KITจากข้อมูล สู่ brief และแบรนด์
ให้ AI ช่วย research แล้วสร้าง brandbook, icon และ key visual พร้อม prompt ทุกขั้น และชุด HUSH ให้เปิดเทียบ
เปิด Lab และตัวอย่าง →06 / BUILD THIS COURSE WEBSITEสร้างเว็บรายวิชาไปทีละขั้น
จากข้อมูล PSU สู่ brief, HTML, design และเว็บที่ค้นหาบทเรียนได้ ดู prompt จริงและภาพก่อน–หลังทุกช่วง
เปิดบทเรียนพร้อมภาพ →07 / RW WEB SKILLSจากข้อมูล สู่เว็บไซต์พร้อมเผยแพร่
ติดตั้ง skill ทั้ง 4 ฝึก research, brandkit, content, GPT Image และสร้างเว็บ ก่อน deploy ด้วย Cloudflare พร้อม prompt และภาพตัวอย่าง
เปิด Lab และดาวน์โหลด Skills →08 / CLOUDFLARE SERVICESเลือกบริการให้เหมาะกับเว็บไซต์
รู้จัก hosting, ฐานข้อมูล, ไฟล์ ภาพ วิดีโอ และความปลอดภัย พร้อมตัวอย่างว่าเว็บแต่ละแบบควรเริ่มจากอะไร
เปิดบทเรียนบริการ Cloudflare →เอาไปใช้กับงานของคุณ
ไม่ต้องเริ่มทุก prompt
จากหน้าว่าง
คลัง prompt สำหรับวางแผน ออกแบบ สร้างภาพ ตรวจโค้ด และ deploy พร้อมอธิบายว่าควรปรับส่วนไหน
เปิดคลังความรู้ →ตรวจเว็บไซต์นี้ตาม acceptance criteria
ทดสอบเส้นทางหลักและกรณีผิดพลาด
ตรวจบนมือถือ คีย์บอร์ด และ reduced motion
รายงานสิ่งที่พิสูจน์ได้ พร้อมหลักฐาน
หากยังทดสอบไม่ได้ ให้ระบุช่องว่างตามจริงเพิ่มบริบทของโปรเจกต์และข้อกำหนดก่อนนำไปใช้
ให้ AI ช่วยเขียน
แล้วเรารับผิดชอบคุณภาพ
เริ่มจากพื้นฐาน ฝึกกับตัวอย่าง และจบด้วยเว็บไซต์ของคุณเอง
เริ่มเรียนได้เลย →