กลับไปหน้า Design
ทริคDesign

แนวทางอัตลักษณ์องค์กร (CI Guidelines)

CI guidelines ช่วยให้โลโก้ สี ฟอนต์ และกติกาการใช้งาน เป็นแบบเดียวกันในทุกชิ้นงานของทีม.

เริ่มอ่านตรงนี้ก่อน

อธิบายแบบง่าย

แนวทางอัตลักษณ์องค์กร (CI Guidelines) คือเรื่องที่ช่วยให้เราใช้ทำหน้าจอให้อ่านง่าย ใช้ง่าย และไม่สับสนได้ถูกทางขึ้น

ระดับ

เหมาะกับคนเริ่มต้น

ใช้เมื่อไหร่

ตอนคุณเตรียม dashboard หรือแอปภายในให้ทีมใช้

อ่านแล้วทำอะไรต่อ

ใช้สีหลักหนึ่งสีกับปุ่มงานสำคัญ ใช้สีกลาง ๆ กับพื้นหลังของแผง และใช้สีที่สื่อความหมายกับสถานะ

เห็นภาพ: ทริคนี้เป็นยังไง

  1. 1เลือกชุดสีแบรนด์Betagro Green เป็นหลัก
  2. 2กำหนดบทบาทของสีหลัก / รอง / เน้น / พื้น
  3. 3ตรวจ contrastตัวอักษรอ่านง่าย ผ่าน WCAG
  4. 4ส่งออกเป็น tokenใช้ซ้ำทุกงาน

▶ เล่นอัตโนมัติ · ชี้เมาส์เพื่อหยุด · กดแถบด้านบนเพื่อข้ามขั้น

โครงกฎสีมาตรฐานสำหรับ dashboard

ใช้ตอนไหน?

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

ความหมาย

CI guidelines (กฎมาตรฐานของแบรนด์) คือชุดกฎที่บอกว่าแบรนด์ควรปรากฏอย่างไรในเอกสาร แอป รายงาน dashboard (หน้าจอสรุปข้อมูล) และไฟล์ที่ใช้ร่วมกันในทีม

ส่วนต่าง ๆ ของกฎมาตรฐาน

เริ่มจากกฎที่ใช้ซ้ำได้และส่งผลกับทุกชิ้นงาน

Logo -> Color -> Font -> Spacing -> Usage rules

ตัวอย่างการใช้

กฎมาตรฐานสำหรับ dashboard

ใช้สีหลักหนึ่งสีกับปุ่มงานสำคัญ ใช้สีกลาง ๆ กับพื้นหลังของแผง และใช้สีที่สื่อความหมายกับสถานะ

ลองเล่นดู