แนวทางปฏิบัติแนะนำด้านการออกแบบต่อไปนี้จะช่วยให้ผู้ใช้ได้รับประสบการณ์การใช้งานที่ดีที่สุดเมื่อเล่นเกมของคุณบน YouTube ในอุปกรณ์และแพลตฟอร์มต่างๆ
นอกเหนือจากคอมโพเนนต์ของระบบปฏิบัติการแล้ว ประสบการณ์การใช้งานฟีเจอร์เล่นเกมส่วนใหญ่ประกอบด้วย 3 คอมโพเนนต์หลัก ได้แก่
- การดำเนินการกับฟีเจอร์เล่นเกม
- Canvas ของเกม
- เมนูและกล่องโต้ตอบ
แนวทางปฏิบัติแนะนำด้านการออกแบบเกมเหล่านี้จะให้คำแนะนำเกี่ยวกับวิธีสร้างเกมสำหรับ Canvas ของเกม
การปรับขนาดเกม
ตรวจสอบว่าเกมปรับให้เข้ากับขนาดและการวางแนวหน้าจอต่างๆ ได้อย่างเหมาะสมโดยพิจารณาแนวทางปฏิบัติเหล่านี้
ปรับขนาดเกมและปรับ UI ให้เข้ากับขนาดและอัตราส่วนกว้างยาวของ Canvas
ใช้การใส่แถบดำด้านข้างหรือด้านบนและด้านล่างหากเกมไม่สามารถปรับเปลี่ยนตามขนาดและอัตราส่วนกว้างยาวของ Canvas ของเกมได้อย่างเต็มที่
หลีกเลี่ยงการทำให้เกิดแถบเลื่อน เนื่องจากแถบเลื่อนส่งผลเสียต่อทั้งเกมเพลย์และการไปยังส่วนต่างๆ ทั่วไป ให้เติม Canvas โดยไม่ทำให้เกมเลื่อนได้ภายใน Canvas แถบเลื่อนใช้ได้สำหรับการเลื่อนโดยเจตนา เช่น เมื่อเลื่อนดูรายการแนวตั้งยาวๆ ภายใน UI ของเกม เกมควรปรับเปลี่ยนตามวิวพอร์ตได้อย่างเต็มที่
การปรับขนาดเกม
แสดงผลอย่างชัดเจน (ไม่เบลอ เป็นพิกเซล หรือยืด) ในความละเอียดหน้าจอต่างๆ
ตรวจสอบว่า UI ของเกม (ข้อความ ไอคอน) ปรับขนาดได้อย่างเหมาะสมเมื่อแสดงผลบนหน้าจอที่มีความละเอียดต่ำ (เช่น อุปกรณ์เคลื่อนที่ขนาด 360x800) และหน้าจอที่มีความละเอียดสูง (เช่น จอภาพเดสก์ท็อปขนาด 3840x2560)
หลีกเลี่ยงชิ้นงานแรสเตอร์ที่มีความละเอียดต่ำซึ่งจะปรากฏเป็นภาพเบลอเมื่อปรับขนาดให้ใหญ่ขึ้น
การพิมพ์
ตรวจสอบว่าข้อความอ่านได้ชัดเจนในอุปกรณ์และขนาดหน้าจอต่างๆ
ข้อความที่ปรากฏในเกม เช่น ปุ่ม เมนู และคำพูดในบอลลูน ต้องอ่านได้ชัดเจนในอุปกรณ์และขนาดหน้าจอต่างๆ คุณสามารถทำได้โดยการปรับขนาดและปรับข้อความโดยอัตโนมัติ หรือโดยการให้ผู้ใช้ตั้งค่าเพื่อปรับขนาดแบบอักษร
หากข้อความมีขนาดเล็กกว่า 18pt หรือหากข้อความเป็นตัวหนาและมีขนาดเล็กกว่า 14pt ให้ตั้งค่าอัตราส่วนคอนทราสต์ของสีเป็นอย่างน้อย 4.5:1
สำหรับข้อความอื่นๆ ทั้งหมด ให้ตั้งค่าอัตราส่วนคอนทราสต์ของสีเป็นอย่างน้อย 3:1
ดูข้อมูลอ้างอิงทั่วไปได้ที่ WCAG2.1
 |
 |
| ใช้ขนาดแบบอักษรขนาดใหญ่ที่มีความหนาและคอนทราสต์เพียงพอเพื่อให้ข้อความอ่านได้ชัดเจน ในตัวอย่างนี้ อัตราส่วนคอนทราสต์คือ 4.48:1 | หลีกเลี่ยงการใช้ขนาดแบบอักษรขนาดเล็กและสีที่มีคอนทราสต์ต่ำ ในตัวอย่างนี้ อัตราส่วนคอนทราสต์คือ 3.07:1 |
การโต้ตอบ
ส่วนนี้ครอบคลุมแนวทางปฏิบัติแนะนำเกี่ยวกับการโต้ตอบของผู้ใช้และองค์ประกอบที่เกี่ยวข้อง
เป้าหมายการสัมผัส
ทำให้เป้าหมายการสัมผัสมีขนาดใหญ่พอเพื่อให้โต้ตอบได้ง่ายขึ้น
ตรวจสอบว่าเป้าหมายการสัมผัสมีขนาดอย่างน้อย 48x48 dp โดยมีพื้นที่ว่างอย่างน้อย 8 dp ระหว่างเป้าหมาย (ดู หลักเกณฑ์การออกแบบ Material) เพื่อให้โต้ตอบได้ง่ายขึ้น
ในตัวอย่างนี้ ปุ่มที่แสดงผลด้วยภาพมีขนาด 24 dp ในขณะที่เป้าหมายการสัมผัสที่มองไม่เห็นมีขนาด 12 dp รอบๆ ไอคอนเพื่อให้ได้เป้าหมายการสัมผัสขนาด 48x48 dp
เพิ่มระยะห่างจากขอบรอบๆ ไอคอนและปุ่มเพื่อเพิ่มขนาดเป้าหมายการสัมผัส
ปุ่ม
ใช้สไตล์ที่ไม่ซ้ำกันสำหรับสถานะของปุ่มแต่ละปุ่ม ดังนี้
- เปิดใช้อยู่
- ปิดใช้อยู่
- วางเมาส์เหนือ (สำหรับอุปกรณ์ป้อนข้อมูลที่ไม่ใช่แบบสัมผัส)
- มีสมาธิ
- กด
พยายามแยกความแตกต่างของปุ่มตามลำดับชั้นด้วย เช่น ปุ่มการดำเนินการหลักเทียบกับ ปุ่มการดำเนินการรองในเมนูเริ่ม (ดูหลักเกณฑ์การออกแบบ Material 2 ของ Google สำหรับปุ่ม)
สไตล์ที่ไม่ซ้ำกันซึ่งแยกความแตกต่างของสถานะปุ่มแต่ละปุ่ม
ป้อนข้อมูลด้วยแป้นพิมพ์
เพื่อเพิ่มการเข้าถึงเกมในอุปกรณ์และผู้ใช้ต่างๆ ให้รองรับการป้อนข้อมูลด้วยแป้นพิมพ์สำหรับการควบคุมเกมเพลย์และการไปยังส่วนต่างๆ บนหน้าจอทั้งหมด นอกเหนือจากการป้อนข้อมูลด้วยการสัมผัสและอินพุตจากเมาส์
สำหรับเกมที่รองรับการป้อนข้อมูลด้วยแป้นพิมพ์ ให้ผู้ใช้ปิดเมนูในเกม และกล่องโต้ตอบได้โดยใช้ปุ่ม Esc นอกเหนือจากการมีปุ่มปิดที่มองเห็นได้ (เช่น ไอคอน X ที่มุมบน) ตัวอย่างทั่วไปของโมดัลหรือกล่องโต้ตอบ ได้แก่ เมนูการตั้งค่า เมนูหยุดชั่วคราว ข้อความแสดงข้อผิดพลาด และป๊อปอัปข้อมูลความช่วยเหลือ
หลีกเลี่ยงการแมปการดำเนินการใดๆ กับการกดปุ่ม Esc ค้างไว้ เนื่องจาก ใช้สำหรับการออกจากโหมดเต็มหน้าจอบนเว็บเบราว์เซอร์เดสก์ท็อป
สำหรับเกมที่มีการลงทะเบียนตัวฟังการกดปุ่ม ให้หลีกเลี่ยงการใช้ preventDefault()
กับ Esc เมื่ออยู่ในโหมดเต็มหน้าจอใน Safari การดำเนินการนี้จะทำให้เกมใช้เหตุการณ์การกดปุ่มโดยไม่ออกจากโหมดเต็มหน้าจอ
การโต้ตอบการสัมผัส
ขอแนะนำให้ใช้การตอบสนองแบบรู้สึกได้ (การสั่น) เมื่อเหมาะสม เพื่อให้เกมของคุณสนุกและสมจริงยิ่งขึ้น
ช่วงสำคัญของเกม
ส่วนนี้ครอบคลุมช่วงสำคัญในเกมที่สร้างประสบการณ์การใช้งานที่ยอดเยี่ยมให้กับผู้เล่น
บทแนะนำ
ใส่บทแนะนำสั้นๆ หรือระดับการเตรียมความพร้อมผู้ใช้งานใหม่เพื่อช่วยผู้เล่นใหม่
การเริ่มต้นใช้งานจะช่วยให้ผู้ใช้ได้เรียนรู้เกมเพลย์พื้นฐานและสิ่งสำคัญของเกมเพื่อดำเนินการต่อและสนุกกับเกม
เนื่องจากฟีเจอร์เล่นเกมมีไว้เพื่อให้ผู้ใช้เริ่มเล่นได้อย่างรวดเร็วและง่ายดาย ให้พยายามทำให้การเริ่มต้นใช้งานมีขั้นตอนน้อยที่สุด แม้ว่าเกมบางเกมจะไม่จำเป็นต้องมีบทแนะนำ แต่เกมส่วนใหญ่จะได้รับประโยชน์จากการเริ่มต้นใช้งานในรูปแบบใดรูปแบบหนึ่ง พิจารณากลไก กฎ และทักษะหลักที่ผู้เล่นต้องรู้เพื่อให้เล่นเกมได้สำเร็จและสนุก
บทแนะนำอาจอยู่ในรูปแบบต่อไปนี้
- ชุดหน้าจอที่จุดเริ่มต้นของเกม (หรือดีกว่านั้นคือแสดงตามบริบทตลอดทั้งเกมเมื่อเหมาะสม)
- ระดับบทแนะนำจริงที่ผู้ใช้เล่น
หยุดชั่วคราว
สื่อสารสถานะของเกมให้ผู้ใช้ทราบอย่างชัดเจน
สื่อสารให้ผู้ใช้ทราบอย่างชัดเจนเมื่อเกมหยุดชั่วคราวและวิธีที่ผู้ใช้จะกลับมาเล่นเกมต่อได้ หลีกเลี่ยงการทำให้ผู้ใช้คิดว่าเกมค้างหรือขัดข้อง
ติดป้ายกำกับสถานะของเกมเป็น "หยุดชั่วคราว" อย่างชัดเจน และระบุการดำเนินการ (ปุ่ม) ที่ชัดเจนเพื่อกลับมาเล่นเกมต่อ
การแข่งขันจบแล้ว
สื่อสารให้ผู้ใช้ทราบว่าตนเล่นจบด่านสุดท้ายแล้วหรือเล่นเกมจบแล้ว
หากเกมมีจุดจบที่ชัดเจน (เช่น มีจำนวนด่านที่จำกัด) ให้สื่อสารข้อเท็จจริงดังกล่าวให้ผู้ใช้ทราบอย่างชัดเจน เพื่อหลีกเลี่ยงการทำให้ผู้ใช้คิดว่าเกมเสียหรือค้าง เกมควรแสดงความยินดีและแสดงความขอบคุณผู้เล่นที่เล่นเกมจบ
เสียง
เกมอาจมีการควบคุมระดับเสียงแยกกันสำหรับเอฟเฟ็กต์ เสียงพูด และเพลงประกอบ การควบคุมอาจประกอบด้วยแถบเลื่อนเพื่อปรับระดับเสียงหรือปุ่มเปิด/ปิดเสียงสำหรับแต่ละรายการหรือทั้ง 2 รายการ
การช่วยเหลือพิเศษ
การช่วยเหลือพิเศษในการออกแบบช่วยให้ผู้ใช้ที่มีความสามารถหลากหลายได้เล่นและสนุกกับเกมของคุณ
แนวทางปฏิบัติแนะนำด้านการช่วยเหลือพิเศษที่เป็นมาตรฐานอุตสาหกรรมสำหรับการออกแบบเกมไม่มีอยู่จริง ซึ่งต่างจากการออกแบบเว็บและซอฟต์แวร์ ดูแหล่งข้อมูลที่ดีพร้อมแนวทางปฏิบัติแนะนำเพิ่มเติมเกี่ยวกับการออกแบบเกมที่ครอบคลุมได้ที่ แนวทางปฏิบัติแนะนำด้านการช่วยเหลือพิเศษของเกม เราขอแนะนำให้คุณพิจารณาว่าแนวทางปฏิบัติแนะนำเหล่านี้สามารถนำไปใช้กับการออกแบบเกมของคุณได้อย่างไร