ออกแบบเว็บไซต์อย่างไรให้ C.R.A.P.

ux-crap

ได้มีโอกาสอบรมคอร์สยูเอ๊กซ์ (UX: User Experience) 1 ในเนื้อหาสำคัญก็คือแนวทางการออกแบบเว็บไซต์หรือแอ๊พบนมือถือ (Mobile App) ว่า ทำให้แครพ (C.R.A.P.) เข้าไว้!

C.R.A.P. ในที่นี้ไม่ได้หมายถึงห่วยหรือแย่ แต่เป็นตัวย่อของแนวทางการออกแบบ 4 ข้อ

  • C (Contrast) ใช้ความโดดเด่นเพื่อดึงดูดผู้ใช้ให้มองเห็นสิ่งที่เป็นเป้าหมายหลักของเรา เช่น สีที่เด่นกว่า ขนาดใหญ่กว่า วางในตำแหน่งที่ดีกว่า
  • R (Repetition) จัดระเบียบส่วนต่างๆให้เป็นไปในแนวทางเดียวกัน ดูแล้วจะมีความเป็นมืออาชีพมากขึ้น และทำให้ผู้ใช้เรียนรู้ได้เร็วขึ้นเพียงใช้งานหน้าแรก (homepage) และสามารถนำไปใช้งานหน้าเว็บอื่นๆได้ง่าย เช่น อินสตาแกรม (Instagram) วางชื่อแอ๊คเค้าท์ด้านบน วางรูปตรงกลาง วางคอมเม้นต์ (comment) ด้านล่าง เหมือนๆกันในทุกรูป
  • A (Alignment) การจัดวางองค์ประกอบต่างๆ มีการจัดวางชิดซ้าย ขวา บน ล่าง ไปในแนวทางเดียวกัน เพื่อเพิ่มความสะดวกในการใช้งาน เช่น ผลการค้นหาจากกูเกิ้ล (Google) ชิดซ้าย โฆษณาอยู่ด้านขวา
  • P (Proximity) การจัดวางองค์ประกอบเพื่อให้มองเห็นความเชื่อมโยงกันของเนื้อหาหรือจัดหมวดหมู่ เพื่อความเข้าใจที่ง่ายขึ้นของผู้ใช้ เช่น การวางรูปภาพกับคำอธิบาย ไม่ควรห่างกันจนเกินไป จนทำให้รู้สึกว่าไม่เกี่ยวข้องกัน หรือการจัดหมวดหมู่โดยใช้การเยื้องซ้ายหรือขวา ก็จะทำให้เห็นว่าหัวข้อใดอยู่ภายใต้หมวดหมู่ใด

อย่างไรก็ตามการทดสอบโดยผู้ใช้งานตรงอย่างน้อย 1 คน ก็ยังดีกว่าการที่มโนภาพเอาเองว่าผู้ใช้ “น่าจะ” อยากได้ความสามารถนี้หรือนั้นจากเว็บไซต์ของเรา

รู้อย่างนี้แล้วมาทำเว็บหรือแอ๊พให้ “แครพ” กันเถอะ

สแลช (Slash)

Leave a comment