top of page
รูปภาพนักเขียนKittikoon Pakdeekaew

ทำความรู้จัก เบนโตะกริด (Bento Grid)

อัปเดตเมื่อ 15 พ.ย.

เบนโตะกริดคืออะไร?


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



ตัวอย่างที่ถูกใช้งานบ่อยๆก็คือ เบนโตะกริดจากสเปคของสินค้าจาก Apple ซึ่งใช้ช่องกริดในการแบ่งข้อมูลสเปคเครื่อง และคุณสมบัติได้สนุกทีเดียว หรือ เบนโตะกริดจาก โทรศัพท์ Windows Phone 8 ซึ่งมีไอคอน สี ตัวเลข ตัวอักษรที่ชัดเจน ดูสะอาด เรียบง่าย สบายตา


ความสบายตา และความสะดวกในการเข้าถึง (User friendly) ข้อมูลที่หลากหลายจึงเป็นข้อดีที่เบนโตะกริดมอบให้ผู้ใช้งาน อีกทั้งการขยายสัดส่วนเพื่อขับเน้นเนื้อหาสำคัญ ทำได้ง่ายและยังคงสัดส่วนความสัมพันธ์ของรูปร่างเอาไว้ ตอบปัญหาเรื่องการลำดับความสำคัญภาพ (Visual Hierachy) ได้เป็นอย่างดี ที่มากกว่านั้นการออกแบบร่วมกับการแสดงผลขนาดต่างๆ (Responsive Design) ยังจัดการได้ง่ายขึ้นอีกด้วย


มาดูตัวอย่างงานที่น่าสนใจจาก Apple


เริ่มจากการเน้นใช้สีที่สดใสขึ้นช่วยดึงดูดสายตาผู้ชมให้เข้าหาข้อมูลในฐานะงานพาดหัว (Heading) และส่วนประกอบต่างๆที่เป็นไอคอน และรูปภาพเป็นส่วนประกอบกระจายอยู่รอบๆเป็นสีที่อ่อนลง


อีกตัวอย่าง จาก Bolt

อีกหนึ่งความน่าสนใจคือการใช้งานกับ Art direction ที่ต้องการเสนอมุมมองที่หลากหลาย เบนโตะกริดก็เป็นทางเลือกที่น่าสนุกไม่น้อย


การใช้เบนโตะกริด (Bento Grid) เป็นตัวช่วยจัดการข้อมูลที่เหมาะกับการจัดระเบียบข้อมูลเป็นจำนวนมาก เช่น สินค้าที่หลากหลาย ข้อมูลทางเทคนิค รูปภาพต่างๆ แต่ยังมีรูปแบบการจัดการข้อมูลด้วยระบบกริดอีกหลายแบบที่น่าสนใจ ถ้ามีเวลาครั้งหน้าจะลองเอาตัวอย่างมาให้ชมอีกนะครับ


ขอบคุณครับ


⚈ FB/ IG/ LINE : @gu.groundup

⚈ Chat with Us : https://lin.ee/w6b8e0b


 

Teng Kittikoon Pakdeekaew

Designer



Comments


bottom of page