ออกแบบสำหรับหน้าจอขนาดใหญ่ตั้งแต่เริ่มต้น

อุปกรณ์ Android มีรูปแบบของอุปกรณ์ที่หลากหลาย เช่น โทรศัพท์ แท็บเล็ต อุปกรณ์แบบพับได้ และอุปกรณ์ ChromeOS ซึ่งมีหน้าจอหลายขนาด Android รองรับโหมดการแสดงผลหลายโหมด ได้แก่ หลายหน้าต่าง หลายจอภาพ แบบอิสระ และภาพในภาพ อุปกรณ์แบบพับได้อาจอยู่ในสถานะหรือลักษณะต่างๆ เช่น ตั้งโต๊ะหรือเป็นหนังสือ

พิจารณากรณีการใช้งานต่างๆ สําหรับแอปเมื่อเริ่มออกแบบ เช่น

• อุปกรณ์หน้าจอขนาดใหญ่ช่วยให้ผู้ใช้มีพื้นที่มากขึ้นในการมีส่วนร่วมกับเนื้อหาของแอปสื่อในลักษณะต่างๆ

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

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

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

โปรดทราบว่าแอปสื่อของคุณใช้โค้ดเดียวกันกับที่ทำงานในโทรศัพท์แบบมาตรฐาน อุปกรณ์แบบพับได้ แท็บเล็ต และ ChromeOS คุณจึงควรออกแบบแอปสำหรับหน้าจอขนาดใหญ่ตั้งแต่เริ่มต้นการพัฒนาแอป ดูข้อมูลเพิ่มเติมและตัวอย่างภาพได้ที่แกลเลอรีหน้าจอขนาดใหญ่

ทำให้แอปสื่อของคุณปรับเปลี่ยนตามพื้นที่โฆษณาโดยค่าเริ่มต้น

หลีกเลี่ยงประสบการณ์การใช้งานที่แย่ในแอปสื่อของคุณโดยทำให้เลย์เอาต์ของแอปปรับเปลี่ยนได้สำหรับโทรศัพท์ แท็บเล็ต อุปกรณ์แบบพับ และอุปกรณ์ ChromeOS

แอปควรปรับเปลี่ยนตามขนาด การวางแนว และรูปแบบของหน้าจอที่แตกต่างกัน เลย์เอาต์แบบปรับอัตโนมัติจะเปลี่ยนแปลงตามพื้นที่หน้าจอที่มี ดูข้อมูลเพิ่มเติมได้ที่รองรับหน้าจอขนาดต่างๆ

ออกแบบตามหลักเกณฑ์

คุณภาพแอปหลักคือพื้นฐานของแอป Android ทั้งหมดโดยไม่คำนึงถึงขนาดการแสดงผล ลักษณะการทำงานของอุปกรณ์ หรือการพิจารณาเฉพาะอุปกรณ์อื่นๆ แอปของคุณควรเป็นไปตามข้อกําหนดพื้นฐานเหล่านี้ก่อนที่คุณจะเริ่มออกแบบสําหรับหน้าจอขนาดใหญ่ ดูข้อมูลเพิ่มเติมได้ที่คุณภาพของแอปหลัก

แอปของคุณควรมอบประสบการณ์การใช้งานที่ยอดเยี่ยมโดยไม่คำนึงถึงรูปแบบของอุปกรณ์ ขนาดหน้าจอ โหมดการแสดงผล หรือลักษณะการใช้งาน ดังนั้นให้ออกแบบแอปตามหลักเกณฑ์ระดับ 1, 2 และ 3 ต่อไปนี้

หลักเกณฑ์นี้กำหนดชุดข้อกำหนดด้านคุณภาพที่ครอบคลุมสำหรับแอป Android เกือบทุกประเภท

ระดับ 3:

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

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

ระดับ 2:

ในส่วนนี้ แอปจะใช้การเพิ่มประสิทธิภาพเลย์เอาต์สำหรับหน้าจอทุกขนาดและการกําหนดค่าอุปกรณ์ รวมถึงการรองรับอุปกรณ์อินพุตภายนอกที่ปรับปรุงแล้ว โปรดดูรายละเอียดที่หัวข้อเพิ่มประสิทธิภาพหน้าจอขนาดใหญ่

ระดับ 1:

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

แอปรองรับการทำงานหลายอย่างพร้อมกัน ท่าทางสัมผัสแบบพับได้ การลาก และการป้อนข้อมูลด้วยสไตลัส (หากมี) ในระดับนี้ แอปมีความแตกต่างกันอย่างมาก ดังนั้นโปรดอ่านหลักเกณฑ์อย่างละเอียดในส่วนต่างๆ เช่น การทํางานหลายอย่างพร้อมกันและลักษณะการพับ ดูข้อมูลเพิ่มเติมได้ที่ความแตกต่างของหน้าจอขนาดใหญ่

เลย์เอาต์ที่เพิ่มประสิทธิภาพ

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

คอมโพเนนต์แถบนําทางและลิ้นชักช่วยให้การนําทาง UI สะดวกและควบคุมได้ง่าย คอมโพเนนต์เหล่านี้ยังช่วยเสริมเลย์เอาต์ตามหลักเกณฑ์ (รายละเอียดรายการ ฟีด และแผงสนับสนุน) ด้วยการวางตำแหน่งปลายทางการนำทางหลักให้เข้าถึงได้ง่าย ขณะเดียวกันก็ใช้พื้นที่หน้าจอน้อยที่สุด

เลย์เอาต์สื่อ

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

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

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

• แผงสนับสนุน: พื้นที่โฆษณาหลักและรองช่วยให้แอปของคุณฝังแผงสนับสนุนสำหรับบริบท ความเกี่ยวข้อง หรือข้อมูลอ้างอิงได้ เช่น รายการที่เลื่อนได้ของภาพยนตร์/รายการทีวีที่คล้ายกัน รีวิวที่เผยแพร่ หรือผลงานอื่นๆ ของศิลปินหรือนักแสดงคนเดียวกัน โปรดดูรายละเอียดเพิ่มเติมได้ที่หัวข้อเลย์เอาต์แผงที่รองรับ

ดูคอลเล็กชันเลย์เอาต์สื่อที่คัดสรรแล้วได้ที่แกลเลอรีสื่อ

เลย์เอาต์โซเชียลมีเดีย

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

• List-detail: เหมาะสำหรับแอปรับส่งข้อความ เครื่องมือจัดการรายชื่อติดต่อ หรือโปรแกรมเรียกดูไฟล์ ตัวอย่างเช่น แอปสามารถแสดงรายการการสนทนาพร้อมรายละเอียดต่างๆ เพื่อให้ทราบข้อมูลล่าสุดของข้อความล่าสุด ดูข้อมูลเพิ่มเติมได้ที่เลย์เอาต์รายละเอียดรายการ

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

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

ดูคอลเล็กชันเลย์เอาต์โซเชียลมีเดียที่ดูแลจัดการแล้วได้ที่หน้าแกลเลอรีโซเชียลมีเดีย

แนวทางปฏิบัติที่ดีที่สุดสำหรับแอปสื่อที่มีหน้าจอขนาดใหญ่

การใช้แนวทางปฏิบัติแนะนำสำหรับหน้าจอขนาดใหญ่จะช่วยให้คุณไม่ต้องทํางานซ้ำโดยไม่จําเป็น และยังทําให้แอปของคุณใช้งานง่ายขึ้นบนอุปกรณ์จํานวนมากขึ้นตั้งแต่เริ่มต้น โดยเฉพาะในแง่การวางแนว แป้นพิมพ์ลัด การรองรับการแสดงตัวอย่างจากกล้อง และลักษณะการพับของอุปกรณ์

การวางแนวและการปรับขนาด

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

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

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

แป้นพิมพ์ลัด

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

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

การรองรับการแสดงตัวอย่างจากกล้อง

หน้าจอขนาดใหญ่อาจทำให้เกิดปัญหาเกี่ยวกับการยืด การครอบตัด และการหมุนได้มากกว่า คุณจึงไม่สามารถคาดเดาได้ว่าขนาดของตัวอย่างจากกล้องคือขนาดที่ UI ในแอปสื่อแสดงผลจริง

ตัวอย่างเช่น หากผู้ใช้ถ่ายภาพด้วยแท็บเล็ต แต่ภาพแสดงผลกลับหัวบนหน้าจอแท็บเล็ต ประสบการณ์การใช้งานนี้จะไม่เหมาะสม มีการรองรับการแสดงตัวอย่างจากกล้องสำหรับหน้าจอขนาดใหญ่

ดูข้อมูลเพิ่มเติมได้ที่ตัวอย่างจาก CameraX หรือตัวอย่างจาก Camera2

ท่าพับได้

การออกแบบแอปสื่อสำหรับหน้าจอขนาดใหญ่โดยใช้ท่าพับได้ ตัวอย่างเช่น แอปของคุณอาจอนุญาตให้ผู้ใช้กำหนดค่าเป็นโหมดตั้งโต๊ะสำหรับการเล่นสื่อ หรือใช้จอแสดงผลด้านหลังและโหมด Dual Screen เพื่อดูตัวอย่างและจับภาพ

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