เครื่องมือแสดงตัวอย่างการออกแบบหน้าปัดนาฬิกา Garmin

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

นี่เป็นเพียงเครื่องมือแสดงตัวอย่างการออกแบบเท่านั้น ไม่เชื่อมต่อกับนาฬิกาจริง และไม่สร้างหน้าปัดที่สามารถติดตั้งได้

ตัวอย่างแสดงอะไรบ้าง

หน้าปัดใช้ผังที่หน้าปัดนาฬิกาทรงกลมส่วนใหญ่ใช้กัน:

• วันที่อยู่ด้านบน
• เวลาตัวใหญ่อยู่ตรงกลาง
• จำนวนก้าวและอัตราการเต้นของหัวใจอยู่เคียงข้างกันด้านล่าง
• ขอบหน้าปัดพร้อมขีดบอกชั่วโมงรอบขอบ

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

ทำไมต้องใช้โทนสีเข้ม

นาฬิกา Garmin ทรงกลมส่วนใหญ่ใช้จอแสดงผลแบบ memory-in-pixel หรือ OLED บนจอ OLED พื้นหลังสีเข้มจะใช้พลังงานน้อยกว่า เพราะพิกเซลสีดำจะถูกปิดไปเลย หน้าปัดสีเข้มยังอ่านง่ายกว่าเมื่ออยู่กลางแดดจ้า ซึ่งพื้นหลังสีอ่อนจะสะท้อนแสงจนแสบตา

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

ความเปรียบต่างและความสามารถในการอ่าน

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

อัตราส่วนนี้เปรียบเทียบค่าความสว่างสัมพัทธ์ของสีสองสี:

contrast = (L1 + 0.05) ÷ (L2 + 0.05)

L1 คือความสว่างของสีที่อ่อนกว่า และ L2 คือความสว่างของสีที่เข้มกว่า ผลลัพธ์มีตั้งแต่ 1:1 ซึ่งหมายถึงสีเหมือนกัน ไปจนถึง 21:1 สำหรับสีดำบนพื้นขาว

มีเกณฑ์สำคัญสองค่าที่ควรรู้:

• 3:1 คือค่าต่ำสุดสำหรับข้อความขนาดใหญ่
• 4.5:1 คือค่าต่ำสุดสำหรับข้อความขนาดปกติ

เวลาตัวใหญ่ ดังนั้นในทางทฤษฎี 3:1 ก็เพียงพอ แต่อัตราส่วนที่สูงกว่าจะดีกว่าเมื่ออยู่กลางแจ้ง ป้ายข้อความขนาดเล็กควรมีอัตราส่วน 4.5:1 ขึ้นไป

ตัวอย่าง

ลองพิจารณาพื้นหลังสี #0b1020 ซึ่งเป็นสีกรมท่าเข้มมาก ร่วมกับข้อความสีขาว #ffffff ความเปรียบต่างอยู่ที่ประมาณ 18:1 ซึ่งอ่านสบายในทุกสภาพแสง

เปลี่ยนสีของจำนวนก้าวเป็น #2a3a5e ซึ่งเป็นสีฟ้าที่ใกล้เคียงกับพื้นหลัง อัตราส่วนจะลดลงเหลือประมาณ 1.6:1 ตัวเลขจะแทบมองไม่เห็นในระยะห่างแขน และเครื่องมือจะแจ้งเตือนเรื่องนี้

ดาวน์โหลดดีไซน์

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

คำถามที่พบบ่อย

เครื่องมือนี้สร้างหน้าปัดที่ติดตั้งได้หรือไม่

ไม่ได้ เครื่องมือนี้สร้างเพียงภาพของการออกแบบเท่านั้น การสร้างหน้าปัดที่ติดตั้งได้ต้องใช้ Connect IQ SDK ของ Garmin หรือ Garmin Watch Face Builder

ทำไมตัวอย่างเป็นสี่เหลี่ยมจัตุรัสในขณะที่นาฬิกาเป็นทรงกลม

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

หน้าปัดนาฬิกาจริงควรมีขนาดเท่าใด

ขึ้นอยู่กับรุ่นของนาฬิกา จอแสดงผลทรงกลมของ Garmin ที่พบทั่วไปมีขนาด 240 คูณ 240, 260 คูณ 260 และ 416 คูณ 416 พิกเซล ตัวอย่างนี้ใช้ขนาด 320 คูณ 320 เป็นค่ากลาง

ทำไมสีของฉันดูต่างไปเมื่ออยู่บนนาฬิกาจริง

หน้าจอนาฬิกาแต่ละรุ่นมีความสว่างและการแสดงสีที่แตกต่างกัน และจอแบบ memory-in-pixel แสดงชุดสีได้จำกัด ควรใช้ตัวอย่างนี้เป็นแนวทาง แล้วตรวจสอบอีกครั้งบนหน้าจอจริง

ตัวเลขความเปรียบต่างหมายความว่าอย่างไร

เป็นอัตราส่วนตามมาตรฐานการเข้าถึง WCAG 2.1 ซึ่งเป็นมาตรวัดเดียวกับที่ใช้กับเว็บไซต์ ตัวเลขยิ่งสูงยิ่งอ่านง่ายขึ้น