เล่ม5บทและสารบัญ

สารบัญ หนา้ ข บทคดั ยอ่ ค กิตติกรรมประกาศ ง สารบญั จ สารบัญภาพ ฒ สารบญั ตาราง บทท่ี 1 บทนา 1 2 1.1 ความเป็นมาและความสาคญั ของปญั หา 2 1.2 วตั ถุประสงค์ของโครงงาน 4 1.3 ขอบเขตของโครงงาน 4 1.4 เครอื่ งมือและอปุ กรณ์ทใ่ี ช้ในการพัฒนา 4 1.5 ประโยชน์ทคี่ าดวา่ จะได้รบั 1.6 ข้อจากดั ของซอฟต์แวร์ 5 บทท่ี 2 เอกสารและงานวิจัยท่เี กีย่ วข้อง 9 2.1 โควิด 19 10 2.2 หลกั การพฒั นาแอปพลเิ คชนั 18 2.3 เครือ่ งมอื ทใ่ี ช้ในการพฒั นา 2.4 สรปุ ผล 21 บทที่ 3 วธิ กี ารดาเนนิ งาน 22 3.1 ศึกษาข้อมลู และเอกสารท่เี ก่ยี วข้อง 22 3.2 กาหนดปญั หาของการพฒั นาระบบ 24 3.3 วิเคราะหค์ วามตอ้ งการของระบบ 81 3.4 ออกแบบระบบ 3.5 พฒั นาระบบ

สารบญั (ตอ่ ) หนา้ 122 3.6 ตรวจสอบระบบ 125 3.7 ทดลองใช้ 129 3.8 สรปุ ผลและจดั ทาเอกสาร บทที่ 4 ผลการดาเนินงาน 129 4.1 สว่ นของเจ้าหน้าท่ี 137 4.2 ส่วนของผใู้ ชง้ าน 146 4.3 ผลการประเมนิ บทที่ 5 สรปุ ผลการดาเนินงานและข้อเสนอแนะ 148 5.1 สรปุ ผลการดาเนินงาน 149 5.2 ปญั หาและแนวทางการแก้ไข 149 5.3 ข้อเสนอแนะ

สารบญั รูปภาพ หนา้ ภาพท่ี 2-1 อาการโควิดสายพนั ธตุ์ า่ ง ๆ 7 ภาพท่ี 2-2 อาการโควดิ สายพันธุ์โอไมครอน 8 ภาพท่ี 2-3 ขน้ั ตอนการพัฒนาแอปพลเิ คชนั 9 ภาพที่ 2-4 โลโก้โปรแกรม Visual Studio Code 12 ภาพท่ี 2-5 หน้าแรกของโปรแกรม Visual Studio Code 11 ภาพที่ 2-6 โลโกโ้ ปรแกรม Figma 12 ภาพท่ี 2-7 หนา้ แรกของโปรแกรม Figma 12 ภาพที่ 2-8 โลโก้ภาษา Dart 13 ภาพท่ี 2-9 โลโก้ Google Maps Platform 15 ภาพที่ 2-10 โลโก้ Firebase 15 ภาพที่ 2-11 หน้าแรกของ Firebase 16 ภาพท่ี 3-1 ขน้ั ตอนการพฒั นาแอปพลเิ คชันติดตามการกักตวั สถานการณ์แพร่ระบาดโควดิ 19 20 สาหรับนักศกึ ษามหาวิทยาลยั เทคโนโลยีพระจอมเกลา้ พระนครเหนอื ภาพท่ี 3-2 UC000 แอปพลเิ คชนั ตดิ ตามการกักตัวสถานการณแ์ พรร่ ะบาดโควดิ 19 24 สาหรบั นกั ศึกษามหาวิทยาลัยเทคโนโลยพี ระจอมเกลา้ พระนครเหนือ ภาพท่ี 3-3 UC100 แสดงการทางานของระบบลงช่อื เข้าใช้งาน 25 ภาพท่ี 3-4 UC200 แสดงการทางานของระบบเขา้ ถงึ ขอ้ มูลของนกั ศึกษา 26 ภาพท่ี 3-5 US300 แสดงการทางานของระบบกักตัว 27 ภาพท่ี 3-6 UC400 แสดงการทางานของระบบติดเชอ้ื 28 ภาพที่ 3-7 UC500 แสดงการทางานของระบบแจง้ เตอื น 29 ภาพที่ 3-8 UC600 แสดงการทางานของระบบตรวจสอบ - ปรบั ปรุงขอ้ มลู 30 ภาพท่ี 3-9 UC700 แสดงการทางานของระบบการเข้าถงึ ขอ้ มลู เจ้าหนา้ ที่ 31 ภาพท่ี 3-10 แผนผังแสดงการทางานโดยรวมของระบบ 32 ภาพท่ี 3-11 Flowchart ขนั้ ตอนเข้าใช้งานระบบ 33 ภาพที่ 3-12 Flowchart ขนั้ ตอนการตรวจสอบสทิ ธิ์ 34 ภาพที่ 3-13 Flowchart ขน้ั ตอนการอัปโหลดเอกสาร 35 ภาพที่ 3-14 Flowchart ขน้ั ตอนการแสดงค่มู ือโควดิ ของเจา้ หน้าที่ 36 ภาพที่ 3-15 Flowchart ขน้ั ตอนการแสดงคมู่ ือกกั ตัวของเจา้ หน้าที่ 37

สารบญั รูปภาพ (ตอ่ ) หนา้ ภาพที่ 3-16 Flowchart ขน้ั ตอนการแสดงการประชาสัมพันธ์ของเจ้าหน้าท่ี 38 ภาพท่ี 3-17 Flowchart ขน้ั ตอนการแสดงสายด่วนของเจา้ หนา้ ท่ี 39 ภาพที่ 3-18 Flowchart ขนั้ ตอนการแสดงแจ้งเตือนของเจา้ หน้าที่ 40 ภาพท่ี 3-19 Flowchart ขนั้ ตอนการจัดการข้อมูลสว่ นตัวของเจ้าหน้าท่ี 41 ภาพท่ี 3-20 Flowchart ขน้ั ตอนการใช้งานหน้าแรกของเจา้ หนา้ ท่ี 42 ภาพท่ี 3-21 Flowchart ขนั้ ตอนการใช้งานหน้า Drawer ของนักศกึ ษาสถานะปกติ 43 ภาพที่ 3-22 Flowchart ขน้ั ตอนการใช้งานหน้าแรกของนักศึกษา 44 ภาพท่ี 3-23 Flowchart ขนั้ ตอนการใชง้ านหนา้ คู่มือโควิดของนกั ศึกษา 45 ภาพท่ี 3-24 Flowchart ขน้ั ตอนการใช้งานหนา้ คูม่ ือกักตัวของนักศกึ ษา 46 ภาพท่ี 3-25 Flowchart ขนั้ ตอนการใชง้ านหน้าสถานท่ีตรวจเชอ้ื 47 ภาพที่ 3-26 Flowchart ขนั้ ตอนการใชง้ านหน้าโรงพยาบาลใกล้ฉนั 48 ภาพที่ 3-27 Flowchart ขนั้ ตอนการใชง้ านหนา้ ประชาสัมพนั ธข์ องนกั ศึกษา 49 ภาพท่ี 3-28 Flowchart ขนั้ ตอนการใช้งานหน้าแสดงแผนที่ตาแหนง่ นกั ศกึ ษา 50 ภาพที่ 3-29 Flowchart ขน้ั ตอนการใช้งานหนา้ ขอเปล่ยี นสถานะของนกั ศกึ ษาสถานะปกติ 51 ภาพที่ 3-30 Flowchart ขน้ั ตอนการใช้งานหนา้ การจัดการขอ้ มลู ส่วนตัวของนักศกึ ษา 52 ภาพท่ี 3-31 Flowchart ขน้ั ตอนการใชง้ านหน้า Drawe rของนักศกึ ษาสถานะกักตัว 53 ภาพท่ี 3-32 Flowchart ขน้ั ตอนการใช้งานหน้าขอเปลย่ี นสถานะของนักศึกษาสถานะกกั ตวั 54 ภาพท่ี 3-33 Flowchart ขน้ั ตอนการใชง้ านหนา้ Drawerของนกั ศึกษาสถานะติดเชอื้ 55 ภาพที่ 3-34 Flowchart ขน้ั ตอนการใช้งานหนา้ ขอเปลย่ี นสถานะของนกั ศกึ ษาสถานะตดิ เชอ้ื 56 ภาพท่ี 3-35 Flowchart ขนั้ ตอนการใช้งานหนา้ ขอความชว่ ยเหลอื 57 ภาพที่ 3-36 ภาพแสดงการออกแบบฐานขอ้ มูล 58 ภาพท่ี 3-37 ภาพแสดงการออกแบบหน้าจอด้วยโปรแกรม Figma 62 ภาพท่ี 3-38 ภาพแสดงการออกแบบหนา้ จอ หนา้ หลัก 62 ภาพท่ี 3-39 ภาพแสดงการออกแบบหนา้ จอ หนา้ เข้าสรู่ ะบบ 63 ภาพที่ 3-40 ภาพแสดงการออกแบบหนา้ จอ แทบ็ ขา้ ง (เจ้าหนา้ ท)ี่ 63 ภาพที่ 3-41 ภาพแสดงการออกแบบหน้าจอ หนา้ ลบคู่มือป้องกันโควิด 64 ภาพท่ี 3-42 ภาพแสดงการออกแบบหน้าจอ หน้าลบคู่มอื การกกั ตวั 64 ภาพที่ 3-43 ภาพแสดงการออกแบบหน้าจอ สถานท่ีตรวจเช้ือ 65 ภาพท่ี 3-44 ภาพแสดงการออกแบบหนา้ จอ โรงพยาบาลทอี่ ย่ใู กล้ 65

สารบัญรปู ภาพ (ต่อ) หนา้ 66 ภาพที่ 3-45 ภาพแสดงการออกแบบหนา้ จอ หนา้ ลบประชาสัมพนั ธ์ 66 ภาพท่ี 3-46 ภาพแสดงการออกแบบหน้าจอ ขอ้ มูลสถานะของนักศกึ ษาท้ังหมด 67 ภาพที่ 3-47 ภาพแสดงการออกแบบหนา้ จอ ตาแหนง่ นกั ศกึ ษา 67 ภาพท่ี 3-48 ภาพแสดงการออกแบบหน้าจอ หน้าเพิ่มเอกสาร 68 ภาพที่ 3-49 ภาพการออกแบบหนา้ จอ การยนื ยนั สถานะ 68 ภาพที่ 3-50 ภาพการออกแบบหนา้ จอ หนา้ แสดงโปรไฟลเ์ จา้ หน้าที่ 69 ภาพท่ี 3-51 ภาพแสดงตัวเลอื กสาหรบั ผู้ใชง้ านสถานะปกติ (ผู้ใช้งานสถานะปกติ) 69 ภาพท่ี 3-52 ภาพแสดงการออกแบบหน้าจอ หน้าแสดงคูม่ อื โควิด 70 ภาพท่ี 3-53 ภาพแสดงการออกแบบหน้าจอ หน้าแสดงคู่มือการกักตัว 70 ภาพท่ี 3-54 ภาพแสดงการออกแบบหน้าจอ หน้าแสดงสถานท่ตี รวจเชอ้ื 71 ภาพท่ี 3-55 ภาพแสดงการออกแบบหนา้ จอ หนา้ แสดงโรงพยาบาลทอ่ี ยูใ่ กล้ 71 ภาพที่ 3-56 ภาพแสดงการออกแบบหนา้ จอ หนา้ ประชาสมั พนั ธ์ 72 ภาพที่ 3-57 ภาพแสดงการออกแบบหน้าจอ หนา้ แรกผใู้ ช้งาน 72 ภาพที่ 3-58 ภาพแสดงการออกแบบหน้าจอ หนา้ ตาแหน่งนักศกึ ษาทีก่ ักตวั และติดเช้อื 73 ภาพที่ 3-59 ภาพแสดงการออกแบบหนา้ จอ หนา้ ขอเปลีย่ นสถานะ 73 ภาพท่ี 3-60 ภาพแสดงการออกแบบหนา้ จอ หน้าโปรไฟลน์ กั ศึกษา 74 ภาพที่ 3-61 ภาพแสดงการออกแบบหนา้ จอ หนา้ ทาแบบฟอรม์ ประเมินความเสี่ยง 74 ภาพท่ี 3-62 ภาพแสดงการออกแบบหนา้ จอ หนา้ ระบบกกั ตัวแสดง Drawer 75 ภาพท่ี 3-63 ภาพแสดงการออกแบบหน้าจอ หนา้ ขอความช่วยเหลอื 75 ภาพท่ี 3-64 ภาพแสดงการออกแบบหนา้ จอ ขอความช่วยเหลือดา้ นอุปกรณ์ 76 ภาพท่ี 3-65 ภาพแสดงการออกแบบหน้าจอ ขอความช่วยเหลอื ดา้ นอาหาร 76 ภาพที่ 3-66 ภาพแสดงการออกแบบหน้าจอ ขอความชว่ ยเหลือด้านยารกั ษา 77 ภาพที่ 3-67ภาพแสดงการออกแบบหน้าจอ แสดงช่องทางติดต่อ 77 ภาพที่ 3-68 ภาพแสดงการออกแบบหนา้ จอ ขอเปล่ยี นสถานะ 78 ภาพที่ 3-69 ภาพแสดงการออกแบบหน้าจอ แบบฟอรม์ ขอเปล่ียนสถานะติดเช้อื 78 ภาพที่ 3-70 ภาพแสดงการออกแบบหนา้ จอ หน้าระบบติดเชอื้ แสดง Drawer 79 ภาพที่ 3-71 ภาพแสดงการออกแบบหนา้ จอ หน้าเก็บไทมไ์ ลน์ย้อนหลัง 14 วนั 79 ภาพที่ 3-72 ภาพแสดงการออกแบบหนา้ จอ ขอเปลยี่ นสถานะ 80 ภาพที่ 3-73 ฐานขอ้ มลู ทัง้ หมดของระบบ

สารบัญรูปภาพ (ตอ่ ) หนา้ 80 ภาพที่ 3-74 ส่วนของไฟล์ Model สาหรบั เกบ็ รวบรวมขอ้ มลู ใช้ติดตอ่ ฐานขอ้ มูล 81 ภาพท่ี 3-75 สว่ นของไฟล์ View สาหรบั การแสดงผลระบบ 81 ภาพที่ 3-76 สว่ นของไฟล์ Controller สาหรบั คาส่งั ตา่ ง ๆ 82 ภาพท่ี 3-77 หน้าจอหนา้ แรก 82 ภาพท่ี 3-78 ตัวอย่างส่วนแอปพลิเคชันเข้าสรู่ ะบบ 83 ภาพท่ี 3-79 หนา้ จอหนา้ เขา้ สู่ระบบ 83 ภาพที่ 3-80 ตัวอย่างส่วนแอปพลเิ คชนั การเข้าสรู่ ะบบ 84 ภาพท่ี 3-81 หน้าจอหน้าแรกของเจ้าหน้าที่ 84 ภาพท่ี 3-82 ตัวอยา่ งส่วนแอปพลิเคชนั Drawer ของเจา้ หนา้ ที่ 85 ภาพที่ 3-83 หนา้ จอหน้าแสดงสถานะนกั ศึกษาท้ังหมด 85 ภาพที่ 3-84 ตัวอย่างสว่ นแอปพลิเคชนั แสดงข้อมูลสถานะนักศกึ ษาทง้ั หมด 86 ภาพที่ 3-85 หน้าจอหนา้ แผนทแ่ี สดงตาแหนง่ ผู้ใช้งาน 86 ภาพที่ 3-86 ตวั อย่างส่วนแอปพลิเคชนั แผนทีแ่ สดงตาแหนง่ ผูใ้ ชง้ าน 87 ภาพท่ี 3-87 หนา้ จอหน้าอปั โหลดเอกสารและเพ่มิ ช่องทางเบอร์สายดว่ น 87 ภาพท่ี 3-88 ตวั อยา่ งส่วนแอปพลิเคชันการจัดการแก้ไขขอ้ มลู ผใู้ ช้งาน 88 ภาพท่ี 3-89 หน้าจอหนา้ จดั การการแจง้ เตอื น 88 ภาพท่ี 3-90 ตัวอย่างสว่ นแอปพลิเคชนั การแจง้ เตือน 89 ภาพที่ 3-91 หนา้ จอหน้าโปรไฟลเ์ จ้าหน้าท่ี 89 ภาพที่ 3-92 ตัวอย่างสว่ นแอปพลิเคชนั แสดงโปรไฟลเ์ จ้าหน้าที่ 90 ภาพที่ 3-93 หนา้ จอหน้าแก้ไขขอ้ มูลโปรไฟล์เจ้าหนา้ ที่ 90 ภาพที่ 3-94 ตวั อย่างส่วนแอปพลเิ คชันแก้ไขขอ้ มลู 91 ภาพท่ี 3-95 หน้าจอหนา้ คู่มอื โควดิ 91 ภาพท่ี 3-96 ตัวอยา่ งส่วนแอปพลเิ คชนั คูม่ ือโควิด 92 ภาพท่ี 3-97 หน้าจอหนา้ คมู่ อื การกักตัว 92 ภาพที่ 3-98 ตัวอยา่ งสว่ นแอปพลิเคชันค่มู ือการกักตวั 93 ภาพที่ 3-99 หนา้ จอหน้าสถานทตี่ รวจเชอื้ 93 ภาพท่ี 3-100 ตวั อยา่ งส่วนแอปพลิเคชนั สถานทต่ี รวจเชือ้ 94 ภาพที่ 3-101 หน้าจอหน้าแสดงโรงพยาบาลใกลฉ้ นั 94 ภาพที่ 3-102 ตัวอย่างสว่ นแอปพลิเคชันแสดงโรงพยาบาลใกล้ฉัน

สารบัญรูปภาพ (ตอ่ ) หนา้ 95 ภาพที่ 3-103 หนา้ จอหน้าแสดงการประชาสัมพันธ์ 95 ภาพท่ี 3-104 ตัวอยา่ งสว่ นแอปพลเิ คชันสาหรบั แสดงผลคาถามของแบบทดสอบ 96 ภาพที่ 3-105 หนา้ จอหน้าแสดงเบอรส์ ายดว่ น 96 ภาพที่ 3-106 ตวั อยา่ งส่วนแอปพลิเคชนั หนา้ จอแสดงเบอร์สายด่วน 97 ภาพที่ 3-107 หนา้ จอหน้าแสดงไทม์ไลน์ยอ้ นหลงั 14 วนั 97 ภาพท่ี 3-108 ตัวอย่างสว่ นแอปพลเิ คชันหน้าจอแสดงเบอรส์ ายดว่ น 98 ภาพท่ี 3-109 หนา้ จอหนา้ Drawer สาหรบั ผใู้ ช้งานปกติ 98 ภาพที่ 3-110 ตวั อย่างสว่ นแอปพลิเคชนั Drawer สาหรับผูใ้ ช้งานปกติ 99 ภาพท่ี 3-111 หนา้ จอหนา้ แรกของผู้ใชง้ าน 99 ภาพท่ี 3-112 ตัวอย่างสว่ นแอปพลิเคชันหน้าจอหน้าแรกของผใู้ ช้งาน 100 ภาพที่ 3-113 หน้าจอหน้าแสดงตาแหนง่ ของนักศึกษาทุกสถานะ 100 ภาพที่ 3-114 ตวั อย่างสว่ นแอปพลิเคชันสถานะทกุ สถานะ 101 ภาพที่ 3-115 หน้าจอหนา้ แสดงหนา้ ขอเปลย่ี นสถานะสาหรบั ผ้ใู ชง้ านปกติ 101 ภาพที่ 3-116 ตัวอย่างแอปพลเิ คชันหน้าแสดงหน้าขอเปลย่ี นสถานะสาหรบั ผใู้ ช้งานปกติ 102 ภาพท่ี 3-117 หน้าจอหนา้ แบบฟอร์มประเมนิ ความเส่ียงกักตวั 102 ภาพท่ี 3-118 ตวั อยา่ งแอปพลเิ คชนั หน้าจอหนา้ จอแบบฟอรม์ ประเมินความเสี่ยงกกั ตัว 103 ภาพท่ี 3-119 หน้าจอหนา้ แบบฟอร์มประเมินความเสยี่ งติดเชอ้ื 103 ภาพท่ี 3-120 ตัวอยา่ งแอปพลเิ คชันแบบฟอร์มประเมินความเสี่ยงตดิ เช้อื 104 ภาพที่ 3-121 หน้าจอหนา้ แสดงโปรไฟล์ของผู้ใชง้ าน 104 ภาพที่ 3-122 ตวั อยา่ งส่วนแอปพลิเคชนั แสดงโปรไฟลข์ องผ้ใู ชง้ าน 105 ภาพที่ 3-123 หน้าจอหนา้ แกไ้ ขโปรไฟล์ของผู้ใช้งาน 105 ภาพที่ 3-124 ตัวอย่างสว่ นแอปพลเิ คชนั แกไ้ ขโปรไฟล์ของผใู้ ช้งาน 106 ภาพท่ี 3-125 หนา้ จอหนา้ คมู่ ือโควดิ 106 ภาพท่ี 3-126 ตวั อยา่ งสว่ นแอปพลิเคชันหนา้ จอหน้าคู่มอื โควิด 107 ภาพท่ี 3-127 หนา้ จอหนา้ คู่มอื กักตัว 107 ภาพที่ 3-128 ตัวอยา่ งส่วนแอปพลเิ คชนั หนา้ จอคมู่ ือกักตัว 108 ภาพที่ 3-129 หน้าจอหน้าแสดงสถานทต่ี รวจเชอ้ื 108 ภาพท่ี 3-130 ตัวอยา่ งส่วนแอปพลิเคชนั หน้าแสดงสถานท่ีตรวจเชอื้ 109 ภาพที่ 3-131 หนา้ จอหนา้ แสดงโรงพยาบาลใกลฉ้ ัน

สารบญั รูปภาพ (ตอ่ ) หนา้ 109 ภาพที่ 3-132 ตัวอยา่ งส่วนแอปพลเิ คชันหนา้ จอแสดงโรงพยาบาลใกล้ฉนั 110 ภาพท่ี 3-133 หน้าจอหน้าการประชาสัมพันธ์ 110 ภาพที่ 3-134 ตวั อยา่ งสว่ นแอปพลเิ คชันหนา้ จอแสดงขอ้ มูลประชาสัมพนั ธ์ 111 ภาพที่ 3-135 หน้าจอหนา้ Drawer สาหรบั นกั ศกึ ษาสถานะกักตวั 111 ภาพที่ 3-136 ตวั อย่างสว่ นแอปพลเิ คชันหนา้ จอ Drawer สาหรบั นกั ศึกษาสถานะกกั ตัว 112 ภาพที่ 3-137 หน้าจอหน้าขอความชว่ ยเหลือสาหรบั นกั ศึกษาทกุ สถานะ 112 ภาพท่ี 3-138 ตวั อยา่ งสว่ นแอปพลเิ คชัน หนา้ ขอความชว่ ยเหลือ 113 ภาพท่ี 3-139 หนา้ จอหน้าขอความช่วยเหลือดา้ นอุปกรณ์ 113 ภาพท่ี 3-140 ตัวอย่างสว่ นแอปพลิเคชัน หนา้ ขอความช่วยเหลอื ดา้ นอปุ กรณ์ 114 ภาพที่ 3-141 หน้าจอหน้าขอความชว่ ยเหลอื ดา้ นยารักษา 114 ภาพที่ 3-142 ตวั อยา่ งสว่ นแอปพลิเคชนั หนา้ ขอความช่วยเหลือดา้ นยารักษา 115 ภาพท่ี 3-143 หน้าจอหนา้ ขอความชว่ ยเหลอื ดา้ นอาหาร 115 ภาพท่ี 3-144 ตัวอย่างส่วนแอปพลิเคชนั หน้าขอความช่วยเหลือด้านอาหาร 116 ภาพท่ี 3-145 หน้าจอหน้าแสดงเบอรต์ ดิ ต่อเจ้าหนา้ ทแี่ ละสายดว่ น 116 ภาพท่ี 3-146 ตัวอย่างสว่ นแอปพลิเคชันแสดงเบอร์ตดิ ตอ่ เจ้าหนา้ ทีแ่ ละสายดว่ น 117 ภาพท่ี 3-147 หน้าจอหน้าขอเปล่ยี นสถานะสาหรับนักศึกษากกั ตวั 117 ภาพท่ี 3-148 ตัวอยา่ งสว่ นแอปพลิเคชนั ขอเปลย่ี นสถานะสาหรับนกั ศกึ ษากักตัว 118 ภาพที่ 3-149 หน้าจอหน้า Drawer สาหรบั นกั ศึกษาสถานะติดเช้ือ 118 ภาพที่ 3-150 ตวั อยา่ งสว่ นแอปพลเิ คชัน Drawer สาหรบั นักศึกษาสถานะตดิ เช้อื 119 ภาพท่ี 3-151 หนา้ จอหน้าเกบ็ ไทมไ์ ลนย์ ้อนหลงั 14 วนั 119 ภาพท่ี 3-152 ตัวอยา่ งส่วนแอปพลเิ คชันหน้าจอเพม่ิ ข้อมลู ยอ้ นหลงั 14 วนั 120 ภาพท่ี 3-153 หนา้ จอหน้าขอเปล่ียนสถานะสาหรับนกั ศึกษาติดเชอ้ื 120 ภาพท่ี 3-154 ตัวอย่างส่วนแอปพลิเคชนั ขอเปลีย่ นสถานะสาหรบั นักศึกษาติดเชอื้ 125 ภาพที่ 3-155 การตดิ ตงั้ ระบบนสมารท์ โฟน 126 ภาพที่ 3-156 แบบประเมนิ ความพึงพอใจ 129 ภาพที่ 4-1 หนา้ จอหนา้ เขา้ สูร่ ะบบ 130 ภาพที่ 4-2 หน้าจอหน้าแรกของเจ้าหน้าท่ี 130 ภาพท่ี 4-3 หน้าจอหนา้ ระบบจดั การผูใ้ ชง้ าน 131 ภาพท่ี 4-4 หน้าจอหน้าแผนทแ่ี สดงตาแหนง่ นักศึกษา

สารบญั รูปภาพ (ต่อ) หนา้ 131 ภาพท่ี 4-5 หนา้ จอหน้าอปั โหลดเอกสารและชอ่ งทางเบอร์สายด่วน 132 ภาพที่ 4-6 หน้าจอหนา้ จดั การการแจง้ เตอื น 132 ภาพท่ี 4-7 หน้าจอหน้าโปรไฟลเ์ จ้าหนา้ ที่ 133 ภาพที่ 4-8 หนา้ จอหน้าแกไ้ ขขอ้ มูลโปรไฟล์เจา้ หน้าท่ี 133 ภาพท่ี 4-9 หน้าจอหนา้ แสดงคู่มอื โควดิ 134 ภาพท่ี 4-10 หน้าจอหน้าแสดงคู่มอื การกกั ตวั 134 ภาพท่ี 4-11 หนา้ จอหนา้ แสดงสถานที่ตรวจเชือ้ 135 ภาพท่ี 4-12 หน้าจอหน้าแสดงโรงพยาบาลใกล้ฉัน 135 ภาพที่ 4-13 หน้าจอหน้าแสดงการประชาสัมพนั ธ์ 136 ภาพท่ี 4-14 หนา้ จอหนา้ แสดงเบอร์สายด่วน 136 ภาพที่ 4-15 หน้าจอหนา้ แสดงไทม์ไลนย์ ้อนหลงั 14 วัน 137 ภาพท่ี 4-16 หนา้ จอหนา้ Drawer สาหรับผู้ใชง้ านปกติ 137 ภาพที่ 4-17 หนา้ จอหน้าแสดงหนา้ แรกของผู้ใชง้ าน 138 ภาพท่ี 4-18 หนา้ จอหน้าแสดงตาแหน่งของนกั ศกึ ษาทุกสถานะ 138 ภาพท่ี 4-19 หนา้ จอหน้าแสดงขอเปลีย่ นสถานะสาหรบั ผใู้ ชง้ านปกติ 139 ภาพที่ 4-20 หนา้ จอหนา้ แบบแสดงฟอรม์ ประเมนิ ความเส่ียงกักตวั 139 ภาพท่ี 4-21 หน้าจอหนา้ แบบแสดงฟอรม์ ประเมินความเสีย่ งตดิ เชือ้ 140 ภาพท่ี 4-22 หน้าจอหนา้ โปรไฟล์นักศึกษา 140 ภาพที่ 4-23 หน้าจอหน้าแกไ้ ขขอ้ มลู โปรไฟลเ์ จา้ หนา้ ท่ี 141 ภาพที่ 4-24 หนา้ จอหน้าแสดงคมู่ ือโควิด 103 ภาพท่ี 4-25 หน้าจอหน้าแสดงคูม่ ือกกั ตัว 142 ภาพที่ 4-26 หนา้ จอหนา้ แสดงสถานที่ตรวจเชอ้ื 142 ภาพท่ี 4-27 หน้าจอหน้าแสดงโรงพยาบาลใกล้ฉนั 143 ภาพท่ี 4-28 หน้าจอหนา้ แสดงการประชาสมั พนั ธ์ 143 ภาพที่ 4-29 หนา้ จอหนา้ Drawer สาหรับนกั ศกึ ษาสถานะกักตัว 144 ภาพที่ 4-30 หนา้ จอหน้าขอเปลี่ยนสถานะสาหรบั นักศกึ ษากักตัว 144 ภาพท่ี 4-31 หนา้ จอหนา้ Drawer สาหรบั นักศึกษาสถานะติดเช้ือ 145 ภาพท่ี 4-32 หน้าจอหนา้ เกบ็ ไทมไ์ ลนย์ อ้ นหลงั 14 วนั 145 ภาพท่ี 4-33 หนา้ จอหนา้ ขอเปลีย่ นสถานะสาหรบั นกั ศึกษาติดเชือ้

สารบัญตาราง หนา้ 24 ตารางท่ี 3-2 Actor ใน UC000 25 ตารางท่ี 3-3 Actor ใน UC100 26 ตารางท่ี 3-4 Actor ใน UC200 27 ตารางท่ี 3-5 Actor ใน UC300 28 ตารางท่ี 3-6 Actor ใน UC400 29 ตารางท่ี 3-7 Actor ใน UC500 30 ตารางท่ี 3-8 Actor ใน UC600 31 ตารางที่ 3-9 Actor ใน UC700 59 ตารางที่ 3-10 ตาราง Alert ใช้สาหรบั เกบ็ ข้อมลู การแจ้งเตอื น 59 ตารางท่ี 3-11 ตาราง Assessment ใชส้ าหรับเกบ็ ข้อมลู แบบประเมิน 59 ตารางที่ 3-12 ตาราง File ใชส้ าหรับเกบ็ ขอ้ มูลสถานะผใู้ ช้งาน 59 ตารางท่ี 3-13 ตาราง History ใชส้ าหรับเกบ็ ข้อมลู ประวตั ิการเปลย่ี นสถานะ 60 ตารางที่ 3-14 ตาราง Hotline ใชส้ าหรบั เกบ็ ขอ้ มูลสายดว่ น 60 ตารางท่ี 3-15 ตาราง Officer ใชส้ าหรบั เก็บขอ้ มูลของเจา้ หน้าที่ 60 ตารางที่ 3-16 ตาราง Student ใชส้ าหรับเก็บขอ้ มูลนักศึกษา 61 ตารางท่ี 3-17 ตาราง Timeline ใช้สาหรบั เก็บขอ้ มูลไทมไ์ ลน์ 14 121 ตารางที่ 3-18 ทดสอบการทางานระบบเขา้ ใช้งาน 121 ตารางที่ 3-19 ทดสอบการทางานระบบนกั ศึกษาสถานะปกติ 122 ตารางที่ 3-20 ทดสอบระบบกกั ตวั 122 ตารางที่ 3-21 ทดสอบระบบตดิ เช้ือ 123 ตารางท่ี 3-22 ทดสอบระบบจดั การการแจ้งเตอื น 123 ตารางที่ 3-23 ทดสอบระบบตรวจสอบ-ปรับปรุงข้อมูล 124 ตารางที่ 3-24 ทดสอบระบบการเข้าถึงขอ้ มลู นักศึกษา 124 ตารางที่ 3-25 ทดสอบระบบการเขา้ ถึงขอ้ มลู เจา้ หนา้ ท่ี 121 ตารางท่ี 4-1 ผลการประเมนิ คณุ ภาพด้านการใชง้ านของระบบ 146 ตารางท่ี 4-2 ผลการประเมนิ คณุ ภาพด้านการแสดงผล 147 ตารางที่ 4-3 ผลการประเมนิ คุณภาพดา้ นการใช้ประโยชน์ 147 ตารางที่ 4-4 ผลการประเมินคุณภาพ 3 ด้าน

บทท่ี 1 บทนา 1.1 ความเป็นมาและความสาคัญของปญั หา \"COVID-19\" (โควิด-19) เป็นโรคอุบัติใหม่ที่เร่ิมระบาดท่ัวโลกในเดือนธันวาคม ปีพ.ศ.2562 โดยไดร้ ับรายงานครง้ั แรกจากนครอฮู่ ั่น มณฑลหูเป๋ย สาธารณรัฐประชาชนจีน พบผู้ปว่ ยจานวนมากมี อาการไขส้ ูง ไอแหง้ ออ่ นเพลีย และมอี าการปอดอักเสบโดยไม่ทราบสาเหตุ อาการดังกล่าวเกิดจากโค โรนาไวรัสสายพันธุ์ใหม่ องค์การอนามัยโลกได้ประกาศช่ือโรคนี้อย่างเป็นทางการเมื่อวันท่ี 11 กุมภาพันธ์ 2563 ว่า \"Coronavirus Disease 2019\" ต่อมาพบการระบาดเป็นวงกว้างมากกว่า 100 ประเทศทั่วโลกในระยะเวลาอันรวดเร็ว (WHOThailand, 2020) และประเทศไทยได้ประกาศให้โรค ติดเช้ือไวรัสโคโรนา 2019 เป็นโรคตดิ ตอ่ อันตรายตาม พระราชบญั ญัติโรคตดิ ตอ่ พ.ศ. 2558 ที่ตอ้ งมี การเฝ้าระวัง ป้องกันและควบคุมโรคอย่างเข้มงวด โดยตรวจพบผู้ป่วยมีอัตราการติดเช้ือเพิ่มมากขึ้น ถึง 3,716 คนหรืออัตราการเพิ่มข้ึนของผู้ติดเชื้อ 10-15 คน/วัน ท้ังนี้ รัฐบาลได้ประกาศสถานการณ์ ฉุกเฉินเมื่อวนั ท่ี 25 มีนาคม 2563 เพอื่ เป็นการปอ้ งกนั และควบคุมการระบาดของโรคโควดิ -19 โดยกาหนดแนวทางการป้องกันโรคด้วยการงดการเดินทางไปท่ีชุมชน การเว้นระยะห่างทาง สังคม (Social Distancing) ใส่หน้ากากอนามัย ล้างมือบ่อย ๆ และปฏิบัติตามคาแนะนาเกี่ยวกับ อนามัยทางเดินหายใจ (กรมควบคุมโรค, 2563) สถานการณ์การระบาดดังกล่าวส่งผลต่อการดาเนิน ชีวติ ของบุคคลในสังคมหลายๆดา้ น ได้แก่ ดา้ นสงั คม ด้านเศรษฐกิจ และดา้ นการศกึ ษา การเรียนการสอนออนไลนภ์ ายใต้สถานการณร์ ะบาดไวรัส COVID-19 ท่ีไดก้ ล่าววา่ ปญั หาความ ขาดแคลนโครงสร้างพ้ืนฐานด้านเทคโนโลยเี ปน็ อปุ สรรคตอ่ การเรยี นการสอนออนไลน์ หรอื นกั ศกึ ษาที่ มีการเดินทางกลับภูมิลาเนาไม่สามารถจัดการเสียงรบกวนจากภายนอกได้ ไม่ว่าจะเป็นเสียงรบกวน จากผู้ปกครอง สภาพแวดล้อมรอบข้าง ณ ช่วงเวลาขณะนั้น เช่น เสียงรถยนต์ เสียงนกร้อง หรือเสียง สนทนาจากด้านนอก ส่งผลให้นักศึกษาเสียสมาธิจากการเรียนได้ง่าย และรวมไปถึงความไม่ เสถียรภาพของอนิ เทอรเ์ น็ต นักศึกษาบางส่วนท่ีไม่สามารถเดินทางกลับภูมิลาเนาหรือที่อยตู่ ามหอพกั น้นั สามารถจดั การเสียงรบกวนจากสภาพแวดล้อมรอบข้าง ณ ช่วงเวลานน้ั ได้ มคี วามสะดวกมากกวา่ ที่ภูมลิ าเนา แต่ท้ังนท้ี ้งั นน้ั นักศกึ ษาก็อาจจะมีความเส่ียงในการใช้ชวี ติ ประจาวันอยพู่ อสมควร การกักกันเพื่อสังเกตอาการในหอพัก รีสอร์ท (Quarantine) และการคุมไว้สังเกตเป็นการแยก ผู้เข้าพักท่ีมีสุขภาพดี ที่มาจากพ้นื ที่ที่มีการระบาดตอ่ เน่ืองของโรคติดเชื้อไวรัสโคโรนา 2019 หรือโรค โควิด-19 ตามรายงานขององค์การอนามัยโลก โดยยังไม่พ้นระยะเวลา 14 วัน รวมถึงผู้ท่ีมีประวัติ สัมผัสใกล้ชิดกับผู้ป่วยโรคโควิด-19 ในช่วงที่มีการแพร่เชื้อ จึงจาเป็นที่ต้องเฝ้าสังเกตอาการผู้สัมผัส

2 เป็นเวลา 14 วัน เพื่อให้แน่ใจว่าผู้สัมผัสไม่ติดเช้ือ หรือ ถ้ามีอาการป่วย จะได้ส่งไปตรวจรักษาที่ โรงพยาบาลได้อย่างรวดเร็วและปลอดภัย ลดการแพร่กระจายเชื้อสู่ผู้อื่น และจาเป็นต้องกักกันเพ่ือ สังเกตอาการอยา่ งนอ้ ย 14 วนั ตามมาตรการท่กี ระทรวงสาธารณสุขกาหนด ตามประกาศมหาวิทยาลัยเทคโนโลยีพระจอมเกล้าพระนครเหนือ มสี วัสดิการชว่ ยเหลอื สาหรับ นักศึกษาและบุคลากร ในช่วงการแพร่ระบาดของโรคติดเช้ือไวรัสโควดิ 19 เพือ่ เป็นการชว่ ยเหลือและ บรรเทาค่าใช้จ่ายในการรักษาพยาบาลโรคติดเช้ือไวรัสโควิด19 มหาวิทยาลัยจะจ่ายเงินช่วยเหลือ สาหรับนักศึกษาและบุคลากรท่ีตรวจพบเช้ือไวรัสโควิด19 และเข้ารับการรักษาในสถานพยาบาลจน หายเป็นปกตแิ ล้ว ในอตั ราคนละไม่เกิน 5,000 บาท โดยให้นาเอกสารใบรับรองแพทย์ มาย่ืนได้ท่ีกอง คลัง สานักงานอธิการบดี ภายในระยะเวลาไม่เกนิ 1 ปนี บั จากวันทที่ ่ปี รากฎในใบเสรจ็ รบั เงนิ จากเหตุการณ์ดังกล่าวผู้จดั ทาปริญญานิพนธ์จึงสนใจทจ่ี ะพฒั นาแอปพลิเคชันติดตามการกักตวั สถานการณ์แพร่ระบาดโควิด 19 สาหรับนักศึกษามหาวิทยาลัยเทคโนโลยีพระจอมเกล้าพระนคร เหนือ เพื่อเป็นอีกหน่ึงแนวทางการช่วยเหลือนักศึกษาที่มีความเส่ียงสูงหรือได้รับผลกระทบที่เกิดขึ้น จากการแพร่ระบาดของเช้อื โรคไวรัสโคโรนาและวิธกี ารรบั มือการกกั ตวั เพราะนกั ศกึ ษาบางคนอาจจะ ไม่ได้รับการช่วยเหลือหรืออาจจะเป็นนักศึกษาที่อยู่ตามหอพักและมีความเสี่ยงสูงจึงไม่สามารถออก จากหอพักได้ 1.2 วตั ถปุ ระสงค์ของโครงงาน เพ่ือพัฒนาแอปพลิเคชันติดตามการกักตัวสถานการณ์แพร่ระบาดโควิด 19 สาหรับ นกั ศกึ ษามหาวทิ ยาลัยเทคโนโลยีพระจอมเกล้าพระนครเหนือ เพ่ือศึกษาความพึงพอใจนักศึกษาที่มีต่อการใช้งานแอปพลิเคชันติดตามการกักตัว สถานการณ์แพร่ระบาดโควิด 19 สาหรับนักศึกษามหาวิทยาลัยเทคโนโลยีพระจอมเกล้าพระนคร เหนอื 1.3 ขอบเขตของโครงงาน ผู้จัดทาได้พัฒนาโครงงานในรูปแบบแอปพลิเคชันประเภท Native บนระบบปฏิบัติการ Android โดยมีขอบเขตดงั น้ี เจ้าหน้าท่ีมหาวิทยาลัยเทคโนโลยีพระจอมเกล้าพระนครเหนือ สามารถดูสถานะของ นกั ศกึ ษา ทัว่ ไป กกั ตวั และตดิ เชือ้ ไดแ้ ก่ ระบบลอ็ กอิน เป็นระบบท่เี ข้าใช้งานตามสิทธิก์ ารใชง้ านมีข้อมูล ดังน้ี สิทธนิ์ กั ศึกษามหาวิทยาลยั เทคโนโลยพี ระจอมเกลา้ พระนครเหนอื สิทธเิ จา้ หน้าท่ีมหาวิทยาลยั เทคโนโลยพี ระจอมเกล้าพระนครเหนอื

3 ระบบการเข้าถงึ ข้อมลู ของนกั ศกึ ษา ได้แก่ ค่มู ือโควดิ ค่มู ือการกกั ตวั สถานท่ีตรวจหาเชอื้ โควิด โรงพยาบาลทอี่ ย่ใู กล้ การประชาสมั พันธ์ของมหาวิทยาลัย เบอรส์ ายดว่ นโควิด การแกไ้ ขข้อมูลส่วนตัว ชอ่ งทางติดตอ่ เจา้ หน้าที่ ระบบกักตวั เป็นระบบสาหรับนกั ศึกษาที่ได้รบั ความเสีย่ ง ไดแ้ ก่ การขอเปลีย่ นสถานะทวั่ ไปเป็นกักตวั การขอความช่วยเหลือด้าน อปุ กรณ์ อาหาร ยารกั ษาและอ่ืน ๆ การเปลีย่ นสถานะขอความชว่ ยเหลอื เปน็ ได้รับความชว่ ยเหลือแลว้ แสดง Location คนท่ีกาลังกกั ตัวและตดิ เชือ้ ระบบตดิ เชือ้ เปน็ ระบบสาหรับนักศึกษาทต่ี ดิ เชือ้ โควดิ ได้แก่ การขอเปลี่ยนสถานะติดเชื้อโดยแนบผลตรวจไปยังเจ้าหนา้ ที่ การขอความช่วยเหลือด้าน อุปกรณ์ อาหาร ยารักษาและอืน่ ๆ การประชาสมั พนั ธเ์ กี่ยวกับการช่วยเหลือของมหาวทิ ยาลยั การขอเปลี่ยนสถานะรักษาหายแลว้ โดยแนบผลตรวจไปยังเจา้ หนา้ ที่ แสดง Location คนทกี่ าลงั กักตวั และติดเชื้อ เกบ็ ไทม์ไลนย์ ้อนหลงั 14 วนั ระบบแจง้ เตือน เปน็ ระบบที่จะแจง้ เตือนไปยังเจา้ หน้าท่ี ไดแ้ ก่ แจ้งเตอื นเม่อื นักศึกษาขอเปลย่ี นสถานะ แจง้ เตอื นเม่อื นกั ศึกษาขอความช่วยเหลอื ระบบตรวจสอบ-ปรับปรุงข้อมูล เป็นระบบท่ีเจ้าหน้าท่ีจะเปล่ียนสถานะของนักศึกษา ได้แก่ เปลย่ี นสถานะปกตเิ ป็นสถานะกักตัวโดยเจ้าหนา้ ที่ เปลยี่ นสถานะปกตเิ ป็นสถานะตดิ เช้ือโดยเจา้ หนา้ ที่ เปลยี่ นสถานะกักตัวเป็นสถานะติดเชื้อโดยเจา้ หนา้ ที่ เปล่ยี นสถานะกักตวั เปน็ สถานะปกตโิ ดยเจ้าหนา้ ท่ี เปลี่ยนสถานะตดิ เชอ้ื เปน็ สถานะปกตโิ ดยเจ้าหน้าท่ี

4 ระบบการเขา้ ถงึ ขอ้ มลู ของเจา้ หน้าท่ี ไดแ้ ก่ สามารถดจู านวนสถานะของนกั ศกึ ษาท้งั หมด สามารถดสู ถานะของนกั ศกึ ษา ปกติ กกั ตัว ติดเชื้อ สามารถดู Location ของนกั ศึกษาท่กี าลังกกั ตัวและติดเชือ้ การแจง้ เตอื นเม่อื นักศึกษาขอเปลยี่ นสถานะ การแจง้ เตือนเมือ่ นักศกึ ษาขอความช่วยเหลอื การเพ่ิม ลบ แกไ้ ขไอดไี ลน์ และเบอร์โทรศพั ทข์ องเจ้าหนา้ ท่ี 1.4 เคร่ืองมอื และอุปกรณ์ที่ใช้ในการพฒั นา โปรแกรมที่ใช้ในการพัฒนา Visual Studio Code Figma Dart Flutter Framework Google Cloud Platform Firebase API คอมพวิ เตอร์ Notebook CPU: AMD Ryzen 5 4600H RAM: DDR4 16 GB 1.5 ประโยชนท์ ี่คาดว่าจะได้รับ ได้แอปพลิเคชันติดตามการกักตัวสถานการณ์แพร่ระบาดโควิด 19 สาหรับนักศึกษา มหาวทิ ยาลัยเทคโนโลยพี ระจอมเกลา้ พระนครเหนอื นักศกึ ษามหาวิทยาลยั เทคโนโลยีพระจอมเกล้าพระนครเหนอื ไดร้ บั ความชว่ ยเหลอื มหาวิทยาลัยสามารถติดตามและช่วยเหลือนกั ศึกษาไดส้ ะดวก 1.6 ข้อจากดั ของซอฟต์แวร์ Firebase Realtime Database สาหรับเก็บข้อมูลในรูปแบบข้อความ สามารถใช้งาน แบบฟรีได้ 1GB Firebase Storage สาหรบั เกบ็ ขอ้ มลู ในรูปแบบไฟลร์ ูปภาพและ PDF สามารถใช้งานแบบ ฟรไี ด้ 5GB Google Maps Platform สาหรบั แสดงผลแผนที่ สามารถใช้งานแบบฟรีได้ 200 ดอลล่าร์ สหรัฐตอ่ เดือน หรอื โหลดหน้าแผนทไ่ี ด้ประมาณ 28,000 ครง้ั ต่อเดือน

บทที่ 2 เอกสารและงานวิจยั ที่เกย่ี วขอ้ ง ในการพัฒนาแอปพลิเคชันติดตามการกักตัวสถานการณ์แพร่ระบาดโควิด 19 สาหรับนักศึกษา มหาวิทยาลัยเทคโนโลยีพระจอมเกล้าพระนครเหนือ ผู้วิจัยได้ศึกษาตารา เอกสาร และงานวิจัยที่ เก่ียวขอ้ งเพอื่ ใชเ้ ป็นแนวทางในการศึกษาคน้ ควา้ ดงั ต่อไปนี้ 2.1 โควิด 19 2.2 หลกั การพัฒนาแอปพลเิ คชัน 2.3 เครอ่ื งมือทีใ่ ช้ในการพัฒนา 2.3.1 Visual Studio Code 2.3.2 Figma 2.3.3 Dart 2.3.4 Flutter Framework 2.3.5 Google Maps Platform 2.3.6 Firebase 2.3.7 API 2.4 บทสรุป 2.1 โควดิ 19 ความหมาย ไวรัสโคโรนาเป็นไวรัสในวงศ์ใหญ่ที่เป็นสาเหตุของโรคท้ังในสัตว์และคน ในคนนั้น ไวรัสโคโรนา หลายสายพันธ์ุทาให้เกิดโรคระบบทางเดินหายใจตั้งแต่โรคหวัดธรรมดาจนถึงโรคที่มีอาการรุนแรง เช่น โรคทางเดินหายใจตะวันออกกลาง (MERS) และโรคระบบทางเดินหายใจเฉียบพลันร้ายแรง (SARS) ไวรสั โคโรนาทคี่ ้นพบลา่ สดุ ทาให้เกดิ โรคตดิ เช้ือไวรสั โคโรนา 2019 หรอื โควดิ 19  ไวรัสโคโรนาสายพันธ์ุใหม่ 2019 (2019-nCoV) คือ ไวรัสโคโรนาสายพันธุ์ใหม่ซึ่งถูกค้นพบครั้ง แรกจากการระบาดในเมืองอู่ฮ่ัน ประเทศจีน การแพร่ระบาดของไวรัสจากคนสู่คนน้ันโดยปกติ แตกต่างกันตามชนิดของไวรัส ไวรัสบางชนิดสามารถติดต่อกันได้ง่าย ในขณะที่บางชนิดติดต่อกันได้ ยาก ปจั จุบนั นักวจิ ัยกาลังทาการศึกษาไวรัสโคโรนาสายพันธ์ใุ หม่ 2019 เพื่อให้เข้าใจการแพร่ระบาด ความรุนแรง และลักษณะอื่น ๆ ของไวรัสชนิดน้ีมากยิ่งข้ึน ซึ่งปัจจุบันมีตัวบ่งช้ีว่า ไวรัสดังกล่าว สามารถแพร่ระบาดจากคนสคู่ นได้

6 อาการโควดิ 19 ปัจจุบันประเทศไทยพบการระบาดของเชื้อโควิด-19 ท้ังสิ้น 4 สายพันธุ์ด้วยกัน ได้แก่ สายพันธุ์ เดลตา้ (อนิ เดีย) สายพนั ธ์อุ ัลฟ่า (อังกฤษ) และสายพนั ธ์ุเบตา้ (แอฟริกาใต)้ โอมิครอน แตล่ ะสายพันธุ์ จะมีประสิทธิภาพในการแพร่กระจายเชื้อที่แตกต่างกัน รวมไปถึงอาการของผู้ติดเชื้อที่พบในเช้ือชนิด หนึง่ แตก่ ลบั ไปพบในเชื้ออีกชนิดหน่งึ โควิดสายพันธุ์เดลต้า (อินเดีย) โควิดสายพันธ์ุเดลต้าทกรมวิทยาศาสตร์ การแพทย์รายงานเมื่อวันที่ 22 มิถุนายน 2564 ท่ีผ่านมา พบผู้ติดเช้ือจานวน 661 ราย โดยโควิด สายพนั ธุ์น้ีถกู ค้นพบคร้งั แรกที่ประเทศอนิ เดยี พบการแพรก่ ระจายไปแลว้ กวา่ 92 ประเทศท่ัวโลก อีกทั้งยังถูกจับตามองว่าเป็นโควิดสายพันธุ์ใหม่ที่จะมาแทนที่สายพันธ์ุอัลฟ่าท่ีกาลังเป็นสายพันธ์ุ หลักท่ีระบาดในประเทศไทยในขณะนี้ การพบเช้ือในประเทศไทยครั้งแรกท่ีบ้านพักคนงานย่านหลักส่ี ข้อมูลผู้ติดเช้ือจากการรายงานของ กรมวิทยาศาสตร์การแพทย์ (22 มิ.ย.) พบผู้ติดเชื้อจานวน 661 ราย โดยจังหวัดท่ีพบมากสุด คือ กรงุ เทพมหานคร ดงั ภาพที่ 2-1 โควดิ สายพนั ธอุ์ ลั ฟ่า (อังกฤษ) โควิดสายพันธุ์อัลฟ่า พบการติดเชื้อในประเทศไทยคร้ังแรกเม่ือวันท่ี 3 มกราคม 2564 โดยนายแพทย์ศุภกิจ ศิริลักษณ์ อธิบดีกรมวิทยาศาสตร์การแพทย์ เปิดเผยข้อมูลการรายงานของ องค์กรสาธารณสุขประเทศอังกฤษ (Public Health England) และองค์การอนามัยโลก (WHO) พบว่าสายพันธ์ุอัลฟ่า (อังกฤษ) เป็นสายพันธ์ุท่ีมีการแพร่กระจายเช้ือได้ง่ายกว่าสายพันธุ์ดั้งเดิมถึง 1.7 เทา่ อาการของสายพันธุอ์ ัลฟา่ ดงั ภาพที่ 2-2 มีไขต้ ัง้ แต่ 37.5 องศาเซลเซียสขน้ึ ไป 2.1.2.3.1 เจ็บคอ 2.1.2.3.2 หายใจหอบเหนื่อย 2.1.2.3.3 ปวดตามร่างกายและศรี ษะ 2.1.2.3.4 การรบั รสหรอื การได้รับกล่ินผิดปกติ โควดิ สายพนั ธ์เุ บต้า (แอฟริกาใต้) สายพันธุ์เบต้าพบการระบาดในประเทศไทยคร้ังแรกในพ้ืนที่ภาคใต้ จากอาเภอตากใบ จังหวัดนราธิวาส โดยได้รับเชื้อจากผู้ลักลอบเข้าเมือง และพบผู้ติดเช้ือคร้ังแรกเมื่อวันท่ี 9 มิถุนายน 2564 ที่ผ่านมานายแพทย์ศุภกิจเปิดเผยว่า สายพันธุ์เบต้ามีการแพร่กระจายเช้ือไม่รวดเร็วเท่าสาย พันธ์ุเดลต้าและอัลฟ่า แต่อย่างไรก็ตาม สายพันธุ์เบต้าอาจทาให้เกิดอาการป่วยหรือเสียชีวิตได้ มากกวา่ สายพนั ธุ์ดั้งเดมิ ดงั ภาพท่ี 2-2

7 โควิดสายพันธ์ุโอไมครอน หรือ โอมคิ รอน โอไมครอน หรือ โอมิครอน คือ โควิดกลายพันธ์ุสายพันธ์ุล่าสุดท่ีองค์การอนามัยโลก (WHO) ประกาศให้เป็นสายพันธุ์ระดับท่ีน่ากังวล ถูกค้นพบคร้ังแรกในแถบแอฟริกาใต้ในช่วงสิ้นปี 2564 ท่ีผ่านมา ปัจจุบันมีกระจายไปหลายประเทศ รวมถึงประเทศไทยที่มีอัตราการระบาดค่อนข้าง รวดเร็วหลังพบผู้ติดเช้ือชาวอเมริกันที่บินจากสเปน แวะดูไบ ก่อนเข้าไทยเมื่อวันที่ 30 พฤศจิกายน 2564 โดยสายพันธุ์นี้มีการกลายพันธ์ุส่วนโปรตีนหนามมากถึง 32 ตาแหน่ง ทาให้สามารถหลบหลีก ภูมิต้านทานได้มากขึ้น เข้าสู่ร่างกายได้ง่ายข้ึน ส่งผลต่อการลดประสิทธิภาพของวัคซีนท่ีมีอยู่ปัจจุบัน อยา่ งมาก และมีความเสย่ี งทีจ่ ะทาใหเ้ กิดการกลบั มาตดิ เช้ือซ้าเพ่มิ ข้นึ แตผ่ ปู้ ่วยมกั ตดิ เชื้อในลักษณะท่ี เปน็ ระบบทางเดนิ หายใจสว่ นบน ไม่ลงปอด จึงทาให้มีอาการป่วยไม่รนุ แรงมาก อาการเบือ้ งตน้ ของโค วดิ สายพนั ธุ์โอไมครอน หรือ โอมิครอน ดงั ภาพที่ 2-3 2.1.2.5.1 มไี ข้ต้งั แต่ 37.5 องศาเซลเซียสขึน้ ไป 2.1.2.5.2 เจ็บคอ 2.1.2.5.3 หายใจหอบเหน่อื ย 2.1.2.5.4 ปวดตามร่างกายและศรี ษะ 2.1.2.5.5 การรบั รสหรือการได้รับกล่ินผดิ ปกติ ภาพที่ 2-1 อาการโควดิ สายพันธ์ตุ า่ ง ๆ

8 ภาพท่ี 2-2 อาการโควดิ สายพันธโุ์ อไมครอน 2.2 หลกั การพัฒนาโมบายแอปพลิเคชัน การพัฒนาโมบายแอปพลเิ คชัน คือ การเขยี นซอฟตแ์ วร์สาหรบั อุปกรณพ์ กพา เช่น สมาร์ท โฟน (Smart phone) และ แท็บเล็ต (Tablet) หรือพูดกันง่ายๆ คือ การทาแอปลิเคช่ันหรือการสร้าง แอปลิเคชันสาหรับมือถือ ซ่ึงผู้พัฒนาจะเขียนแอปลิเคช่ัน เพ่ือใช้ประโยชน์จากอุปกรณ์บางอย่างของ มือถือที่มีคุณลักษณะเฉพาะ เช่น เซ็นเซอร์ตรวจจับลักษณะการเคลื่อนไหวของสมาร์ทโฟน (Accelerator Sensor), GPS และข้อมูลจากเซ็นเซอร์ตัวอ่ืน ๆ เป็นต้น ข้อเสียของการพัฒนาแอป พลิเคชันมือถือ คือ ผู้พัฒนาไม่สามารถนา source code ของระบบปฎิบัติการหน่ึงไปใช้อีก ระบบปฏิบัติการได้ ตัวอย่างเช่น source code ท่ีใช้ทาแอปพลิเคชันหรือสร้างแอปพลิเคชันด้ังเดิม สาหรับอุปกรณ์ Android ไม่สามารถทางานร่วมกับ Windows Phone โปรแกรมประยุกต์ท่ีใช้ เบราว์เซอร์ต้องมี equipment-agnostic เพื่อให้เบราว์เซอร์ทางานบนอุปกรณ์มือถือต่าง ๆได้ การพัฒนาแอปพลิเคชันหรือผลิตภัณฑ์ทางซอฟต์แวร์นั้น สามารถนากระบวนการทางวิศวกรรมที่ใช้ ในการพัฒนาผลติ ภัณฑ์ประเภทอน่ื มาประยุกต์ใชเ้ พอ่ื วางแผนการดาเนนิ งาน ซ่งึ มีข้ันตอนทวั่ ไปดังนี้

9 การศึกษาความต้องการ แอปพลิเคชันถูกสร้างขึ้นตามความต้องการและเพ่ือ แก้ปัญหาของลูกค้าหรือผู้ใช้ ผู้พัฒนาต้องทราบความต้องการหรอื ปัญหาก่อนดาเนินการออกแบบ ซ่ึงจะได้ข้อกาหนดท่ีเป็นคุณสมบัติต่าง ๆ ของแอปพลิเคชัน ซึ่งเป็นข้ันตอนที่ต้องอาศัย ประสบการณ์ของผู้พัฒนา เพ่ือให้ได้ความต้องการของลูกค้าหรือผู้ใช้ที่แท้จริง เพราะอาจมีการ สอื่ สารความต้องการที่คลาดเคลอื่ น การออกแบบ เป็นหัวใจสาคัญในการพัฒนาแอปพลิเคชัน ซึ่งค่อนข้างมีความ ซับซ้อนและมีรายละเอียดจานวนมาก ต้องอาศัยแนวคิดเชิงคานวณมาประยุกต์ใช้ในการออกแบบ อย่างเปน็ ระบบ ผลจากการออกแบบ จะได้เป็นโครงรา่ งของแอปพลเิ คชนั ทีม่ สี ว่ นประกอบยอ่ ยทม่ี ีการ กาหนดหนา้ ท่ีการทางานไว้ การลงมือพัฒนา ผู้พัฒนาหรือโปรแกรมเมอร์ (programmer) ลงมือเขียนคาสั่ง ในส่วนประกอบย่อยที่ได้ออกแบบไว้ ซ่ึงอาจพบข้อจากัดหรือข้อบกพร่องจากขั้นตอนการออกแบบ หรือข้ันตอนศึกษาความต้องการ จึงเป็นเรื่องปกติท่ีต้องย้อนกลับไปแก้ไขการออกแบบหรือศึกษา ความตอ้ งการ การทดสอบ เป็นการตรวจสอบคุณภาพของแอปพลิเคชนั เพื่อค้นหาข้อผิดพลาด ท่ีมีอยู่ระหว่างที่แอปพลิเคชันทางาน และสร้างความม่ันใจแอปพลิเคชันทางานได้ถูกต้องและตรง ความต้องการอย่างแท้จริง หากพบข้อผิดพลาด ต้องทาการปรับปรุง แก้ไข และทดสอบซ้า เพ่ือไม่ให้ เกดิ ขอ้ ผดิ พลาดระหวา่ งการใชง้ านจรงิ ซึ่งอาจทาให้เกิดความเสียหายอย่างรุนแรงตามมา ภาพที่ 2-3 ข้ันตอนการพัฒนาแอปพลเิ คชนั

10 ในแตล่ ะขั้นตอนน้ัน สามารถย้อนกลับไปปรับแก้ไขผลลัพธท์ ่ีไดใ้ นข้ันตอนก่อนหน้า โดยเฉพาะ ในกรณีท่ีลูกค้าหรือผู้ใช้มีส่วนร่วมในแต่ละขั้นตอนของการดาเนินงาน จะทาให้กาหนดความต้องการ ของแอปพลเิ คชนั ได้ชัดเจนมากยง่ิ ข้ึน และไดผ้ ลิตภัณฑซ์ อฟต์แวร์ทม่ี คี วามสามารถตรงกับตอ้ งการโดย แท้จรงิ การวางแผนพฒั นา ในการพัฒนาแอปพลิเคชนั แตล่ ะขั้นตอนมีรายละเอียดท่ีต้องจัดลาดับความสาคัญ ความ เร่งด่วน เพื่อให้การจัดสรรทรัพยากรคนและเวลา เป็นไปอย่างเหมาะสม รวมถึงต้องกาหนดบทบาท หน้าท่ีผู้รับผิดชอบ และติดตามความก้าวหน้าของการดาเนินงาน หากละเลยข้ันตอนดงั กล่าว มีความ เสี่ยงที่ทาใหก้ ารพัฒนาแอปพลิเคชันเสร็จไมท่ ันเวลา หรือมีการทางานบางอยา่ งไม่ตรงตามที่ออกแบบ ไว้ 2.3 เคร่อื งมือที่ใช้ในการพฒั นา Visual Studio Code Version 1.49.3 64Bits Visual Studio Code หรือ VSCode เป็นโปรแกรม Code Editor ที่ใช้ในการแก้ไขและ ปรับแต่งโค้ด จากค่ายไมโครซอฟท์ มีการพัฒนาออกมาในรูปแบบของ Open Source จึงสามารถ นามาใช้งานได้แบบฟรี ๆ ท่ีต้องการความเป็นมืออาชีพ ซึ่ง Visual Studio Code น้ัน เหมาะสาหรับ นักพัฒนาโปรแกรมท่ีต้องการใช้งานข้ามแพลตฟอร์ม รองรับการใช้งานท้ังบน Windows, macOS และ Linux สามารถเชื่อมต่อกับ Git ได้นามาใช้งานได้ง่ายไม่ซับซ้อนและมีเคร่ืองมือส่วนขยายต่าง ๆ ใหเ้ ลอื กใช้อยา่ งมากมาย ได้แก่ 1) การเปิดใช้งานภาษาอ่ืน ๆ ทงั้ ภาษา C++, C#, Java, Python, PHP, Go 2) Themes 3) Debugger 4) Commands ภาพท่ี 2-4 โลโกโ้ ปรแกรม Visual Studio Code

11 ภาพท่ี 2-5 หนา้ แรกของโปรแกรม Visual Studio Code Figma เป็นหนึ่งใน UI Design Tools เป็นที่นิยมที่สุดแห่งปี ที่ผู้ใช้ระบบปฏิบัติการ Windows เลอื กใช้มากท่ีสุดจากการจัดอนั ดบั ในปี 2019 ของ uxtool.co เพราะมีฟีเจอรก์ ารใช้งานทห่ี ลากหลาย อานวยความสะดวกต้ังแต่งานด้าน Graphic Design และ UX/UI Design รวมถึงการทางานร่วมกับ Develop ไดแ้ ก่ Collaborative สามารถทางานร่วมกับทมี ได้แบบ real time สามารถดภู าพจาก ภาพจะไดเ้ หน็ ถงึ ลูกศรเมา้ ส์ ของเพ่อื นในการทางานตา่ ง ๆ และสมาชิกที่ออนไลน์อยจู่ ากด้านขวา บน Comment System เม่ือต้องทางานร่วมกันกับคนอ่นื ส่ิงหนึ่งท่ีหลีกเล่ียงไมไ่ ดค้ อื การพูดคุยกันภายในทีม Figma มีระบบท่ีสามารถ comment เพื่อพูดคุยกับเพ่ือนร่วมทีมได้ เพียงแค่กดปุ่ม C หรือคล๊ิกท่ีเมนูรูป comment ด้านบน เพื่อ show comment ทั้งหมด ยังคง สามารถ comment ได้โดยการคล๊ิกท่ีพื้นที่ว่างเพื่อปักหมุดแสดงความคิดเห็น เม่ือเพ่ือนเปิด ขึ้นมาดูจะสามารถมองเห็น marker ที่ comment ไว้และตอบโต้ผ่าน comment และเมือ่ ปัญหา ถูกแกไ้ ข สามารถปดิ comment ได้เพยี งกดที่ปุ่ม resolve.

12 Component (Symbol in Sketch) สามารถสร้าง attribute ต่าง ๆ อาทิเช่น color, styles, size, picture, vector เข้าสู่ component ไว้ใช้สาหรับการใช้งานได้ และ สามารถสร้าง ลูก component (parent component) ได้โดยการ copy จาก component หลัก (master component) ที่สร้าง โดยตัวลูกจะมีความสามารถเหมือนทุกอย่างที่ component หลักมี น่ันหมายถึงว่า เมื่อมีการแก้ไขตัวที่ component หลัก ตัวลูกจะมีการ เปลย่ี นแปลงตาม Import and Export สาหรับการ import นั้น สามารถนาไฟล์.sketchเข้าสู่ Figma ได้โดยตรงเพียงแค่กดไปท่ี File > New from sketch file สาหรับการ export สามารถ ทาได้ 4 แบบคือ svg (ไฟล์ vector) png (ไฟล์รูปภาพ) png (ไฟล์รูปภาพ) และ .figma (สาหรับ backup ข้อมลู ไวใ้ นเครอ่ื ง) ภาพท่ี 2-6 โลโก้โปรแกรม Figma ภาพที่ 2-7 หนา้ แรกของโปรแกรม Figma

13 Dart Dart น้ันเป็นภาษาโปรแกรมท่ีเอาไว้สาหรับสร้างแอปพลิเคชันบนแพลตฟอร์มท่ี หลากหลายโดยได้ทั้ง mobile, desktop, server และก็ web สิ่งที่เป็นที่นิยมท่ีสุดท่ีทาให้ผู้พัฒนา สนใจมาเรียนภาษา Dart กันก็คือเพ่ือที่จะเอาไปใช้ร่วมกับ Flutter ท่ีเป็นเคร่ืองมือช่วยสร้าง UI ของ Google ซึ่งใช้ไดท้ ัง้ กับ Android และ iOS หรอื จะเป็นใน Desktop กบั Web กไ็ ด้ ภาษา Dart น้ีถูกสร้างโดย Google และปล่อยให้ใช้งานแบบ open source ทาให้ทุกคน สามารถนาไปใช้งานได้ฟรีๆ และการท่ี Dart ถูกออกแบบมาให้ใช้งานได้ง่ายและมีประสิทธภิ าพแบบภาษา เชิงวตั ถอุ ืน่ ๆอย่าง Java C# C++ จึงเปน็ ตวั เลอื กภาษาทีน่ า่ สนใจในการศึกษาเป็นภาษาแรกอกี ดว้ ย ภาพท่ี 2-8 โลโกภ้ าษา Dart Flutter Framework Flutter คือ Framework ที่ใช้สร้าง UI สาหรับ mobile application ที่สามารถทางาน ขา้ มแพลตฟอร์มไดท้ ัง้ iOS และ Android ในเวลาเดยี วกัน โดยภาษาท่ใี ชใ้ น Flutter นน้ั จะเปน็ ภาษา Dart ซ่ึงถูกพัฒนาโดย Google และท่สี าคัญคือเป็น open source ท่ีสามารถใชง้ านไดแ้ บบฟรี ๆ ตัวอย่าง syntax ของภาษา dart ท่ีใช้ใน Flutter ซ่ึงจะมีความคล้ายกับภาษา Java เนื่องจาก dart เป็นภาษาท่ีรองรับ OOP และมีแนวคิดของ class และ inheritance เช่นเดียวกับ ภาษา Java Flutter น้ันจะมี Widget พื้นฐานมาให้ เพ่ือทาให้การออกแบบ UI มีความง่าย และ สะดวกยิ่งข้ึน โดย Widget พื้นฐานของ Flutter หลัก ๆ จะมีอยู่ 2 ชนิดคือ Stateless Widget และ Stateful Widget โดยที่ Stateless Widget จะใช้สร้าง Widget ที่ไม่มีการจัดการสถานะการทางาน ใด ๆ เช่น การแสดงข้อความ, Icon หรือรูปภาพท่ีไม่มี animation เข้ามาเกี่ยวข้อง เป็นต้น ส่วน Stateful Widget จะใช้สร้าง Widget ที่มีการจัดการสถานะการทางานต่าง ๆ เช่น การสร้าง Icon ท่ี มีการใส่ animation ให้สามารถขยับไปมาได,้ ป่มุ กดตา่ ง ๆ บนหน้า UI เปน็ ต้น

14 Google Maps Platform Google Maps Platform หรือ GMP เป็น API ของ Google ที่ให้นักพัฒนาโปรแกรม หรือ Developer สามารถเรียกไปใช้งานเพื่อสร้าง Application ขององค์กรตนเอง โดย Based on Google Maps ซ่ึงรองรับการทางานทั้ง Web Application และ Mobile Application ผ่าน ระบบปฏิบัติการ iOS และ Android Google Maps Platform จะเป็น API ให้นักพัฒนาเรียกไปสร้าง Application ของตนเอง เพื่อให้กลุ่มลูกค้า หรือพนักงานขององค์กรใช้งาน โดยองค์กรนั้นๆ จะเป็น เจ้าของ Application เอง โดย API สามารถแบง่ ได้ 3 กลุม่ ไดแ้ ก่ Maps สาหรับการแสดงผลข้อมูลต่างๆ บนแผนท่ีฐานของ Google API ที่ ใหบ้ รกิ าร 2.3.5.1.1 Maps SDK for iOS & Android 2.3.5.1.2 Maps Static API 2.3.5.1.3 Maps Embed API 2.3.5.1.4 Maps JavaScript API 2.3.5.1.5 Street View API Places สาหรบั การค้นหาสถานที่ พรอ้ มรายละเอียดต่างๆ 2.3.5.2.1 Places API 2.3.5.2.2 Geocoding API 2.3.5.2.3 Geolocation API Retail แสดงตาแหน่งร้านค้า และตาแหน่งลูกค้าบนแผนท่ีเพื่อดูภาพรวมของ ธุรกิจ ในมิติที่ต่างออกไปในเชิงพ้ืนที่ เช่น ยอดขายสินค้าในแต่ละพื้นที่ พื้นท่ีไหนมีการกระจุกตัว หรือพนื้ ที่ไหนสามารถเพิ่มฐานลกู คา้ ได้ ซ่ึงจะช่วยในด้านการวเิ คราะห์ และตดั สินใจในเชงิ ธุรกิจได้ ดยี ่ิงข้นึ Logistics & Transportation สามารถติดตาม วิเคราะห์ และวางแผนเส้นทาง การขนส่งสนิ ค้า เพอ่ื จดั ลาดับการขนสง่ ทช่ี ่วยใหอ้ งคก์ รสามารถจดั การทรัพยากร และคา่ ใชจ้ ่ายท่ี เกดิ ข้นึ ใหเ้ กดิ ความคุม้ คา่ มากทสี่ ุด ได้อย่างมปี ระสทิ ธิภาพ Booking Holding แสดงตาแหน่งที่พักบนแผนท่ี พร้อมรายละเอียดข้อมูล ต่างๆ เช่น ราคา ขนาดห้อง และรูปภาพห้อง ซึ่งสามารถแสดงผลร่วมกับตาแหน่ง Facility อื่นๆ เช่น รา้ นค้า ห้างสรรพสินค้า สถานทีท่ อ่ งเที่ยวต่างๆ เพอื่ ประกอบการตัดสินใจในการเช่าหอ้ งพกั

15 ภาพที่ 2-9 โลโก้ Google Maps Platform Firebase เป็นหน่ึงในผลิตภัณฑ์ของ Google โดย Firebase คือ Platform ที่รวบรวมเคร่ืองมือ ต่าง ๆ สาหรับการจัดการในส่วนของ Backend หรือ Server side ซึ่งทาให้สามารถ Build Mobile Application ได้อย่างมีประสิทธภิ าพ และยังลดเวลาและค่าใช้จ่ายของการทา Server side หรือการ วิเคราะห์ข้อมลู ให้อกี ดว้ ย โดยมที ัง้ เคร่ืองมือทฟ่ี รี และเคร่ืองมอี ทีม่ คี ่าใช้จ่าย Firebase เป็นฐานข้อมูลเรียลไทม์ซ่ึงมี API ท่ีช่วยให้นักพัฒนาในการจัดเก็บและซิงค์ข้อมูล โดย Google Firebase 2.0 Google ไดซ้ ื้อกิจการ Firebase และมีการพัฒนาให้สามารถ จากบริการ backend เก็บข้อมูลอย่างเดียว มาเป็น แพลตฟอร์ม ครบวงจรสาหรับนักพัฒนาแอป รองรับบริการ แทบทกุ อย่างที่นกั พฒั นาแอปพลิเคชนั ใชง้ าน ภาพที่ 2-10 โลโก้ Firebase

16 ภาพที่ 2-11 หนา้ แรกของ Firebase Cloud Firestore – ใชใ้ นการจดั เก็บและซงิ ค์ขอ้ มลู ระหว่างผู้ใช้และอุปกรณใ์ นระดบั โลกโดยใช้ฐานข้อมูล NoSQL ท่ีโฮสต์บนคลาวด์ Cloud Firestore ให้การซิงโครไนซ์แบบสดและการ สนับสนุนออฟไลน์พร้อมกับการสืบค้นข้อมูลที่มีประสิทธิภาพ การผสานรวมกับผลิตภัณฑ์ Firebase อืน่ ๆ ชว่ ยให้สร้างแอปพลเิ คชันแบบไร้เซริ ฟ์ เวอร์ได้ Authentication – จดั การผู้ใช้งานดว้ ยวธิ ีท่งี า่ ยและปลอดภัย Firebase Auth โดยมี หลายวิธีในการตรวจสอบสิทธ์ิรวมถึงอีเมลและรหัสผ่านผู้ให้บริการบุคคลท่ีสามเช่น Google หรือ Facebook และใช้ระบบบัญชีที่ผู้ใช้งานมีอยู่โดยตรง สร้างอินเทอร์เฟซหรือใช้ประโยชน์จากโอเพ่น ซอร์ส UI ทปี่ รับแตง่ ไดอ้ ย่างเตม็ ท่ี Hosting – ใช้ในการลดความซับซ้อนของเว็บโฮสต้ิงของคุณด้วยเครื่องมือท่ีสร้างขึ้น เฉพาะสาหรับเว็บแอปสมัยใหม่ เมือ่ คณุ อัปโหลดเน้ือหาเว็บ Hosting จะสง่ เนือ้ หาเหล่านนั้ ไปยงั CDN ท่ัวโลกโดยอตั โนมตั ิและมอบใบรบั รอง SSL ฟรีเพ่อื ใหผ้ ูใ้ ชไ้ ด้รบั ประสบการณท์ ่ปี ลอดภัยเชอ่ื ถือไดแ้ ละ มีเวลาแฝงตา่ ไม่ว่าจะอยทู่ ่ใี ดกต็ าม Realtime Database คื อ ฐ า น ข้ อ มู ล ด้ั ง เ ดิ ม ข อ ง Firebase เ ป็ น โ ซ ลู ชั นที่ มี ประสิทธิภาพและมีเวลาแฝงต่าสาหรับแอปพลิเคชันบนอุปกรณ์เคลื่อนท่ีท่ีต้องการสถานะการซิงค์ ระหวา่ งไคลเอนตแ์ บบเรยี ลไทม์ Crashlytics – ใช้ในการลดเวลาในการแก้ไขปัญหาด้วยการเปลี่ยนข้อขัดข้องจาก หิมะถล่มให้เป็นรายการปัญหาที่จัดการได้ รับข้อมูลเชิงลึกท่ีชัดเจนและนาไปปฏิบัติได้ว่าปัญหาใดที่ ต้องจัดการก่อนโดยเห็นผลกระทบของผู้ใช้ในแดชบอร์ด Crashlytics การแจ้งเตือนแบบเรียลไทม์จะ ชว่ ยให้มีความเสถียรแม้ในขณะเดนิ ทาง เปน็ ตัวรายงานขอ้ ขัดข้องหลักของ Firebase

17 Performance Monitoring – ใช้ในการวินิจฉัยปัญหาประสิทธิภาพของแอปพลิเค ชันที่เกิดขึ้นบนอุปกรณ์ของผู้ใช้ ใช้การติดตามเพื่อตรวจสอบประสิทธิภาพของบางส่วนของแอป และดูมุมมองสรุปในคอนโซล Firebase อยู่เหนือเวลาเร่ิมต้นของแอปและตรวจสอบคาขอ HTTP โดยไม่ต้องเขยี นโค้ดใด ๆ Test Lab – ใช้ในการเรียกใช้การทดสอบอัตโนมัติและกาหนดเองสาหรับแอปพลิเค ชนั บนอุปกรณ์เสมือนจริงท่ีโฮสต์โดย Google ใช้ Firebase Test Lab ตลอดวงจรการพัฒนาของคุณ เพื่อค้นหาจุดบกพร่องและความไม่สอดคล้องกันเพื่อให้สามารถนาเสนอประสบการณ์ท่ียอดเย่ียมบน อปุ กรณห์ ลากหลายประเภท Google Analytics – ใช้ในการวิเคราะห์คุณลักษณะและพฤติกรรมของผู้ใช้ในแดช บอร์ดเดียวเพ่อื ทาการตัดสินใจ รับข้อมูลเชิงลึกแบบเรยี ลไทมจ์ ากรายงานหรือส่งออกข้อมูลเหตุการณ์ ดบิ ไปยงั Google BigQuery สาหรับการวเิ คราะหท์ ่ีกาหนดเอง Remote Config – ใช้ในการกาหนดวิธีการแสดงผลแอปพลิเคชันสาหรับผู้ใช้แต่ละ คน เปล่ียนรูปลักษณ์เปิดตัวฟีเจอร์ทีละน้อยเรียกใช้การทดสอบ A / B ส่งมอบเนื้อหาท่ีกาหนดเอง ให้กับผู้ใช้บางรายหรือทาการอัปเดตอ่ืน ๆ โดยไม่ต้องปรับใช้เวอร์ชันใหม่ทั้งหมดนี้ทาได้จากคอนโซล Firebase ตรวจสอบผลกระทบของการเปลี่ยนแปลงและทาการปรับเปล่ียนในเวลาไม่ก่นี าที Cloud Messaging – ใช้ในการส่งข้อความและการแจ้งเตือนไปยังผู้ใช้ข้าม แพลตฟอร์มทั้ง Android, iOS และเว็บได้ฟรี สามารถส่งข้อความไปยังอุปกรณ์เดียว กลุ่มอุปกรณ์ หรือหัวข้อเฉพาะหรือกลุ่มผู้ใช้ Firebase Cloud Messaging (FCM) ปรับขนาดเป็นแอปพลิเคชันที่ ใหญ่ทีส่ ุดโดยสง่ ขอ้ ความหลายแสนล้านข้อความตอ่ วัน API API ย่อมาจาก Application Programming Interface คือการเช่ือมต่อจากระบบหนึ่ง ไปสู่อีกระบบหนึ่ง เพ่ือให้ซอฟตแ์ วร์ภายนอกเขา้ ถึงและอพั เดทข้อมลู น้ันๆได้ แตย่ ังอยู่ในขอบเขตท่ถี กู กาหนดไว้ API เป็นตัวกลางที่จะทาให้คอยรับคาสั่งต่าง ๆ ประมวลผลและกระทาข้อมูลส่งกลับคืนไป ยังคนสั่งโดยอัตโนมัติ บริษัทหรืออุตสาหกรรมต่าง ๆ เร่ิมนา API เข้ามาใช้งาน ท้ังนี้ก็เพื่อการอานวย ความสะดวก ลดกาลังคน และลดความผิดพลาดลง ประโยชน์ของการส่ง API มีดังนี้ 2.3.7.1.1 ช่วยเปน็ สอ่ื กลางส่งขอ้ มลู ข้าม Server 2.3.7.1.2 ลดการใช้กาลงั คน ดว้ ยการใชเ้ ทคโนโลยี 2.3.7.1.3 สอื่ สารกับลูกค้าไดร้ วดเร็วข้นึ 2.3.7.1.4 ไมต่ อ้ งทางานข้ามเว็บไซต์ และใช้งานในเวบ็ ไซตท์ ี่มี API เดียวก็พอ

18 2.3.7.1.5 ผู้ใช้มีความสะดวกสบายมากข้ึน ไม่ต้องใช้ tools ในการทางานให้ ซับซ้อน 2.4 สรุปผล จากการศึกษาเอกสารและทฤษฎีที่เกี่ยวข้องสรุปได้ว่าจากการแพรร่ ะบาดของโรคโควิด19 ทาให้ มีผู้ติดเชื้อเปน็ จานวนมากจนเกิดเหตุการณ์เตียงผู้ป่วยในโรงพยาบาลไม่เพยี งพอ ทาให้ผู้ป่วยตอ้ งแยก กักตัวในโรงพยาบาลสนาม หรือบางคนอาจจะทา Home Isolation ผู้พัฒนาจึงเห็นว่าหากพัฒนา แอปพลิเคชันติดตามการกักตัวสถานการณ์แพร่ระบาดโควิด 19 สาหรับนักศึกษามหาวิทยาลัย เทคโนโลยีพระจอมเกล้าพระนครเหนือ จะสามารถให้ความช่วยเหลือแก่ผู้ท่ีติดเชื้อโควิดหรือผู้ที่มี ความเสี่ยงจะติดเช้ือได้บ้าง โดยเร่ิมจากกลุ่มนักศึกษาของมหาวิทยาลัยเทคโนโลยีพระจอมเกล้าพระ นครเหนือและได้แนวทางการพัฒนา ในรูปแบบของแอปพลิเคชันในโทรศัพท์มือถือโดยใช้โปรแกรม Visual Studio Code, Flutter Framework, Google Map Platform, ใช้ภาษา Dart ในการพัฒนา แอปพลเิ คชันและใช้ Firebase ในการเก็บข้อมลู

บทที่ 3 วิธกี ารดาเนนิ งาน ในการพัฒนาแอปพลิเคชนั ตดิ ตามการกักตวั สถานการณ์แพร่ระบาดโควิด 19 สาหรับนักศึกษา มหาวิทยาลัยเทคโนโลยีพระจอมเกล้าพระนครเหนือจะเป็นการดาเนินการสร้างเพื่อนาแอปพลิเคชัน ไปทดลองใช้งานหาประสิทธิภาพของแอป โดยดาเนินการวางแผนและออกแบบระบบ ถึงการพัฒนา ระบบ สามารถแบ่งขน้ั ตอนการดาเนนิ งานไดด้ งั นี้ 3.1 ศกึ ษาข้อมูลและเอกสารท่ีเกีย่ วขอ้ ง 3.2 กาหนดปัญหาของการพัฒนาระบบ 3.3 วิเคราะห์ความตอ้ งการของระบบ 3.4 ออกแบบระบบ 3.5 พฒั นาระบบ 3.6 ทดสอบระบบ 3.7 ทดลองใช้ 3.8 สรปุ ผลและจัดทาเอกสาร การพัฒนาแอปพลิเคชันติดตามการกักตัวสถานการณ์แพร่ระบาดโควิด 19 สาหรับนักศึกษา มหาวิทยาลัยเทคโนโลยีพระจอมเกล้าพระนครเหนือมีข้ันตอนการดาเนินงานคือศึกษาข้อมูลและ เอกสารท่ีเก่ยี วข้องกับการพัฒนาแอปพลิเคชัน การกาหนดปัญหาของระบบหรือกาหนดความต้องการ ของระบบ จากนั้นวิเคราะห์ระบบโดยแบ่งออกเป็น 2 ส่วนคือ เจ้าหน้าที่ และผู้ใช้งาน แล้วนาข้อมูล มาออกแบบระบบ ได้แก่ การออกแบบหน้าจอ และทาการพัฒนาระบบด้วย Flutter Framework พร้อมกับทดสอบระบบที่ได้จัดทาข้ึนในด้านการแสดงผล การทางานเป็นต้น เมื่อพัฒนาแอปพลิเคชัน เสร็จสิ้นแล้วทาการทดลองใช้งานโดยผู้ทดลองใช้งานและประเมิน ผู้ประเมินเป็นนักศึกษาคณะครุ ศาสตร์อุตสาหกรรม สาขาวิชาเทคโนโลยีคอมพิวเตอร์ภาควิชาคอมพิวเตอร์ศึกษาจานวน 5 คนและ อาจารย์ประจาภาควิชาจานวน 2 ท่านจากน้ันจัดทาเอกสารปริญญานิพนธ์ ซึ่งข้ันตอนการทางาน สามารถอธบิ ายเปน็ ขัน้ ตอนการทางานดงั ภาพที่ 3-1

20 ภาพท่ี 3-1 ข้นั ตอนการพัฒนาแอปพลิเคชนั ตดิ ตามการกกั ตัวสถานการณ์แพร่ระบาดโควดิ 19 สาหรบั นักศึกษามหาวทิ ยาลัยเทคโนโลยพี ระจอมเกลา้ พระนครเหนือ

21 3.1 ศึกษาข้อมลู และเอกสารท่ีเกี่ยวขอ้ ง ศึกษารวมรวบเอกสารและขอ้ มลู ต่าง ๆ ทเี่ ก่ยี วขอ้ งในการพฒั นาแอปพลเิ คชนั ติดตามการกกั ตวั สถานการณ์แพร่ระบาดโควิด 19 สาหรับนักศึกษามหาวิทยาลัยเทคโนโลยีพระจอมเกล้าพระนคร เหนือ ในรูปแบบของเว็บแอปพลิเคชัน พร้อมกับศึกษางานวิจัยอ่ืน ท่ีมีเน้ือหาที่สอดคล้องกับการ พฒั นา โดยศึกษาข้อมูลเก่ียวกับภาษาท่ีใช้ในการพัฒนาเวบ็ แอปพลเิ คชัน และข้อมูลทเี่ ก่ียวกับ Covid 19 ทีจ่ ะใชเ้ ผยแพร่ภายในแอปพลิเคชัน เพอ่ื เพม่ิ ช่องทางการช่วยเหลือนกั ศกึ ษา ศึกษาขอ้ มูลทั่วไป ศึกษาข้อมูลและวิธีการออกแบบระบบของแอปพลิเคชัน ท่ีให้บริการเก่ียวกับ Covid 19 หรือเป็นแอปสาหรับเพ่ิมช่องทางการช่วยเหลือให้กับนักศึกษา ทั้งในเรื่องของการขอความช่วยเหลือ ในด้านต่าง ๆให้กับนักศึกษาได้แก่ การกักตัว 14 วัน การช่วยเหลือนักศึกษาที่ติดเชื้อ การเพิ่มการ ประชาสัมพันธ์และข้อมูลท่ีเก่ียวข้องกับ Covid 19 เพื่อนาข้อมูลจากแอปพลิเคชันท่ีให้บริการอยู่ใน ปัจจุบนั มาปรบั ใชเ้ ว็บแอปพลเิ คชนั ท่ไี ดท้ าการศึกษามี ดงั นี้ หมอพร้อม ซ่ึงเป็น LINE Official Account และแอปพลิเคชัน ท่ีจัดทาขึ้น เพ่ือให้ประชาชนเข้าถึงข้อมูลสถานการณ์การระบาดของโรค โควิด-19 อย่างถกู ต้อง Jitasa.care เป็นแพลตฟอร์มแผนท่ีเพ่ือสนับสนุนข้อมูลและการให้ความ ช่วยเหลอื ในสถานการณ์โควดิ -19 ddc.moph.co.th เว็บไซต์ของการควบคุมโรคเป็นหนึ่งในหน่วยงานราชการ ท่ีมีความสาคัญต่อการพัฒนาสุขภาพของประชาชน ที่มุ่งเน้นการเป็นผู้นาด้านวิชาการและ เทคโนโลยกี ารปอ้ งกนั และควบคมุ โรคของประเทศและระดบั นานาชาติ สรปุ ได้ดังนี้ ศึกษาขอ้ มลู ด้านภาษาทใี่ ชใ้ นการพัฒนา จากการศึกษาการพฒั นาแอปพลิเคชันด้วย Flutter Framework มีความสะดวก และใช้งานค่อนข้างง่าย และการ Build Application ยังสามารถทาได้ง่ายกว่าการ Deploy Web Application เนื่องจากเป็น Framework ของภาษา Dart ผู้จัดทามีพื้นฐานในการพัฒนา แอปพลเิ คชนั ดว้ ยภาษา Dart จึงไดน้ า Flutter มาพฒั นาแอปพลเิ คชนั ในครั้งน้ี ศึกษา Widget ท่ีใช้ในการตกแต่งแอปพลิเคชัน ให้อยู่ในรูปแบบท่ีได้ออกแบบ ดว้ ย Widget ทม่ี อี ยู่ใน Flutter Framework ศกึ ษาการจดั การข้อมลู ท่เี กี่ยวกับฐานขอ้ มูลด้วย Firebase เช่น การเรยี กรายการ ขอ้ มลู แสดง การจดั เกบ็ ขอ้ มลู แบบ Realtime โดย Realtime Database ศกึ ษาการเร่อื ง API

22 ศกึ ษาข้อมูลดา้ นซอฟต์แวร์ ได้แก่ การใช้ Android Studio ในการจาลอง Android การใช้ Visual Studio Code ในส่วนเสริมของ Extension ที่ช่วยอานวยความ สะดวกในการพัฒนาแอปพลิเคชัน 3.2 กาหนดความตอ้ งการของการพัฒนาระบบ การจัดทาแอปพลิเคชันติดตามการกักตัวสถานการณ์แพร่ระบาดโควิด 19 สาหรับนักศึกษา มหาวิทยาลัยเทคโนโลยีพระจอมเกล้าพระนครเหนือ เพื่อเพิ่มช่องทางการช่วยเหลือให้กับนักศึกษา มหาวิทยาลยั เทคโนโลยีพระจอมเกล้าพระนครเหนอื มดี งั น้ี เขา้ สูร่ ะบบด้วยอีเมล์ของนกั ศึกษามหาวิทยาลัยพระจอมเกลา้ พระนครเหนือ ข้อมูลเกี่ยวกับโควิดค่อนข้างกระจายอยู่บนอินเทอร์เน็ต จึงควรรวบรวมข้อมูลเกี่ยวกับโค วดิ และการกกั ตัวใหอ้ ยู่ในแอปพลิเคชันในลกั ษณะของ PDF ไฟล์ หากผู้ใช้งานต้องการเปลี่ยนสถานะจะต้องทาการขอเปลี่ยนสถานะไปยังเจ้าหน้าท่ีเพ่ือ ป้องกันการเปลีย่ นสถานะโดยไมไ่ ด้ตง้ั ใจของนกั ศกึ ษา การแสดงสถานที่รักษาท่ีอยู่ใกล้เพ่ือให้นักศึกษาท่ีมี ความเสี่ยงหรือติดเชื้อสามารถดู สถานทรี่ ักษาจากแอปพลเิ คชนั ได้ นักศึกษาสามารถทราบถึงการประชาสัมพันธ์เกี่ยวกับการช่วยเหลือและประกาศต่าง ๆท่ี เกย่ี วกับโควิด 19 ของทางมหาวทิ ยาลัยไดผ้ า่ นแอปพลเิ คชัน การเปลี่ยนสถานะติดเช้ือจะต้องมีรูปภาพ ATK ผลบวกหรือเอกสารผลการตรวจ ประกอบด้วย เป็นต้น เพ่ิมช่องทางการติดต่อกับเจ้าหน้าท่ี เช่น เบอร์โทรศัพท์ และไอดีไลน์ เพื่อให้นักศึกษา สามารถติดต่อกับเจ้าหนา้ ทขี่ องมหาวิทยาลัยได้สะดวกข้ึน ส่วนของแอปพลิเคชันสามารถใช้งานได้เฉพาะระบบ Android เนื่องจากหากต้องการ พัฒนาลงบนระบบ iOS จะต้องใช้เครอื่ ง Mac ในการพฒั นา 3.3 วเิ คราะหค์ วามตอ้ งการของระบบ ความต้องการของระบบ จากการวิเคราะห์ความตอ้ งการของระบบหรือปัญหาท่ีไดก้ าหนดมาข้างต้น พบวา่ ระบบมี การแบ่งสทิ ธใ์ิ นการเข้าถงึ ขอ้ มลู อย่างชัดเจนในส่วนของ นกั ศกึ ษาและเจา้ หน้าท่ี สามารถสรปุ ขอบเขต ของแอปพลิเคชัน ไดด้ งั น้ี

23 รายละเอียดสว่ นของเจ้าหนา้ ที่ ก) ส่วนของแอปพลเิ คชันสามารถใช้งานได้เฉพาะ Android ข) การเข้าสู่ระบบ ผู้ใช้งานสามารถเข้าสู่ระบบเพื่อทาการเข้าใช้งานแอปพลิเคชัน โดยใชอ้ เี มล์นักศกึ ษาในการเขา้ สรู่ ะบบ ค) การดจู านวนสถานะของนกั ศึกษาทัง้ หมด ง) การเพ่ิมข้อมูล เจ้าหน้าท่ีสามารถเพ่ิมข้อมูลข่าวการประชาสัมพันธ์ เบอร์ โทรศพั ท์ ไอดไี ลนข์ องเจา้ หน้าท่ี เป็นตน้ จ) การลบข้อมูล เจ้าหน้าท่ีสามารถลบข้อมูลต่าง ๆ ได้ เชน่ ข้อมูลผู้ใช้งาน สถานะ ของนกั ศกึ ษา เบอร์โทรศัพทข์ องเจ้าหนา้ ท่ี ไอดไี ลน์ของเจา้ หนา้ ที่ เปน็ ต้น ฉ) การเพิ่มเอกสารในรูปแบบของไฟล์ PDF เจ้าหน้าที่สามารถเพิ่มเอกสาร PDF ไดโ้ ดยแตล่ ะไฟลจ์ ะถกู นาไปแสดงผลใหก้ บั ผใู้ ช้งาน เปน็ ตน้ ช) การลบเอกสารในรูปแบบของไฟล์ PDF เจ้าหน้าท่ีสามารถลบเอกสาร PDF ได้ โดยแต่ละไฟล์จะถกู นาไปแสดงผลใหก้ ับผู้ใช้งาน เปน็ ต้น รายละเอยี ดของนกั ศึกษา ก) การส่วนของแอปพลเิ คชันสามารถใช้งานได้เฉพาะ Android ข) การเข้าสู่ระบบ ผู้ใช้งานสามารถเข้าสู่ระบบเพ่ือทาการเข้าใช้งานแอปพลิเคชัน โดยใช้อเี มลน์ ักศึกษาในการเข้าสู่ระบบ ค) การข้อมูลส่วนตัว ผู้ใช้งานสามารถแก้ไขข้อมูลส่วนตัวได้ เช่น ท่ีอยู่ เบอร์ โทรศพั ท์ ง) การสถานะ เม่ือผู้ใช้งานเข้าสู่ระบบระบบจะแสดงสถานะปกติ หากผู้ใช้งาน ต้องการเปล่ียนสถานะจะตอ้ งทาการขอการเปลี่ยนสถานะไปยังเจ้าหน้าที่ จ) การดูเอกสารเก่ียวกับโควิด 19 ผู้ใชง้ านสามารถดขู อ้ มูลทเ่ี กยี่ วกบั โควิด 19 ใน ลักษณะของ PDF ไฟล์ วิเคราะห์ระบบ ในการพัฒนาแอปพลิเคชันติดตามการกักตัวสถานการณ์แพร่ระบาดโควิด 19 สาหรับ นักศึกษามหาวิทยาลัยเทคโนโลยีพระจอมเกล้าพระนครเหนือผู้จัดทาได้วิเคราะห์ระบบต่าง ๆ โดย แบง่ การใชง้ านออก ดังนี้

24 Use Case Diagram สาหรับอธบิ ายการทางานแตล่ ะระบบ เจา้ หนา้ ที่ ระบบแอพพลิเคช่นั กักตัวนักศกึ ษา มจพ นกั ศึกษา 100 ระบบเข้าใชง้ าน 200 ระบบเขา้ ถงึ ขอ้ มลู นักศกึ ษา 300 ระบบกักตัว 400 ระบบติดเชอื้ 500 ระบบแจง้ เตอื น 600 ระบบตรวจสอบ-ปรับปรุงขอ้ มูล 700 ระบบการเข้าถงึ ข้อมูลเจา้ หน้าท่ี ภาพท่ี 3-2 แอปตดิ ตามการกักตัวสถานการณ์แพรร่ ะบาดโควิด 19 นักศึกษา มหาวิทยาลยั เทคโนโลยีพระจอมเกลา้ พระนครเหนือ ตารางที่ 3-1 Actor ใน UC000 Actor คาอธิบาย เจ้าหน้าที่ ผู้เกี่ยวข้องกับระบบงานเป็นเจ้าหน้าที่ เช่นระบบกักตัว ระบบติดเช้ือ ระบบแจ้งเตือน ระบบตรวจสอบ-ปรับปรุงข้อมูล และระบบการเข้าถึง ขอ้ มูลเจา้ หนา้ ทเ่ี ป็นตน้ เป็นต้น ผใู้ ชง้ าน ผู้ เ กี่ ย ว ข้ อ ง กั บ ร ะ บ บ ง า น เ ป็ น ผู้ ใ ช้ ง า น ร ะ บ บ คื อ นั ก ศึ ก ษ า ข อ ง มหาวิทยาลัยเทคโนโลยีพระจอมเกลา้ พระนครเหนือ

25 ระบบเขา้ ใชง้ าน 101 ระบบเข้าใช้งาน เจ้าหน้าท่ี นักศึกษา ภาพท่ี 3-3 UC100 แสดงการทางานของระบบลงช่อื เขา้ ใชง้ าน ตารางที่ 3-2 Actor ใน UC100 Actor คาอธบิ าย เจ้าหนา้ ที่ เจา้ หนา้ ทีส่ ามารถลงชื่อเขา้ ใชง้ านได้ ผใู้ ช้งาน ผู้ใช้งานระบบสามารถลงชื่อเขา้ ใชง้ านได้

26 เจา้ หนา้ ที่ ระบบเขา้ ถึงข้อมลู นกั ศึกษา นักศึกษา 201 คูม่ อื โควิดและประชาสมั พันธ์ 202 เพม่ิ คู่มอื โควิดและประชาสมั พนั ธ์ 203 ลบค่มู ือโควดิ และประชาสัมพันธ์ 204 สถานท่ตี รวจเชอื้ โควดิ 205 โรงพยาบาลท่อี ย่ใู กล้ 206 เบอร์สายดว่ นและชอ่ งทางติดต่อ 207 แกไ้ ขขอ้ มูลสว่ นตวั ภาพที่ 3-4 UC200 แสดงการทางานของระบบเขา้ ถึงข้อมูลของนักศึกษา ตารางที่ 3-3 Actor ใน UC200 Actor คาอธบิ าย เจา้ หนา้ ท่ี เจ้าหน้าท่ีสามารถเข้าถึงเพิ่มและลบข้อมูลของคู่มือโควิด และ ประชาสัมพันธ์เรื่องต่าง ๆ ได้แก่ สถานที่ตรวจเชื้อ โรงพยาบาลที่อยู่ ใกล้ เบอร์สายดว่ นและชอ่ งทางการติดตอ่ และสามารถเพิ่ม/ลบคูม่ ือโค วิดและประชาสมั พนั ธไ์ ด้ ผใู้ ช้งาน ผู้ใช้งานระบบสามารถเข้าถึงข้อมูลของคู่มือโควิด สถานท่ีตรวจเช้ือ โรงพยาบาลท่ีอยู่ใกล้ เบอร์สายด่วนและช่องทางการติดต่อ ผู้ใช้งาน สามารถแกไ้ ขข้อมลู ส่วนตวั ของตนเองได้

เจา้ หน้าท่ี ระบบกักตัว 27 301 นักศกึ ษา ขอเปล่ยี นสถานะ 302 ขอความชว่ ยเหลือดา้ นอุปกรณ์ อาหาร และยา 303 เปลีย่ นสถานะขอความชว่ ยเหลอื 304 โลเคชน่ั คนทีก่ าลังกกั ตวั 305 คู่มือกกั ตวั 306 เพม่ิ คู่มอื กกั ตวั 307 ลบคมู่ อื กกั ตวั ภาพที่ 3-5 US300 แสดงการทางานของระบบกกั ตวั ตารางท่ี 3-4 Actor ใน UC300 Actor คาอธบิ าย เจ้าหน้าท่ี เจ้าหน้าท่ีจะสามารถ เปลี่ยนสถานะของผู้เข้าใช้งานได้ เข้าถึงข้อมูล โลเคชัน่ คนที่กาลังกกั ตัว คมู่ ือกักตวั และสามารถเพ่ิม/ลบ ค่มู อื กักตวั ได้ ผใู้ ชง้ าน ผู้ใช้งานระบบสามารถขอเปลี่ยนสถานะ ขอความช่วยเหลือด้าน อุปกรณ์ ยา และอาหารสามารถเข้าถึงโลเคชั่นท่ีกาลังกักตัว และคู่มือ กกั ตัวได้

28 ระบบตดิ เชื้อ 401 ขอเปลย่ี นสถานะตดิ เชื้อ 402 ขอความช่วยเหลือดา้ นอุปกรณ์ อาหาร และยา 403 ขอเปล่ยี นสถานะรักษาหายแล้ว 404 โลเคช่นั คนท่ีกาลงั กกั ตัว ติดเชือ้ เจา้ หนา้ ท่ี 405 นกั ศึกษา เกบ็ ไทม์ไลนย์ ้อนหลงั 14 วนั ภาพท่ี 3-6 UC400 แสดงการทางานของระบบตดิ เชื้อ ตารางท่ี 3-5 Actor ใน UC400 Actor คาอธิบาย เจ้าหนา้ ท่ี เจ้าหน้าที่จะสามารถ เข้าถึงโลเคชันและการเก็บไทม์ไลน์ของผู้เข้าใช้ งานได้ เข้าถึงข้อมูลโลเคชั่นคนท่ีกาลังกักตัว และไทม์ไลน์ย้อนหลัง14 วนั ได้ ผ้ใู ช้งาน ผู้ใช้งานระบบสามารถขอเปลี่ยนสถานะ ขอความช่วยเหลือด้าน อุปกรณ์ ยา และอาหารสามารถเข้าถึงโลเคช่ันท่ีกาลังกักตัว ติดเชื้อ และสามารถเก็บไทมไ์ ลน์ย้อนหลงั 14วันได้

29 ระบบแจ้งเตอื น 501 ยืนยันการเปลีย่ นสถานะ 502 รบั คาขอความช่วยเหลอื เจา้ หน้าที่ ภาพท่ี 3-7 UC500 แสดงการทางานของระบบแจง้ เตือน ตารางที่ 3-6 Actor ใน UC500 Actor คาอธิบาย เจา้ หนา้ ที่ เจ้าหน้าท่ีจะสามารถรับการแจ้งเตือนการยืนยันเปล่ียนสถานะ และ รับคาขอความช่วยเหลือได้

30 ระบบตรวจสอบ - ปรบั ปรงุ ข้อมลู 601 เปล่ยี นสถานะปกติเปน็ กกั ตวั 602 เปลย่ี นสถานะปกติเปน็ ติดเช้อื 603 เปลีย่ นสถานะกักตวั เปน็ ติดเช้อื 604 เปลยี่ นสถานะกักตวั เป็นปกติ เจ้าหนา้ ท่ี 605 เปล่ียนสถานะติดเชอ้ื เป็นกาลงั รักษา 606 เปล่ียนสถานะกาลงั รักษา เป็นรกั ษาหายแลว้ ภาพท่ี 3-8 UC600 แสดงการทางานของระบบตรวจสอบ - ปรบั ปรงุ ข้อมลู ตารางท่ี 3-7 Actor ใน UC600 Actor คาอธิบาย เจา้ หนา้ ที่ เจ้าหน้าท่ีจะสามารถ เปล่ียนสถานะของนักศึกษาจากสถานะปกติเป็น กักตัว สถานะปกติเป็นติดเช้ือ สถานะกักตัวเป็นติดเช้ือ สถานะกักตัว เป็นปกติ สถานะติดเช้ืออเป็นกาลังรักษา สถานะกาลังรักษาเป็นรักษา หายแลว้

31 เจา้ หน้าที่ ระบบการเข้าถึงข้อมูลเจา้ หน้าที่ 701 เปลยี่ นสถานะของนักศกึ ษา 702 โลเคชนั่ นักศึกษา 703 แจ้งเตอื น 704 เพ่ิมชอ่ งทางตดิ ต่อเจ้าหน้าที่ 705 ลบชอ่ งทางตดิ ต่อเจ้าหนา้ ที่ 706 แก้ไขชอ่ งทางตดิ ต่อเจา้ หนา้ ท่ี 707 เพ่ิมเบอร์สายดว่ น 708 ลบเบอรส์ ายด่วน 709 แก้ไขเบอรส์ ายด่วน ภาพท่ี 3-9 UC700 แสดงการทางานของระบบการเขา้ ถงึ ข้อมลู เจา้ หนา้ ท่ี ตารางท่ี 3-8 Actor ใน UC420 Actor คาอธิบาย เจ้าหน้าที่ เจ้าหน้าท่ีจะสามารถ เปลี่ยนสถานะของนักศึกษา เข้าถึงโลเคชันของ นักศึกษา รับการแจ้งเตือน เพ่ิม/ลบ/แก้ไข ช่องทางติดต่อเจ้าหน้าที่ และเบอรส์ ายด่วน

32 3.4 ออกแบบระบบ สถาปัตยกรรมระบบ Google Map Api Application Flutter Framework Internet Covid Api Firebase Auth Firebase Firebase Storage Firebase RealTime Database ภาพท่ี 3-10 แผนผังแสดงการทางานโดยรวมของระบบ จากภาพท่ี 3-2 แผนผังแสดงการทางานโดยรวมของระบบโดยแสดงถึงข้ันตอนการ เรียกใช้ข้อมูล เม่ือมีการเข้าใช้งานระบบจากอุปกรณต์ ่าง ๆ เริ่มต้นท่ีการเข้าถงึ ดว้ ย Application โดย Flutter Framework จะอยู่ในส่วนของ Front-End และใช้ Internet เป็นตวั กลางในการรับส่งขอ้ มลู และเรียกใช้ฟังก์ชันต่าง ๆ ซ่ึงข้อมูลทั้งหมดของระบบจะถูกจัดเก็บไว้ที่ ฐานข้อมูล รวมถึงการขอ เปลีย่ นสถานะ โดยฐานข้อมลู ทน่ี ามาใช้คอื Firebase Realtime Database และ Firebase Storage ซ่ึงแอปพลิเคชนั จะทาการติดต่อกับฐานข้อมูลของ Firebase มาประมวลผลกับคาร้องขอของผู้ใช้งาน เม่อื ประมวลผลแล้วจะทาการส่งข้อมลู ทผ่ี ใู้ ช้งานตอ้ งการกลบั ไปยงั แอปพลเิ คชันที่ใชง้ านอย่ใู นขณะนั้น

33 Flowchart ขัน้ ตอนแสดงการใช้งานในระบบ สว่ นของหนา้ เข้าใช้งานระบบ เริ่มต้น เลอื กหน้าเข้าส่รู ะบบ กรอกขอ้ มูลบญั ชี Google ไม่ Email หรอื Password ใช่ ไมถ่ ูกต้อง บัญชี Google = มจพ. วทิ ยาเขตกรงุ เทพ เข้าสู่หน้าแรก จบการทางาน ภาพที่ 3-11 Flowchart ขนั้ ตอนเข้าใชง้ านระบบ จากภาพที่ 3-11 แสดงข้ันตอนเข้าใช้งานระบบ ผู้ใช้งานจะต้องเลือกหน้าเข้าสู่ระบบและ กรอกข้อมูลบญั ชี Google ซึ่งเปน็ บญั ชขี องนักศึกษามหาวิทยาลัยเทคโนโลยีพระจอมเกล้าพระนคร เหนือวิทยาเขตกรุงเทพให้ครบถ้วน จากนั้นกดยืนยันการเข้าสู่ระบบหากรหัสผ่าน ไม่ถูกต้องระบบ จะขึ้นแจง้ เตือนบนหนา้ จอและให้กรอกขอ้ มูลใหม่ หากขอ้ มลู ตรงกันจะทาการบันทกึ ข้อมูลและเข้าสู่ ระบบแสดงหนา้ แรกโดยอัตโนมตั ิ

34 สว่ นของการตรวจสอบสิทธิ์การเข้าถึง เริม่ ตน้ กรอก Email,Password @ส่วนงาน Email ไม่ Email หรือ Password มจพ. วทิ ยาเขตกรงุ เทพ ไมถ่ ูกต้อง ใช่ @email.kmutnb Role = @สว่ นงาน ||@email.kmutnb เจ้าหนา้ ที่ นักศึกษา จบการทางาน ภาพที่ 3-12 Flowchart ขน้ั ตอนการตรวจสอบสทิ ธิ์ จากภาพที่ 3-12 แสดงข้ันตอนการตรวจสอบสิทธ์ิการเข้าถึง ระบบจะทาการตรวจสอบสิทธิ์ email บญั ชี Google วา่ เป็นของวิทยาเขตกรุงเทพหรอื ไม่ หากไมใ่ ชข่ องวทิ ยาเขตกรงุ เทพ ระบบจะ ขึ้นแจ้งเตือนบนหน้าจอและให้กรอกข้อมูลใหม่ การเข้าถึงโดยอัตโนมัติ ซึ่ง role = @ส่วนงาน หมายถึงสิทธ์ิเจ้าหน้าที่ และ role = @email.kmutnb หมายถึงสิทธ์ิผู้ใช้งาน (นักศึกษา) เม่ือเข้าสู่ ระบบและทาการตรวจสอบแล้ว เจ้าหน้าที่จะแสดงสว่ นการจัดการขอ้ มลู หรือสว่ นของเจ้าหน้าที่เป็น หนา้ แรก ผใู้ ชง้ านท่ัวไประบบจะแสดงส่วนหน้าแรกของผ้ใู ชง้ านเปน็ หน้าแรก

35 สว่ นของหนา้ หน้าอปั โหลดเอกสารของเจ้าหนา้ ที่ เรมิ่ ต้น กรอก Email,Password ไม่ มคจาพส.่ังวเพทิ Eม่ิยmไาฟเaขลiตl์เอกกรงุ สเาทรพ ใช่ กรนอักกศชึก่ือษไฟา ล์ มคจาพส.ั่งวเพิทE่มิ ยmเาบเaขอiตlร์สการยุงเดทน่ พ ใช่ เลอื กนปักรศะึกเภษทาไฟล์ ไม่ กรอกช่ือสายดว่ น อปั โหนลกั ดศไกึ ฟษลา์ PDF เบอรส์ ายดว่ น |R|@oleemไฟ=aลi@l์ .PkสDm่วFนuงtnานb ไม่ ใช่ บนันักทศกึ ไษฟาล์ จบการทางาน ภาพท่ี 3-13 Flowchart ขนั้ ตอนการอปั โหลดเอกสาร จากภาพท่ี 3-13 แสดงข้ันตอนการอัปโหลดเอกสารของเจ้าหน้าที่ เจ้าหน้าที่กรอก Email,Password เลือกคาสั่งในการอัปโหลดเอกสารจากนั้นกรอกข้อมูลของการอัปโหลดเอกสาร ให้ครบถ้วนระบบจะทาการบนั ทึกข้อมูลเอกสาร,คาสั่งเพ่ิมเบอร์สายด่วน เลือกคาส่ังในการอัปโหลด เพ่ิมเบอร์สายดว่ นจากนัน้ กรอกข้อมลู การเพิม่ เบอรส์ ายดว่ นใหค้ รบถว้ นระบบจะทาการบนั ทกึ ขอ้ มูล

36 สว่ นของหน้าหนา้ คูม่ ือโควดิ ของเจา้ หน้าท่ี เริ่มต้น แกสรดองกราEยmชื่อaไilฟ,Pลa์คsู่มswอื โoคrวdิด มจพ.ควาิทสEยัง่mาลเบaขiไตlฟกลร์งุ เทพ ไม่ ใช่ ยืนยนั การลบไฟล์ ลบไฟล์ จบการทางาน ภาพที่ 3-14 Flowchart ขน้ั ตอนการแสดงคู่มอื โควิดของเจา้ หนา้ ที่ จากภาพท่ี 3-14 แสดงข้ันตอนการแสดงคู่มือโควิดของเจ้าหน้าที่ เจ้าหน้าที่เลือกคาสัง่ ในการ แสดงคู่มือโควิด,คาส่ังลบ หน้าจอจะแสดงข้อความยืนยันเมื่อกดยืนยันระบบจะทาการลบไฟล์คู่มือ โควิดทันที

37 ส่วนของหนา้ หนา้ ค่มู ือกกั ตวั ของเจา้ หน้าท่ี เรมิ่ ต้น กรแอสกดงEรกmาายรaชกil่อืัก,Pไตaฟวั sลsค์w่มู oือrd มจพ.ควาทิ สEยัง่mาลเบaขiไตlฟกลร์ุงเทพ ไม่ ใช่ ยืนยันการลบไฟล์ ลบไฟล์ จบการทางาน ภาพที่ 3-15 Flowchart ขน้ั ตอนการแสดงคูม่ อื กกั ตวั ของเจา้ หนา้ ที่ จากภาพที่ 3-15 แสดงขั้นตอนการแสดงคู่มือกักตวั ของเจ้าหนา้ ที่ เจ้าหน้าท่เี ลอื กคาส่งั ในการ แสดงคู่มือกักตัว,คาส่ังลบ หน้าจอจะแสดงข้อความยืนยันเมื่อกดยืนยันระบบจะทาการลบไฟล์คู่มือ กกั ตวั ทันที

38 สว่ นของหนา้ หนา้ ประชาสัมพันธ์ของเจา้ หนา้ ท่ี เริ่มต้น กรอแกปสรEดะmงชรaาาiสยl,มัชPพ่ือaไsันฟsธwล์ ์ord มจพ.ควาิทสEยั่งmาลเบaขiไตlฟกลร์งุ เทพ ไม่ ใช่ ยืนยนั การลบไฟล์ ลบไฟล์ จบการทางาน ภาพท่ี 3-16 Flowchart ขน้ั ตอนการแสดงการประชาสัมพนั ธข์ องเจา้ หน้าท่ี จากภาพท่ี 3-16 แสดงขั้นตอนการแสดงประชาสัมพันธ์ของเจ้าหน้าที่ เจ้าหน้าท่ีเลือกคาส่ัง ในการแสดงประชาสัมพันธ์,คาสั่งลบ หน้าจอจะแสดงข้อความยืนยันเมื่อกดยืนยันระบบจะทาการ ลบไฟลป์ ระชาสัมพนั ธท์ ันที

39 ส่วนของหน้าหนา้ สายด่วนของเจ้าหนา้ ท่ี เริ่มต้น แกสรดองกราEยmช่อืaiเlบ,Pอaรs์สsาwยoดrว่ dน มจพ.ควาิทสEยงั่mาลเบaขiไตlฟกลร์งุ เทพ ไม่ ใช่ ยืนยันการลบไฟล์ ลบไฟล์ จบการทางาน ภาพท่ี 3-17 Flowchart ขน้ั ตอนการแสดงสายดว่ นของเจา้ หน้าที่ จากภาพท่ี 3-17 แสดงข้ันตอนการแสดงเบอร์สายดว่ นของเจ้าหน้าที่ เจ้าหน้าที่เลือกคาสั่งใน การแสดงเบอร์สายด่วน,คาสั่งลบ หน้าจอจะแสดงข้อความยืนยันเมื่อกดยืนยันระบบจะทาการลบ เบอรส์ ายดว่ นทันที

40 สว่ นของหน้าหนา้ แจง้ เตือนเจ้าหน้าที่ เริ่มตน้ กรอแกสดEงmกาaรilแ,Pจa้งเsตswอื นord แสดงสถานะเดิมนกั ศกึ ษา แสดงรปู ภาพการยนื ยนั ยนื ยันสถานะ ไม่ ใช่ แสดงหน้าการแจ้งเตือน จบการทางาน ภาพที่ 3-18 Flowchart ขน้ั ตอนการแสดงแจ้งเตอื นของเจ้าหนา้ ที่ จากภาพที่ 3-18 แสดงขั้นตอนการแสดงแจ้งเตอื นของเจ้าหน้าที่ เจ้าหน้าที่เลือกคาส่ังในการ แสดงการแจ้งเตือน,,คาสั่งยืนยันสถานะ หน้าจอจะแสดงปุ่มยืนยันสถานะเมื่อกดยืนยันระบบจะทา เปล่ยี นสถานะของนกั ศึกษาทันที