Prompt Library ครูนุ่มเดฟเทค

“ช่วยออกแบบและพัฒนาระบบรายงานการประชุมผู้ปกครองออนไลน์ โดยมีคุณสมบัติดังนี้:
1. หน้าแบบฟอร์มลงทะเบียนผู้ปกครอง
• ใส่ข้อมูล: คำนำหน้า, ชื่อ–นามสกุลผู้ปกครอง, นักเรียน (ชื่อ–นามสกุล / เลขที่ / ห้อง), ความเกี่ยวข้อง (บิดา/มารดา/ผู้ปกครอง)
• บันทึกเวลาที่เข้าร่วมประชุมอัตโนมัติ
2. ระบบบันทึกรายงานการประชุม
• หัวข้อการประชุม
• ปัญหาที่พบของนักเรียน
• การให้ข้อมูลของครู
• ข้อตกลงร่วมกันระหว่างครูและผู้ปกครอง
• ช่องแนบรูปภาพ (ถ้าต้องการ)
3. ระบบลงชื่อเข้าร่วม
• มีปุ่ม “ยืนยันเข้าร่วม”
• บันทึกข้อมูลลงฐานข้อมูล (Google Sheet หรือฐานข้อมูลเว็บ)
4. ระบบสร้างรายงานอัตโนมัติ (Auto Report)
• สรุปข้อมูลการประชุมแต่ละครอบครัวออกเป็น PDF
• มีโลโก้โรงเรียน / ข้อมูลครูที่ปรึกษา
• รูปแบบเป็นทางการ พร้อมลายเซ็นดิจิทัล
5. แดชบอร์ดของครู
• แสดงรายชื่อนักเรียนทั้งหมด
• สถานะเข้าร่วมประชุม
• ปัญหา/ข้อเสนอแนะ
• ดาวน์โหลดรายงานรายบุคคลหรือแบบรวม
6. คุณสมบัติเพิ่มเติม (ถ้ามี)
• ส่งข้อความแจ้งเตือนผ่าน LINE Notify หรือ LINE API
• ระบบค้นหาผู้ปกครอง
• สรุปข้อมูลภาพรวมของห้องเรียน

ให้เขียนโครงสร้างระบบ UI/UX พร้อมตัวอย่างหน้าจอ, ตัวอย่างโค้ด front-end และ back-end (เช่น HTML, CSS, JavaScript, Google Apps Script), พร้อมโฟลว์การทำงานของระบบทั้งหมด เพื่อให้ครูสามารถนำไปใช้งานจริงได้ทันที”

สร้างเว็บไซต์หรือเว็บแอปพลิเคชัน “ระบบขออนุญาตนำรถจักรยานยนต์มาโรงเรียน” สำหรับนักเรียนระดับมัธยมศึกษา
ให้สามารถกรอกข้อมูลออนไลน์ และบันทึกข้อมูลลงฐานข้อมูลหรือส่งออกเป็นรายงานได้
ออกแบบให้ใช้งานง่าย เหมาะกับโรงเรียนในประเทศไทย โทนสีฟ้า–ขาว ฟอนต์ Prompt หรือ Sarabun

รายละเอียดฟอร์มที่ต้องมี:

วันที่ (วัน / เดือน / พ.ศ.)

ชื่อ–นามสกุลนักเรียน พร้อมคำนำหน้า (เด็กชาย / เด็กหญิง / นาย / นางสาว)

ชั้นมัธยมศึกษาปีที่ และห้อง

ชื่อครูที่ปรึกษา

เหตุผลที่ต้องนำรถจักรยานยนต์มาโรงเรียน

รายละเอียดรถ

ยี่ห้อ

รุ่น

สี

หมายเลขทะเบียน

ส่วนรับรองของผู้ปกครอง

ชื่อ–นามสกุลผู้ปกครอง

ความสัมพันธ์กับนักเรียน

ช่องติ๊ก “รับทราบและยินยอมตามระเบียบโรงเรียน”

ปุ่ม “บันทึกข้อมูล / ส่งคำขออนุญาต”

ส่วนสรุปข้อมูลสำหรับพิมพ์รายงาน PDF (เช่น ใบคำขอพร้อมลายเซ็น)

เพิ่มโลโก้โรงเรียน และข้อความ “โรงเรียนบางแม่หม้ายรัฐราษฎร์รังสฤษดิ์ จังหวัดสุพรรณบุรี”

แนวทางการออกแบบ:

จัดวางเป็นหน้าเว็บฟอร์มเรียบง่าย มีหัวข้อชัดเจน

ใช้ไอคอนรถจักรยานยนต์หรือภาพประกอบแนวโรงเรียน

เพิ่มส่วนประกาศ/ระเบียบการนำรถจักรยานยนต์มาโรงเรียน (อ่านก่อนส่งคำขอ)

ปรับให้แสดงผลได้ทั้งบนคอมพิวเตอร์และมือถือ

ออกแบบ เว็บแอปพลิเคชันบันทึกและรายงานผลการจัดกิจกรรมโฮมรูมออนไลน์
สำหรับโรงเรียนระดับมัธยมศึกษา

ฟังก์ชันหลักที่ต้องการ:

ฟอร์มกรอกข้อมูลกิจกรรมโฮมรูม

ระดับชั้น (ม.1 – ม.6)

ห้องเรียน (1 – 11)

ครูที่ปรึกษาคนที่ 1 → คำนำหน้า, ชื่อ–นามสกุล

ครูที่ปรึกษาคนที่ 2 → คำนำหน้า, ชื่อ–นามสกุล

วันเดือนปีที่จัดกิจกรรม

หัวข้อ / เรื่องที่อบรม–แนะนำ–แจ้งข่าวสาร

รายชื่อนักเรียนที่ขาดเรียน (กรอกได้หลายคน)

ระบบบันทึกข้อมูลลงฐานข้อมูล (จำลองใน Canva AI หรือเชื่อมต่อ Canva Sheet ก็ได้)

หน้ารายงานผลกิจกรรมโฮมรูมในรูปแบบ

Dashboard ที่สวยงาม แสดงสถิติ เช่น จำนวนกิจกรรม, ครูที่ปรึกษา, นักเรียนที่ขาดเรียน, กิจกรรมแยกตามชั้น

ตารางข้อมูล (Datatable) ที่สามารถค้นหา / เรียงลำดับ / กรองข้อมูลได้

ดีไซน์ให้เรียบง่าย ทันสมัย โทนสีฟ้า–ขาว

ใช้ฟอนต์ Prompt หรือฟอนต์อ่านง่ายแบบราชการ

รองรับการใช้งานบนมือถือและแท็บเล็ต

⚙️ เพิ่มข้อความส่วนหัวเว็บว่า
“ระบบบันทึกและรายงานผลกิจกรรมโฮมรูมออนไลน์”
🔗 มีปุ่ม "เพิ่มกิจกรรม", "ดูรายงาน", "ส่งออกข้อมูล (PDF/Excel)"

สร้างระบบส่ง "แผนการจัดการเรียนรู้ โครงการสอน และบันทึกหลังแผนการจัดการเรียนรู้"
ให้ครูสามารถอัปโหลดไฟล์ PDF ได้
โดยมีแบบฟอร์มกรอกข้อมูลดังนี้:
- คำนำหน้า (นาย, นาง, นางสาว)
- ชื่อ
- นามสกุล
- กลุ่มสาระการเรียนรู้ (เลือกจากเมนู เช่น ภาษาไทย, คณิตศาสตร์, วิทยาศาสตร์, สังคมศึกษา, สุขศึกษาและพลศึกษา, ศิลปะ, การงานอาชีพ, ภาษาต่างประเทศ, กิจกรรมพัฒนาผู้เรียน)
- ประเภทเอกสาร (แผนการจัดการเรียนรู้ / โครงการสอน / บันทึกหลังแผน)
- หมายเหตุ (ถ้ามี)

หลังจากอัปโหลดแล้ว ให้ระบบแสดง “ตารางข้อมูลการส่งงาน”
โดยแสดงคอลัมน์ดังนี้:
1. ลำดับที่
2. ชื่อ-นามสกุล
3. กลุ่มสาระการเรียนรู้
4. ประเภทเอกสาร
5. ชื่อไฟล์ PDF
6. วันที่ส่ง
7. สถานะ (รอตรวจ / ผ่าน / ไม่ผ่าน)

ออกแบบหน้าตาให้น่าใช้งาน สไตล์เว็บไซต์ระบบโรงเรียน
ใช้โทนสีฟ้า-ขาว ฟ้อนต์ “Sarabun”
เพิ่มปุ่ม “อัปโหลดไฟล์ PDF” และ “ดูข้อมูลการส่งทั้งหมด”
ให้รองรับการแสดงผลบนมือถือและแท็บเล็ตได้ด้วย

สร้างหน้าเว็บระบบส่งไฟล์ “Mind Mapping โครงงานคอมพิวเตอร์”
ออกแบบด้วยโทนสีฟ้าขาว สะอาดตา ใช้ฟอนต์ Prompt
มีโลโก้ด้านบน (ลิงก์โลโก้: https://imprnoom.com/images/logonoom1.png)
และหัวข้อใหญ่ “ระบบส่งไฟล์ Mind Mapping โครงงานคอมพิวเตอร์”
ใต้หัวข้อระบุข้อความย่อยว่า ครูพิชชยานาฏ รีรักษ์

ส่วนของแบบฟอร์มให้จัดในกล่องสวยงาม (Card Style)
มีช่องให้กรอกดังนี้
• คำนำหน้า (ดรอปดาวน์: เด็กชาย, เด็กหญิง, นาย, นางสาว)
• ชื่อ
• นามสกุล
• เลขที่
• ชั้น (ดรอปดาวน์: ม.6/1, ม.6/2, … ม.6/11)
• แนบไฟล์ PDF (จำกัดขนาดไม่เกิน 5 MB)
• ปุ่ม “ส่งไฟล์” (สีฟ้า เด่นชัด มีไอคอน Upload)

ใต้ฟอร์ม ให้แสดง ตารางข้อมูล (DataTable Style) แสดงผลการส่งไฟล์
หัวตารางประกอบด้วย
1. ลำดับ
2. ชื่อ–นามสกุล
3. เลขที่
4. ชั้น
5. ลิงค์ไฟล์
6. วันที่ส่ง

ออกแบบให้โครงสร้างหน้าเว็บมี 3 ส่วนหลัก:
1. Header: โลโก้ + ชื่อระบบ
2. Form Section: กล่องฟอร์มกรอกข้อมูล
3. Table Section: ตารางแสดงรายการไฟล์ที่ส่งแล้ว

เพิ่มไอคอนและองค์ประกอบกราฟิกแนว “Mind Map / Project / Idea” เบาๆ ในพื้นหลัง
เพื่อให้ดูเป็นธีมวิชาคอมพิวเตอร์

เพิ่มข้อความปิดท้ายหน้า:
“💡 ระบบนี้จัดทำเพื่อการเรียนการสอนรายวิชาโครงงานคอมพิวเตอร์
โรงเรียนแม่จันวิทยาคม โดยครูพิชชยานาฏ รีรักษ์”

⸻

✅ เคล็ดลับเพิ่มเติม (ใช้ใน Canva AI)
• ประเภทงานที่ควรเลือก: “เว็บไซต์” หรือ “แอปพลิเคชัน”
• โทนสีแนะนำ: ฟ้า (#3B82F6), ขาว, เทาอ่อน
• ฟอนต์: Sarabun หรือ Prompt
• สไตล์: Minimal, Clean, Educational, Tech-Inspired
• รองรับ Responstive มือถือ แท็บเล็ต คอมพิวเตอร์
• เป็น Bootstrap อย่างสวยงาม

“สร้างหน้าเว็บไซต์ระบบ ‘คลังสื่อครูแบ่งปัน (Teacher Media Hub)’ โทนสีฟ้า-ขาว ฟอนต์ Sarabun ดูสะอาดตา เป็นมิตรกับครู มีส่วนประกอบดังนี้:
• Header: โลโก้ + ชื่อระบบ ‘คลังสื่อครูแบ่งปัน (Teacher Media Hub)’
• Section 1: ฟอร์มอัปโหลดสื่อ (ชื่อเรื่อง, คำอธิบาย, ผู้ส่ง, โรงเรียน, อัปโหลดไฟล์สูงสุด 10 ไฟล์, ปุ่ม ‘บันทึก’)
• Section 2: แสดงรายการสื่อการสอนทั้งหมดจากฐานข้อมูล (Google Sheet)
• Section 3: Footer แสดงลิงก์ติดต่อผู้ดูแลระบบ

ออกแบบให้ Responsive รองรับมือถือ และเหมาะกับเว็บไซต์หน่วยงานการศึกษา”

“สร้างระบบคลังรูปภาพออนไลน์ให้ผู้ใช้สามารถอัปโหลดรูปได้ไม่เกิน 10 ภาพต่อครั้ง รูปถูกเก็บใน Google Drive folder ที่ระบุ ข้อมูลเมตา (ชื่อไฟล์, ขนาด, MIME type, URL, uploader name, caption, timestamp) ถูกบันทึกลง Google Sheet หน้าเว็บแสดง Gallery แบบ responsive และมี lightbox สำหรับดูภาพขนาดใหญ่ ให้มีการตรวจสอบไฟล์ (เฉพาะ image/*) และแจ้งข้อความผิดพลาดถ้าเกิน 10 รูปหรือชนิดไฟล์ไม่ถูกต้อง ให้โค้ดพร้อมใช้งานเป็น Google Apps Script (HTML + Server-side Apps Script) และคำอธิบายการตั้งค่า Google Drive folder id และ Google Sheet header”

สร้างหน้าเว็บฟอร์มออนไลน์ “ระบบขออนุญาตไปราชการ”
โทนสีฟ้าขาว สะอาดตา ใช้ฟ้อนต์ Sarabun
มีส่วนหัว (Header) เขียนว่า “แบบขออนุญาตไปราชการออนไลน์”
ใต้หัวข้อให้มีคำอธิบายสั้นๆ ว่า “ระบบบันทึกคำขออนุญาตไปราชการสำหรับครูและบุคลากรทางการศึกษา”

🔹 ฟอร์มกรอกข้อมูลมีช่องดังนี้:
• เขียนที่ (โรงเรียน…)
• วันที่
• เรื่อง (ขออนุญาตไปราชการ)
• เรียน (ผู้อำนวยการ…)
• ชื่อ-สกุล
• ตำแหน่ง
• กลุ่ม/ฝ่าย
• โรงเรียน
• พร้อมด้วย (ถ้ามี)
• ขออนุญาตไปราชการเพื่อ… (กล่องข้อความหลายบรรทัด)
• สถานที่
• ตั้งแต่วันที่ - ถึงวันที่
• เวลาเริ่ม - เวลาสิ้นสุด
• รวมจำนวนวัน
• แหล่งงบประมาณ (ให้เลือกจากรายการ เช่น “งบประมาณแผ่นดิน”, “เงินอุดหนุน”, “อื่น ๆ”)
• การเดินทางโดย (ให้เลือก เช่น รถราชการ / รถส่วนตัว / รถโดยสาร)
• หมายเลขทะเบียนรถ (ถ้ามี)

🔹 ส่วนล่างของฟอร์ม:
• ปุ่ม “บันทึกคำขอ” (สีฟ้า)
• ปุ่ม “พิมพ์แบบฟอร์ม PDF”
• ช่องลายเซ็นอิเล็กทรอนิกส์ “ผู้ขออนุญาต”
• ช่องสำหรับ “ความคิดเห็นของรองผู้อำนวยการ”
• ช่องสำหรับ “ผู้อำนวยการอนุมัติ / ไม่อนุมัติ”

ให้จัดหน้าให้อ่านง่าย มีกรอบบาง ๆ สีฟ้าอ่อนล้อมรอบแต่ละส่วน
เพิ่มโลโก้โรงเรียนตัวอย่างด้านบนซ้าย
รองรับการกรอกข้อมูลแล้วส่งเข้า Google Sheet
ให้แสดงผลได้ทั้งบนคอมพิวเตอร์และมือถือ

🎓 สร้างระบบออนไลน์ “แบบฟอร์มทะเบียนประวัตินักเรียน”
เพื่อให้นักเรียนกรอกข้อมูลส่วนตัวและส่งเข้าฐานข้อมูลของครู
โทนสีฟ้า-ขาว ดูสะอาด เรียบง่าย ทางการ เหมาะกับงานโรงเรียน
📋 ฟอร์มที่นักเรียนกรอกประกอบด้วย:
• รูปถ่ายนักเรียน (อัปโหลดภาพได้)
• ชื่อ–สกุล
• ชั้นเรียน / เลขที่
• วันเดือนปีเกิด / อายุ
• ที่อยู่ปัจจุบัน
• เบอร์โทรศัพท์
• ชื่อบิดา / อาชีพบิดา
• ชื่อมารดา / อาชีพมารดา
• ผู้ปกครองที่ติดต่อได้
• การศึกษาของผู้ปกครอง
• ความสามารถพิเศษ / งานอดิเรก
• โรคประจำตัว (ถ้ามี)
• ความต้องการพิเศษ (เช่น ทุน, ดูแลเป็นพิเศษ ฯลฯ)
📂 เมื่อส่งข้อมูลแล้ว
• ระบบจะบันทึกข้อมูลนักเรียนแต่ละคน
• ครูสามารถดูรายการนักเรียนทั้งหมดในรูปแบบตาราง
• มีปุ่ม “ดาวน์โหลดเป็นไฟล์ PDF” เพื่อพิมพ์เป็นแบบฟอร์มประวัตินักเรียนรายบุคคล
• สามารถกรองตามชั้นเรียนหรือเลขที่ได้
🧾 รูปแบบ PDF ที่พิมพ์ออกมา:
• หัวกระดาษ: “แบบฟอร์มทะเบียนประวัตินักเรียน” พร้อมโลโก้โรงเรียน
• แสดงรูปถ่ายด้านซ้าย ชื่อ–สกุล และข้อมูลส่วนตัวด้านขวา
• แบ่งหมวดชัดเจน เช่น ข้อมูลทั่วไป / ผู้ปกครอง / การศึกษา / สุขภาพ
• ฟอนต์อ่านง่าย เช่น Sarabun
💡 สไตล์การออกแบบ:
• ใช้โครงแบบฟอร์มที่ดูเรียบร้อย (Form layout)
• ปุ่มส่งข้อมูลสีฟ้าเด่นชัด “ส่งข้อมูลให้ครู”
• เพิ่มไอคอนนักเรียน 📘 และเอกสาร 📄
🎯 จุดประสงค์ของระบบ:
เพื่อให้นักเรียนสามารถกรอกประวัติส่วนตัวได้ด้วยตนเอง ครูสามารถจัดเก็บ ตรวจสอบ และพิมพ์ออกเป็นแบบฟอร์ม PDF ได้อย่างสะดวกและเป็นระบบ