ออกแบบ UX/UI ให้ดีขึ้นง่ายๆ ด้วยหลักการ Mental Model

วิธีออกแบบ UX/UI ให้ดีขึ้น ด้วยหลัก Mental Model | Skooldio Blog - ออกแบบ UX/UI ให้ดีขึ้นง่ายๆ ด้วยหลักการ Mental Model

Mental Model คืออะไร?

มนุษย์เราจะจดจำการใช้งานสิ่งของแต่ละอย่าง จากรูปลักษณ์หน้าตา และประสบการณ์ที่เคยใช้หรือเคยเห็นมาก่อนหน้า

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

ยกตัวอย่างประสบการณ์ระยะสั้น

ประสบการณ์ระยะสั้น Mental Model | Skooldio Blog - ออกแบบ UX/UI ให้ดีขึ้นง่ายๆ ด้วยหลักการ Mental Model
เคสตัวอย่างขวดน้ำเชื่อม จากเหตุการณ์จริง
https://to.skooldio.com/5oi7dedOt6

ช่วงที่โควิดระบาดร้านค้าส่วนใหญ่จะวางขวดเจลล้างมือไว้ที่เคาท์เตอร์ เพื่อให้ลูกค้าทำความสะอาด คนก็จะคิดว่า “ถ้ามีขวดปั้มวางตรงเคาท์เตอร์ก็จะต้องเป็นเจลล้างมือ”
พอเราไปใช้บริการร้านที่วางขวด Syrup หน้าเคาท์เตอร์ ก็อาจจะเข้าใจว่า เป็นเจลล้างมือได้

หรือตัวอย่างประสบการณ์ระยะยาว

ประสบการณ์ระยะยาว Mental Model | Skooldio Blog - ออกแบบ UX/UI ให้ดีขึ้นง่ายๆ ด้วยหลักการ Mental Model
ถ้านึกไม่ออก นี่ไอค่อน Save จ้า
https://to.skooldio.com/sZCAYFpOt6

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

ออกแบบ ux ให้ตรงกับ user mental models | Skooldio Blog - ออกแบบ UX/UI ให้ดีขึ้นง่ายๆ ด้วยหลักการ Mental Model

จะรู้ได้ไงว่า Mental Model ของ User จะตรงกับที่เราออกแบบ Digital Product?

1. ทำ Usability Testing

user testing | Skooldio Blog - ออกแบบ UX/UI ให้ดีขึ้นง่ายๆ ด้วยหลักการ Mental Model

เพื่อยึดตามสิ่งที่ผู้ใช้คิดให้ทดสอบกับผู้ใช้โดยตรง “ถ้าจะทำ Action สักอย่าง เขาจะทำยังไง หรือใช้งานยังไง จากที่เคยใช้งานมา”

2. ทำ Card Sorting

card sorting | Skooldio Blog - ออกแบบ UX/UI ให้ดีขึ้นง่ายๆ ด้วยหลักการ Mental Model

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


แล้วเราจะลดความ Mismatch ระหว่าง Mental Model ของ User กับ Product เราได้ยังไง!?

1. ปรับ Design ให้ตรงกับสิ่งที่ User คิด

ปรับดีไซน์ให้ตรงกับสิ่งที่ user คิด | Skooldio Blog - ออกแบบ UX/UI ให้ดีขึ้นง่ายๆ ด้วยหลักการ Mental Model

2. มี Instructions หรือ Tutorials ช่วยแนะนำในการใช้งาน (โดยเฉพาะครั้งแรกที่ใช้งาน)

แนะนำการใช้งานครั้งแรก | Skooldio Blog - ออกแบบ UX/UI ให้ดีขึ้นง่ายๆ ด้วยหลักการ Mental Model

3. ค่อยๆ ปรับ Feature ใหม่ทีละนิด หรือ มีตัวเลือกให้ User เลือกได้

ปรับฟีเจอร์ทีละนิด | Skooldio Blog - ออกแบบ UX/UI ให้ดีขึ้นง่ายๆ ด้วยหลักการ Mental Model

ทั้งหมดนี้ก็เป็นเทคนิคการออกแบบ UX/UI ให้ดีขึ้นได้ โดยเข้าใจ Mental Model ซึ่งเป็นเพียงเนื้อหาส่วนหนึ่งในคอร์สเท่านั้น ยังมีหลักการพื้นฐานสำหรับการออกแบบ UX (User Experience) ให้ตอบโจทย์ผู้ใช้อีกมากที่จำเป็นต้องรู้ในคอร์ส UX Foundations

คอร์ส ux foundations รุ่นที่ 7 | Skooldio Blog - ออกแบบ UX/UI ให้ดีขึ้นง่ายๆ ด้วยหลักการ Mental Model