ข้อกำหนดเฉพาะในการออกแบบไอคอนของ Google Play

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

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

รูปแบบอิสระ – รูปแบบเดิม

รูปแบบเดียวกัน – รูปแบบใหม่

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

สำคัญ: หากคุณสนใจดูข้อมูลเพิ่มเติมเกี่ยวกับการสร้างไอคอน APK Launcher ซึ่งมีวิธีสร้างแยกกันกับไอคอน Google Play ที่พูดถึงในหน้านี้ โปรดดูแหล่งข้อมูลด้านล่าง

ไอคอนแบบปรับอัตโนมัติของ Android
ทำตามหลักเกณฑ์เกี่ยวกับไอคอน APK เหล่านี้เพื่อดูวิธีสร้างไอคอน Launcher แบบปรับอัตโนมัติ ซึ่งจะเปิดตัวใน Android 8.0 (API ระดับ 26)
ไอคอนผลิตภัณฑ์
สำรวจหลักการเรื่องดีไซน์ Material สำหรับไอคอนผลิตภัณฑ์ รวมถึงหลักเกณฑ์การออกแบบไอคอน รูปทรง ข้อกำหนดเฉพาะ และการจัดการ

การสร้างเนื้อหา

ส่วนนี้จะพูดถึงหลักเกณฑ์บางอย่างที่คุณต้องทำตามเวลาสร้างเนื้อหาที่เป็นภาพสำหรับแอปใน Google Play

แอตทริบิวต์

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

เวลาสร้างอาร์ตเวิร์ก โปรดตรวจสอบว่าได้ปฏิบัติตามหลักเกณฑ์ดังต่อไปนี้

ขนาดสุดท้าย: 512 พิกเซล x 512 พิกเซล
รูปแบบ: PNG 32 บิต
พื้นที่สี: sRGB
ขนาดไฟล์สูงสุด: 1024 KB
รูปทรง: สี่เหลี่ยมจัตุรัสที่สมบูรณ์ Google Play จะจัดการการมาสก์แบบไดนามิก รัศมีจะมีขนาดเทียบเท่า 30% ของขนาดไอคอน
เงา: ไม่ต้องใส่ Google Play จะจัดการการใส่เงาแบบไดนามิก ดูส่วน "เงา" ด้านล่างเกี่ยวกับการใส่เงาในอาร์ตเวิร์ก

ขนาดทั้งหมดของเนื้อหา

แนวเส้นกรอบไอคอนผลิตภัณฑ์

หลังจากอัปโหลดชิ้นงานแล้ว Google Play จะใส่มาสก์โค้งมนและเงาแบบไดนามิกเพื่อให้ไอคอนของแอป/เกมทั้งหมดสอดคล้องกัน

ทางด้านซ้ายมือคือเนื้อหาไอคอนใหม่ของคุณ ส่วน 3 ภาพต่อมาทางด้านขวาคือขั้นตอนแบบไดนามิกที่ Google Play ดำเนินการกับไอคอน

การกำหนดขนาด

ใช้พื้นที่ทั้งหมดของเนื้อหาเป็นพื้นหลังเวลาทำอาร์ตเวิร์กแบบมินิมัล

ใช้แนวเส้นกรอบเป็นแนวทางสำหรับการจัดตำแหน่งองค์ประกอบของอาร์ตเวิร์ก (เช่น โลโก้)

อาร์ตเวิร์กแบบไม่มีขอบ (เนื้อหาสุดท้าย)

ผลลัพธ์สุดท้ายแบบมีเงาและขอบโค้งมนที่ Google Play ใส่ให้แบบไดนามิก

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

ผิด

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

ขวา

วางอาร์ตเวิร์กของไอคอนรูปแบบอิสระในแนวเส้นกรอบแทน

อาร์ตเวิร์กที่เป็นภาพวาดมักจะใช้เป็นไอคอนแบบไม่มีขอบได้ดี

ผิด

อย่าลดขนาดอาร์ตเวิร์กที่เป็นภาพวาดให้พอดีกับแนวเส้นกรอบ

ขวา

ใช้พื้นที่ทั้งหมดของเนื้อหาเพื่อให้อาร์ตเวิร์กแสดงเต็มไอคอน

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

สิ่งที่ไม่ควรทำ

อย่าใช้องค์ประกอบข้อความหรือกราฟิกเพื่อระบุการจัดอันดับ

สิ่งที่ไม่ควรทำ

อย่าใช้องค์ประกอบข้อความหรือกราฟิกเพื่อโปรโมตดีลหรือกระตุ้นให้เกิดการติดตั้ง

สิ่งที่ไม่ควรทำ

อย่าใช้องค์ประกอบข้อความหรือกราฟิกเพื่อระบุการเข้าร่วมโปรแกรมของ Play

สิ่งที่ไม่ควรทำ

อย่าใช้ข้อความหรือองค์ประกอบกราฟิกที่อาจทำให้ผู้ใช้เข้าใจผิด

แสงเงา

Google Play จะใส่เงาตกกระทบแบบไดนามิกรอบๆ ไอคอนสุดท้ายเมื่อมีการอัปโหลด

เวลาใส่เงาในอาร์ตเวิร์กของไอคอน ให้พิจารณาความสอดคล้องกันกับแพลตฟอร์ม Android โดยทำตามหลักเกณฑ์เกี่ยวกับเนื้อหาของ Google

ผิด

อย่าใส่เงาตกกระทบลงในเนื้อหาสุดท้าย

ขวา

คุณใส่แสงและเงาภายในอาร์ตเวิร์กได้

รัศมีมุม

Google Play ใส่รัศมีมุมให้แบบไดนามิก วิธีนี้ช่วยดูแลให้ไอคอนสอดคล้องกันเวลาที่ต้องปรับขนาดตามการออกแบบ UI ต่างๆ รัศมีจะมีขนาดเทียบเท่า 30% ของขนาดไอคอน

ผิด

อย่ากำหนดให้มุมของเนื้อหาสุดท้ายมีลักษณะโค้งมน

ขวา

ใช้อาร์ตเวิร์กที่มีขนาดเต็มพื้นที่ทั้งหมดของเนื้อหาหากทำได้

การปรับแบรนด์

หากรูปทรงเป็นส่วนสำคัญของโลโก้ อย่ากำหนดให้อาร์ตเวิร์กเป็นแบบไม่มีขอบ แต่ให้วางอาร์ตเวิร์กลงในแนวเส้นกรอบแบบใหม่แทน

จากซ้ายไปขวา: เนื้อหาไอคอนแบบเดิม เนื้อหาไอคอนแบบใหม่ (แนะนำให้ปรับเป็นแบบนี้) ไอคอนแบบใหม่ที่แสดงใน Google Play

หากทำได้ ให้เลือกสีพื้นหลังของชิ้นงานที่เหมาะสมกับแบรนด์และไม่ใช้พื้นหลังแบบโปร่งใส เนื้อหาที่โปร่งใสจะแสดงเป็นสีพื้นหลังของ UI ใน Google Play

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

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

โหมดเดิม

สำหรับเนื้อหาไอคอนแบบเดิมที่ยังไม่ได้อัปเดตให้ตรงตามข้อกำหนดเฉพาะแบบใหม่ ระบบจะย้ายข้อมูลไปยังโหมดเดิมในที่สุดและปรับขนาดลง 75% ให้พอดีกับขนาดแนวเส้นกรอบ (512 * 0.75 = 384 พิกเซล)

ตั้งแต่เดือนพฤษภาคม 2019 เราจะไม่อนุญาตให้อัปโหลดไอคอนตามข้อกำหนดเฉพาะแบบเดิมอีกต่อไป ดูรายละเอียดเพิ่มเติมเกี่ยวกับลำดับเวลา

ระบบจะเปลี่ยนเนื้อหาไอคอนแบบเดิมเป็นเนื้อหาในโหมดเดิมโดยอัตโนมัติและลดขนาดลง 75% ให้พอดีกับแนวเส้นกรอบแบบใหม่

วิธีการสำหรับผู้ใช้ API

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

ก่อนวันที่ 17 มิถุนายน 2019 นักพัฒนาแอปต้องใช้ Play Console เพื่อใช้ ข้อกำหนดใหม่กับไอคอนของตน การเรียกใช้ Edits.images: upload ทั้งหมด จะใช้ข้อกำหนดที่กำหนดค่าไว้ใน Play Console คุณไม่สามารถใช้ข้อกำหนดใหม่ผ่าน API ได้ Edits.images: uploadการเรียกอาจเกิดข้อผิดพลาดหากยังใช้ข้อกำหนดเดิมอยู่ และข้อความแสดงข้อผิดพลาดสำหรับไอคอนนั้นจะนำคุณไปยังข้อกำหนดนี้ หลังจาก ใช้ข้อกำหนดใหม่โดยใช้ Play Console แล้ว คุณจะลองEdits.images: uploadเรียกใช้ อีกครั้งได้ คุณอาจต้องลองโทรหลายครั้ง ก่อนที่จะโทรติด

ตั้งแต่วันที่ 17 มิถุนายน 2019 เป็นต้นไป การเรียก API ทั้งหมดไปยัง Edits.images: upload จะ ใช้ข้อกำหนดใหม่กับไอคอนโดยอัตโนมัติ หลังจากวันที่ 17 มิถุนายน 2019 คุณควรจะอัปโหลดเฉพาะไอคอนที่เข้ากันได้กับข้อกำหนดใหม่

ดาวน์โหลดเทมเพลตและทรัพยากร

โปรดดาวน์โหลดเทมเพลตเนื้อหาที่มีให้รายการใดรายการหนึ่งต่อไปนี้เพื่อเริ่มต้นใช้งาน