Consistency and Patterns
ใช้องค์ประกอบซ้ำแบบเดิมทั้งระบบ เพื่อลดการเรียนรู้ใหม่ของผู้ใช้
เริ่มอ่านตรงนี้ก่อน
อธิบายแบบง่าย
Consistency and Patterns คือเรื่องที่ช่วยให้เราใช้ทำหน้าจอให้อ่านง่าย ใช้ง่าย และไม่สับสนได้ถูกทางขึ้น
ระดับ
เหมาะกับคนที่ต้องตรวจงานหรือวางมาตรฐาน
ใช้เมื่อไหร่
แต่ละหน้าทำปุ่ม/สี/ระยะไม่เหมือนกัน ดูเหมือนคนละระบบ
อ่านแล้วทำอะไรต่อ
กำหนดปุ่ม primary/secondary หน้าตาและพฤติกรรมเดียว ทุกหน้าหยิบไปใช้ พอผู้ใช้เรียนรู้ปุ่มในหน้าแรกแล้ว ก็ใช้ทุกหน้าได้ทันทีโดยไม่ต้องเดา
ใช้ตอนไหน?
- แต่ละหน้าทำปุ่ม/สี/ระยะไม่เหมือนกัน ดูเหมือนคนละระบบ
- ทีมหลายคนทำหน้าจอแยกกัน อยากให้ออกมาเป็นแนวเดียว
- ผู้ใช้สับสนเพราะของแบบเดียวกันทำงานต่างกันในแต่ละหน้า
ความหมาย
ความสม่ำเสมอ (consistency) คือการใช้ปุ่ม สี ระยะห่าง และคำพูดแบบเดิมในทุกหน้า ส่วนแพตเทิร์น (pattern) คือวิธีแก้ปัญหาเดิมๆ ที่ใช้ซ้ำได้ เช่น รูปแบบฟอร์มหรือตารางมาตรฐาน พอผู้ใช้เจอของหน้าตาเดียวกันทำงานเหมือนกันทุกที่ ก็ไม่ต้องเรียนรู้ใหม่ทุกหน้า ทำงานได้เร็วและผิดน้อยลง
สร้างมาตรฐานที่ใช้ซ้ำ
รวบรวมองค์ประกอบที่ใช้บ่อย (ปุ่ม การ์ด ฟอร์ม สี ระยะ) เป็นชุดมาตรฐานหรือ design system แล้วหยิบของชุดเดิมมาใช้ซ้ำทุกหน้า แทนการออกแบบใหม่ทุกครั้ง
design system = แหล่งความจริงเดียว
- ปุ่ม: รูปแบบ primary/secondary เดียวทั้งระบบ
- สี/ระยะ: ใช้ token เดิม (ตัวแปรค่าสี/ระยะที่ตั้งชื่อไว้)
- แพตเทิร์น: ฟอร์ม/ตารางมาตรฐานหยิบมาใช้ซ้ำ
กฎ: ถ้าทำซ้ำ 3 ครั้ง → ยกเป็นแพตเทิร์นตัวอย่างการใช้
ชุดปุ่มมาตรฐานของทีม
กำหนดปุ่ม primary/secondary หน้าตาและพฤติกรรมเดียว ทุกหน้าหยิบไปใช้ พอผู้ใช้เรียนรู้ปุ่มในหน้าแรกแล้ว ก็ใช้ทุกหน้าได้ทันทีโดยไม่ต้องเดา