การออกแบบการยืนยันที่มีการคุ้มครอง

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

หลักเกณฑ์ต่อไปนี้ใช้ชุดแบบอักษร Roboto ซึ่งคุณสามารถดาวน์โหลดได้จาก fonts.google.com

UI ที่มีปุ่มฮาร์ดแวร์

การยืนยันที่ปลอดภัยของ Android สามารถใช้ปุ่มฮาร์ดแวร์ในอุปกรณ์เพื่อยืนยันและยกเลิกการป้อนข้อมูล

เลย์เอาต์การออกแบบ

ไอคอน

ไอคอนโล่

ไอคอน ไอคอนโล่ยืนยันที่ปลอดภัย
ดาวน์โหลด เกราะคุ้มครองความปลอดภัย
ขนาดไอคอน 32dp

ไอคอนลูกศร

ไอคอน ไอคอนลูกศรบนแป้นพิมพ์
ดาวน์โหลด แป้นพิมพ์ลูกศรขวา
ขนาดไอคอน 24dp
รัศมีมุมของคอนเทนเนอร์ 4dp

ป้อนข้อความ

อินพุตที่ใช้ในการยืนยันที่ปลอดภัยมี 2 ประเภท ได้แก่ ยืนยันและยกเลิก

สตริงการยืนยัน

ข้อความนี้ต้องระบุปุ่มที่ใช้เป็นการยืนยัน

ข้อความ กด (ปุ่ม) 2 ครั้งเพื่อยืนยัน
ความยาวสูงสุด ข้อกำหนด: ข้อความยืนยันต้องไม่เกิน 2 บรรทัด
สี #000000 87%
แบบอักษร Roboto-Medium
ขนาดแบบอักษร ข้อกำหนด: 14sp
ความสูงของบรรทัด ข้อกำหนด: 20dp

ยกเลิกสตริง

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

ข้อความ ยกเลิก
สี #000000 87%
แบบอักษร Roboto-Medium
ขนาดแบบอักษร ข้อกำหนด: 14sp
ความสูงของบรรทัด ข้อกำหนด: 20dp

ข้อความส่วนหัว

ใส่ข้อความส่วนหัว Android Protected Confirmation ใน UI ที่เชื่อถือได้เพื่อระบุฟีเจอร์ ใช้พร็อพเพอร์ตี้ต่อไปนี้สำหรับข้อความส่วนหัว

ข้อความ ข้อกำหนด: Android Protected Confirmation
สี #000000 87%
แบบอักษร Roboto-Regular
ขนาดแบบอักษร ข้อกำหนด: 22sp
ความสูงของบรรทัด ข้อกำหนด: 28dp

ข้อความเนื้อหา

ใช้พร็อพเพอร์ตี้ต่อไปนี้เมื่อติดตั้งใช้งานองค์ประกอบข้อความเนื้อหา ข้อความจริงเขียนโดยนักพัฒนา API (นักพัฒนาแอป)

ข้อความ ข้อความเนื้อหามาจากนักพัฒนาแอปที่เรียกใช้การยืนยันที่ได้รับการปกป้อง
สี #000000 87%
แบบอักษร Roboto-Regular
ขนาดแบบอักษร ข้อกำหนด: 16sp
ความสูงของบรรทัด ข้อกำหนด: 24dp

ข้อความส่วนหัวย่อย

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

ข้อความ ข้อกำหนด: การยืนยันนี้จะเพิ่มความปลอดภัยอีกชั้นให้กับการดำเนินการที่คุณกำลังจะทำ
ความยาวสูงสุด ข้อกำหนด: ข้อความยืนยันต้องไม่เกิน 4 บรรทัด
สี #000000 87%
แบบอักษร Roboto-Regular
ขนาดแบบอักษร ข้อกำหนด: 14sp
ความสูงของบรรทัด ข้อกำหนด: 20dp

UI ที่มีปุ่มซอฟต์แวร์

การยืนยันที่ปลอดภัยของ Android สามารถใช้ปุ่มซอฟต์แวร์เพื่อยืนยันและยกเลิกการป้อนข้อมูล หลักเกณฑ์ต่อไปนี้อธิบาย UI โดยใช้ปุ่มซอฟต์แวร์

เลย์เอาต์การออกแบบซอฟต์แวร์ UI สำหรับการยืนยัน

ไอคอนโล่

ดาวน์โหลดชิ้นงานไอคอนได้ที่ Android Protected Confirmation Shield Icon วางไอคอนที่ด้านบนของหน้าจอ

ไอคอนโล่

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

อินพุต

ขนาดปุ่มซอฟต์แวร์

ใช้รูปแบบปุ่มหลักและรองสำหรับการป้อนข้อมูลยืนยันและยกเลิก

ป้ายกำกับปุ่ม ใช้อักษรตัวพิมพ์ใหญ่เฉพาะคำแรกสำหรับป้ายกำกับปุ่ม
รัศมีของปุ่ม 4dp
สีเฉพาะจุด #1a73e8
แบบอักษร Roboto-Medium
ขนาดแบบอักษร ข้อกำหนด: 14sp

ข้อความส่วนหัว

ใส่ข้อความส่วนหัว Android Protected Confirmation ใน UI ที่เชื่อถือได้เพื่อระบุฟีเจอร์ ใช้พร็อพเพอร์ตี้ต่อไปนี้สำหรับข้อความส่วนหัว

ข้อความ ข้อกำหนด: Android Protected Confirmation
สี #000000 87%
แบบอักษร Roboto-Medium
ขนาดแบบอักษร ข้อกำหนด: 24sp
ความสูงของบรรทัด ข้อกำหนด: 20dp

ข้อความเนื้อหา

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

ข้อความ ข้อความเนื้อหามาจากนักพัฒนาแอปที่เรียกใช้การยืนยันที่ปลอดภัย
สี #000000 87%
แบบอักษร Roboto-Medium
ขนาดแบบอักษร ข้อกำหนด: 16sp
ความสูงของบรรทัด ข้อกำหนด: 24dp

ข้อความส่วนหัวย่อย

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

ข้อความ ข้อกำหนด: การยืนยันนี้จะเพิ่มความปลอดภัยอีกชั้นให้กับการดำเนินการที่คุณกำลังจะทำ
ความยาวสูงสุด ข้อกำหนด: ข้อความยืนยันต้องไม่เกิน 4 บรรทัด
สี #000000 54%
แบบอักษร Roboto-Medium
ขนาดแบบอักษร ข้อกำหนด: 14sp
ความสูงของบรรทัด ข้อกำหนด: 20dp

การแปล

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