กล่องโต้ตอบการแคสต์

กล่องโต้ตอบการแคสต์จะแสดงขึ้นทุกครั้งที่กดปุ่มแคสต์ กล่องโต้ตอบการแคสต์ช่วยให้ผู้ใช้ เชื่อมต่อ ควบคุม และเลิกเชื่อมต่อจากตัวรับเว็บได้

หากคุณกำลังพัฒนาการติดตั้งใช้งานที่กำหนดเองหรือสร้างแอปสำหรับ iOS หรือ Chrome คุณต้อง ติดตั้งใช้งานกล่องโต้ตอบนี้ในลักษณะที่สอดคล้องกัน เพื่อให้ผู้ใช้จดจำและเชื่อมั่นว่ากล่องโต้ตอบนี้จะทำงาน อย่างสอดคล้องกันในอุปกรณ์ แอป และแพลตฟอร์มต่างๆ ดูตัวอย่างได้ใน แอปอ้างอิง

  กล่องโต้ตอบการแคสต์ ไม่ได้เชื่อมต่อ (ตัวรับพร้อมใช้งาน)

ต้องระบุ (ลักษณะการทำงานเริ่มต้นของ Android MediaRouter)
  A   เมื่อแอปผู้ส่งไม่ได้เชื่อมต่อกับตัวรับสัญญาณ Cast การแตะปุ่มแคสต์จะแสดงกล่องโต้ตอบ Cast
  B   ชื่อกล่องโต้ตอบ Cast "แคสต์ไปยัง" จะปรากฏขึ้น
  C   กล่องโต้ตอบ Cast จะแสดงรายการตัวรับสัญญาณเว็บที่พร้อมใช้งาน
  D   ตัวรับสัญญาณแต่ละตัวที่กำลังแคสต์ควรแสดง "กำลังแคสต์ ชื่อแอป"

โปรดทราบสถานการณ์ที่มีผู้ใช้หลายคนดังนี้

  • เมื่อผู้ใช้รายอื่นเชื่อมต่อกับตัวรับที่กำลังแคสต์ จากแอปและบัญชีเดียวกัน แอปผู้ส่งจะแสดงตัวควบคุมสำหรับ เนื้อหาที่แคสต์
  • เมื่อผู้ใช้รายอื่นเชื่อมต่อกับตัวรับที่กำลังแคสต์ จากแอปที่ไม่ได้แคสต์ แอปผู้ส่งก่อนหน้า จะยกเลิกการเชื่อมต่อและแอปผู้ส่งใหม่จะเชื่อมต่อ

Android

กล่องโต้ตอบ Cast ไม่ได้เชื่อมต่อ

กล่องโต้ตอบ Cast, รูปภาพที่ไม่ได้เชื่อมต่อ

แคสต์หน้าจอหลัก

แคสต์รูปภาพหน้าจอหลัก

iOS

กล่องโต้ตอบ Cast ไม่ได้เชื่อมต่อ

รูปภาพกล่องโต้ตอบ Cast ที่ไม่ได้เชื่อมต่อ

แคสต์หน้าจอหลัก

แคสต์รูปภาพหน้าจอหลัก

Chrome

กล่องโต้ตอบ Cast ไม่ได้เชื่อมต่อ

รูปภาพกล่องโต้ตอบ Cast ที่ไม่ได้เชื่อมต่อ

แคสต์หน้าจอหลัก

แคสต์รูปภาพหน้าจอหลัก
 

  กล่องโต้ตอบการแคสต์ที่ไม่ได้เชื่อมต่อ (iOS เท่านั้น)

สำหรับ iOS เมื่อแคสต์เป็นครั้งแรก ผู้ใช้ต้องยินยอมให้สิทธิ์เข้าถึงเครือข่ายภายใน (LNA) แก่อุปกรณ์ Cast หน้าจอข้อมูลโฆษณาคั่นระหว่างหน้าจะแสดงต่อผู้ใช้เพื่ออธิบายสาเหตุที่ต้องใช้สิทธิ์นี้ ตามด้วยกล่องโต้ตอบสิทธิ์ LNA มาตรฐานของ Apple

หลังจากแคสต์เป็นครั้งแรก หากไม่พบอุปกรณ์เมื่อแตะปุ่มแคสต์ขณะที่ผู้ใช้ใช้ Wi-Fi ระบบจะแสดงหน้าจอความช่วยเหลือที่อธิบายว่าเหตุใดตัวรับสัญญาณเว็บจึงอาจไม่พร้อมใช้งาน (เช่น ปิดใช้การเข้าถึงเครือข่าย LAN หรือมีปัญหาเกี่ยวกับเครือข่าย Wi-Fi)

ต้องระบุ
  ก.   การแคสต์ครั้งแรก: หลังจากแตะปุ่มแคสต์ เป็นครั้งแรก ต้องแสดงโฆษณาคั่นระหว่างหน้าเพื่ออธิบายให้ผู้ใช้ทราบว่าเหตุใดจึงควรอนุญาต ให้แอปเข้าถึงอุปกรณ์ในเครือข่ายภายใน โฆษณาคั่นระหว่างหน้าควรมีข้อมูลเกี่ยวกับ เหตุผลที่ต้องมีการเข้าถึงเครือข่ายในพื้นที่ เพื่อเพิ่มโอกาสที่ผู้ใช้จะยอมรับ การเข้าถึงสิทธิ์ในพื้นที่
  ข   ตัวรับสัญญาณไม่พร้อมใช้งาน: การแตะปุ่มแคสต์ จะแสดงหน้าจอความช่วยเหลือที่อธิบายสาเหตุที่เป็นไปได้ที่ผู้ใช้ ไม่พบตัวรับสัญญาณเว็บ พร้อมลิงก์ไปยังการตั้งค่าเพื่อแก้ไขปัญหาเกี่ยวกับสิทธิ์ LNA

การแคสต์เป็นครั้งแรก (iOS)

การแคสต์ครั้งแรก: สิทธิ์เข้าถึงเครือข่าย LAN และสิทธิ์โฆษณาคั่นระหว่างหน้า

ขั้นตอนการยอมรับการเข้าถึงเครือข่ายภายในของ Cast

ผู้รับไม่พร้อมใช้งาน

ผู้รับไม่พร้อมใช้งาน

การแคสต์แบบต่อเนื่องเมื่อปิดการเข้าถึงเครือข่ายภายใน
 

  กล่องโต้ตอบการแคสต์ เชื่อมต่อแล้วแต่ไม่ได้แคสต์

ต้องระบุ
  ก   เมื่อแอปผู้ส่งเชื่อมต่อกับ Web Receiver การแตะปุ่มแคสต์จะแสดงกล่องโต้ตอบแคสต์
  ข   ชื่อกล่องโต้ตอบแคสต์ "ชื่อตัวรับ" จะปรากฏขึ้น
  ค   กล่องโต้ตอบแคสต์จะแสดงปุ่มเพื่อหยุดแคสต์ พร้อมป้ายกำกับปุ่ม "หยุดแคสต์" (ดูข้อมูลเพิ่มเติมเกี่ยวกับการยกเลิกการเชื่อมต่อได้ที่ ผู้ส่งหยุดแคสต์)

Android

กล่องโต้ตอบ Cast เชื่อมต่อแล้วแต่ไม่ได้แคสต์

แอปตัวรับสัญญาณโหลดแล้ว / ไม่มีการใช้งาน

iOS

กล่องโต้ตอบ Cast เชื่อมต่อแล้วแต่ไม่ได้แคสต์

แอปตัวรับสัญญาณโหลดแล้ว / ไม่มีการใช้งาน

 

  กล่องโต้ตอบการแคสต์ขณะแคสต์

ต้องระบุ
  A   ชื่อกล่องโต้ตอบการแคสต์ "ชื่อตัวรับ" ปรากฏขึ้น
  B   ตัวรับหรือเนื้อหาที่กำลังแคสต์จะแสดงใต้ชื่อ
  C   กล่องโต้ตอบการแคสต์จะแสดงปุ่ม "หยุดแคสต์" ซึ่งจะหยุด การแคสต์ (ดูข้อมูลเพิ่มเติมได้ที่ ผู้ส่งหยุดแคสต์)

แนวทางปฏิบัติแนะนำ

  • เพื่อให้ผู้ใช้ได้รับประสบการณ์การใช้งานที่ดีที่สุด ให้ระบุการควบคุมแบบถาวรนอกเหนือจากการควบคุมในกล่องโต้ตอบ Cast

Android

กล่องโต้ตอบการแคสต์ขณะแคสต์

ตัวรับสัญญาณเล่นเนื้อหา

iOS

กล่องโต้ตอบการแคสต์ขณะแคสต์

ตัวรับสัญญาณเล่นเนื้อหา

Chrome

กล่องโต้ตอบการแคสต์ขณะแคสต์

กล่องโต้ตอบการแคสต์ขณะแคสต์

ตัวรับสัญญาณเล่นเนื้อหา

 

 

รูปภาพที่ใช้ในคำแนะนำการออกแบบนี้ ได้รับความอนุเคราะห์จาก Blender Foundation และแชร์ภายใต้ลิขสิทธิ์หรือสัญญาอนุญาตครีเอทีฟคอมมอนส์ (Creative Commons License)

  • Elephant's Dream: (c) copyright 2006, Blender Foundation / Netherlands Media Art Institute / www.elephantsdream.org
  • Sintel: (c) copyright Blender Foundation | www.sintel.org
  • Tears of Steel: (CC) Blender Foundation | mango.blender.org
  • Big Buck Bunny: (c) copyright 2008, Blender Foundation / www.bigbuckbunny.org