วิธีทางวิทยาศาสตร์กับ UX design โดย Dr. Susan Weinschenk


 

Dr. Susan Weinschenk (นักจิตวิทยาและ cognitive scientist ) อธิบายวิธีที่เธอเอาวิธีทางวิทยาศาสตร์มาใช้กับการออกแบบประสบการณ์ (UX Design)


Disclamer : ผมมีการเสริมข้อมูลบางอย่างเพิ่มเข้าไป เนื่องจากต้นฉบับที่ได้มาค่อนข้างถูกรวบรัดมาแล้ว และบางอย่าง Context ค่อยข้างไม่เหมาะกับทั้งคยไทยและในมุมของ UX Design{alertWarning}

ก่อนอื่นเลย อยากให้อ่านเรื่องราวเรื่องนึงก่อน ซึ่งต้นฉบับเป็นช้าง แต่เนื่องจากเราคนไทย อาจจะคุ้นชินกับช้างจนเกินไปแล้วผมจึงขอเปลี่ยนคำว่า “ช้าง” เป็น “ไบซัน“ ละกัน และเปลี่ยน Context ให้นิดหน่อย

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

“อะไรคือไบซัน” ชายคนนึงตะโกนถาม พระราชาตอบว่า “เจ้าจงสัมผัสมันแล้วอธิบายให้ข้าฟัง”

ชายคนที่จับที่ขาบอกว่า “ขามันแข็งแกร่งเหมือนเสาบ้าน” ชายคนที่จับหางบอกว่า “หางมันเป็นเส้นๆเหมือนเชือก” ชายคนที่สัมผัสหน้าบอกว่า “หน้ามันสั้นเหมือนหน้าผา” ชายคนที่จับลำตัวบอกว่า “ผิวมันเหมือนพรมที่ชำรุดแล้ว” ชายคนที่จับหลังบอกว่า “หลังมันเหมือนเนินเขา” และชายคนที่จับเขาบอกว่า “มันมีเขาที่แหลมคมและแข็งเหมือนหอก”

พระราชาตอบ “คำตอบของพวกเจ้าถูกหมด พวกเจ้าแต่ละคนสัมผัสแค่คนละส่วนของไบซันเท่านั้น”

เรื่องสมมุติข้างบนเป็นตัวอย่างที่แสดงให้เห็นว่า คนรับรู้สิ่งเดียวกันต่างมุมมอง ต่างการศึกษา และต่างประสบการณ์ ดังนั้น Visual designer, UX designer, หรือ Developer จึงอาจมีการเข้าถึงเรื่องเดียวกันและมีความเข้าใจในมุมที่ต่างไป



1. ผู้คนไม่ต้องการทำงานหรือคิดมากเกินไป ถ้ามันไม่จำเป็นจริงๆ

  • คนเลือกที่จะทำงานแค่พอทำให้งานหรือ Task เสร็จ
  • ควรแสดงข้อมูล (Infomation)ให้กับคนดูให้น้อยที่สุด แต่ให้เขามีโอกาสเลือกที่จะดูข้อมูลเพิ่มเติม ซึ่งในทาง UX มีเทคนิคที่เรียกว่า “progressive disclosure” ถ้ามีโอกาสจะเขียนเรื่องนี้เพิ่มเติม
  • แทนที่จะพูดเพื่ออธิบายอะไรบางอย่าง ให้เลือกที่จะโชว์หรือสาธิตให้เค้าดูดีกว่า หรือให้ดียิ่งกว่าคือให้เค้าลองด้วยตัวเอง
  • ให้ความสำคัญกับ Affordance ของวัตถุบนหน้าจอ หรือ Page ที่คุณออกแบบ. เพราะว่า Affordance คือสิ่งที่สามารถสังเกตได้ชัดว่ามีไว้เพื่อมีปฎิสัมพันธ์ (Interaction) ด้วย หรือพูดง่ายๆคือมีไว้เพื่อบังคับหรือใช้งาน ตัวอย่างคือ ปุ่มบนหน้าจอนั้นเอง
  • ให้มีแค่ Feature ที่คนต้องใช้จริงๆ ถ้า Feature ใดๆที่เกิดจากความเห็นของคุณ หรือคนในทีม ให้ทำ User Research เพื่อ Validate ก่อน มีสิ่งที่คนใช้งานไม่ต้องการมีแต่จำทำให้งานคุณดูรก และยุ่งเหยิง
  • พยายามให้มี “ค่าเริ่มต้น” หรือ “Default” รอไว้เสมอ เวลามีค่า Default คนใช้งานจะรู้สึกว่าใช้ง่ายขึ้นและรู้สึกว่าไม่ต้องคิดเยอะ

2. ผู้คนมีข้อจำกัดในตัวเอง

  • เมื่อมีข้อมูลจำนวนมาก หรือมีอะไรที่จะต้องอ่านเยอะเกินไป คนมักจะสูญเสียสมาธิหรือความสนใจไปก่อน ให้แตกงานออกมาเป็นขั้นๆ และแสดงข้อมูลแค่พอจำเป็นในแต่ละขั้นตอนก็พอ
  • การจัดเรียงข้อมูล หรือเนื้อหาเป็นสิ่งสำคัญ ควรจัดวางให้มีลักษณะที่อ่านผ่านๆได้ง่าน หรือ Easy to scan เช่นมี จัดให้มีหัวข้อ (Headers) และย่อหน้า ตามเนื้อหาหรือข้อมูล
  • การเขียน ประโยคหรือย่อหน้าอย่าให้ยาวสุดหน้าจอ (ซ้ายไปขวา) จนเกินไป
  • คนไม่สามารถทำหลายๆอย่างพร้อมกันได้ (Multi-task) ถึงแม้ว่าคนบางคนบอกว่าทำได้ แต่จากงานวิจัย. ชี้ชัดว่าอย่าไปคาดหวังว่าคนจะทำได้
  • ในขณะที่คนส่วนใหญ่ชอบประโยคสั้นๆ แต่เค้ากลับอ่านประโยคยาวได้ดีกว่า ดังนั้นต้องมาชั่งน้ำหนักว่าเราจะเน้นไปที่ความชอบหรือว่าประสิทธิภาพ แต่รู้ไว้ด้วยว่าคนมักจะขอสิ่งที่อาจจะไม่ได้ดีที่สุดสำหรับเค้าจริงๆ

3. ผู้คนทำผิดพลาด

  • สันนิษฐานไว้เสมอว่าผู้คนมักทำผิดพลาด นึกเอาไว้และพยายามป้องกันไม่ให้เกิดขึ้น ถ้าเกิดสิ่งในที่อาจจะทำให้เกิดผลลัพท์ที่ดูร้ายแรง หรือเสียหาย ให้มีการยืนยันก่อนดำเนินการต่อทุกครั้ง
  • บางครั้งเราอาจจะมีปุ่ม ‘Undo’ เอาไว้
  • ป้องกันการเกิดข้อผิดพลาดย่อมดีกว่าช่วยหาทางให้ผู้ใช้งานกลับมาแก้ไขได้ภายหลัง “Error Message ที่ดีที่สุดคือการที่ทำให้ไม่มี Error เลย”
  • ถ้า Task ดูยากหรือเสี่ยงต่อข้อผิดพลาด ให้แตก Task ออกมาทำทีละนิด
  • ถ้าผู้ใช้งานทำผิดพลาดแล้วเราสามารถช่วยแก้ไขได้ ให้ทำเลย แล้วแสดงให้ดูว่าแก้ไขอะไรไป
  • แม้แต่ UX designer ก็อาจจะทำผิดพลาดได้เหมือนกัน ดังนั้นเผื่อเวลาและแรงงานในการทำ User testing และกลับมาพัฒนาเรื่อยๆ (Iteration)

4. ความจำของคนมีความซับซ้อน

  • ความจำของคนมีการสร้างใหม่ตลอดเวลา นั้นก็หมายถึงมีการเปลี่ยนแปลงตลอด คุณสามารถเชื่อสิ่งที่ผู้ใช้งานบอกกับคุณได้ไม่ทั้งหมด ให้ดีที่สุดคือการสังเกตุดูการกระทำและการตอบสนองมากกว่าสิ่งที่เค้าบอก
  • ความจำบอบบาง และค่อยๆหายไปอย่างรวดเร็ว เท่านั้นไม่พอบางทีความจำยังมีผิดๆถูกๆเสียอีก ดังนั้นอย่าทำให้ผู้ใช้งานต้องจำอะไรเยอะแยะ หรือต้องจำข้อมูลจากหน้านึงเพื่อมาทำอะไรบางอย่างอีกหน้านึง
  • คนส่วนใหญ่จะสามารถจำได้ 3-4 อย่าง ณ.ช่วงเวลานึง ดังนั้นกฎ 7 plus or minus 2” หรือ “เจ็ดบวกลบสอง” จึงใช้ได้ตลอด พยายามอย่าให้มีอะไรที่มากกว่านี้ ให้ดีที่สุดคือ 3-4 อย่างก็พอ

5. ผู้คนเป็นสัตว์สังคม

  • คนพยายามใช้เทคโนโลยีเพื่อเชื่อมต่อกับสังคมอยู่เรื่อยๆ ลองนึกถึงเทคโนโลยีอย่าง โทรเลข โทรศัพท์ Facetime จนมาถึง Metaverse สิ
  • คนมองหาคนอื่นๆเพื่อเป็นแนวทางว่าอะไรเป็นสิ่งที่ควรทำหรือให้ความสนใจ โดยเฉพาะเวลาที่มีความไม่แน่นอนเกิดขึ้น สิ่งนี่เรียกว่า Social Valdation ดังนั้นพวก Review, Rating จึงมีอิทธิพลมากในการตัดสินใจ
  • ถ้าคนมากกว่าหนึ่งคนทำอะไรเหมือนกันในเวลาเดี่ยวกัน (Synchonus Behavior) จะเกิดการเชื่อมต่อทางสัมพันธ์ขึ้น ซึ่งความสัมพันธ์นี้เกิดจากปฎิกิริยาเคมีในสมอง เช่น การหัวเราะร่วมกัน
  • ถ้าคุณทำอะไรบางอย่างเป็นพิเศษให้ผม ผมจะรู้สึกติดหนี้อะไรบางอย่างซึ่งอยากจะให้กลับไปเหมือนกัน (reciprocity)
  • เวลาที่คุณมองใครสักคนทำอะไร ส่วนเดี่ยวกันของสมองก็จะคิดตามในลักษณะที่คุณกำลังสิ่งนั้นด้วยเหมือนกัน (mirror neurons) เพราะเราถูกออกแบบมาแบบนั้น ดังนั้นถ้าอยากให้เค้าทำอะไร ให้แสดงหรือโชว์ว่ามีบางคนก็ทำแบบนั้นอยู่เหมือนกัน

6. ความสนใจ

  • Susan เชื่อว่า ความสนใจหรือ Attention เป็นหัวใจสำคัญของการออกแบบ User Interface และจะต้องพยายามให้ไม่มี หรือเกิดอะไรขึ้นมากวนสมาธิ
  • ผู้คนถูกโปรแกรมมาให้ตอบสนองหรือสนใจกับสิ่งที่แตกต่าง หรือสิ่งใหม่ๆ
  • เมื่อคนตอบสนองกับสิ่งเร้าที่แตกต่างหรือสิ่งใหม่แล้ว สมองของคนนั้นจะอยู่ในสถานะที่ตั้งใจสูงจนไม่วสามารถสังเกตุเห็นการเปลี่ยนแปลงรอบข้างอื่นๆ มีการทดลองน่าสนใจคือ การเปลี่ยนคนสอบถามทิศทาง ชายหนุ่มในวีดีโอได้สอบถามทางกับชายแก่ ในขณะที่ชายแก่กำลังอธิบายเส้นทาง ก็มีคนขนประตูซึ่งในที่นี้ทำหน้าที่เหมือนเป็นฉากบังชั่วขณะ และชายหนุ่มคนนั้นก็แอบสลับตัวกับอีกคนหนึ่งทันที บทสนทนายังคงดำเนินต่อไปโดยที่ชายแก่ไม่ได้สังเกตุเลยว่าเค้ากำลังคุยกับอีกคนหนึ่ง สิ่งนี้เรียกว่า Change Blindness


  • นอกจากการเปลี่ยนแปลงแล้วยังสามารถใช้ สีที่สว่าง ตัวหนังสือที่ตัวใหญ่ เสียงเตือนต่างๆในการดึงความสนใจได้
  • เพราะคนถูกโปรแกรมมาให้สนใจกับสิ่งเร้าอย่างที่ได้กล่าวไป ดังนั้นเค้าจะเสียสมาธิหรือความสนใจได้ง่ายๆเมื่อมีอะไรมาสะดุด

7. ผู้คนโหยหาข้อมูล

  • Dopamine เป็นสารเคมีที่หลั่งในสมองที่ทำให้ผู้คนรู้สึกดี มีความสุข เวลาที่เรากินอาหารที่อร่อย ขณะมีSex และการรับข้อมูลข่าวสารบางอย่าง
  • สาเหตุที่การรับรู้ข้อมูลข่าวสารบางอย่างทำให้คนรู้สึกดีก็คือ เวลามีข้อมูลเยอะคนจะรู้สึกว่ามีตัวเลือกเพิ่มขึ้น และการมีตัวเลือกเพิ่มขึ้นทำให้คนรู้สึกว่าสิ่งนั้นเค้าสามารถควบคุมได้ (Feeling in Control) และความรู้สึกควบคุมได้ก็ส่งผลต่อความรู้สึกถึงสัญชาตญาณการเอาตัวรอดได้ดีขึ้น
  • คนต้องการการตอบสนองหรือ Feedback เช่นคนไม่จำเป็นต้องรู้หรอกว่าคอมพิวเตอร์กำลังคำนวนอะไรอยู่ แค่ต้องการรู้ว่ามันกำลังทำงานถึงไหนแล้ว

8. การประมวลผลแบบไม่รู้ตัว

  • การประมวลผลทางสมองส่วนใหญ่เป็นไปอย่างอัตโนมัติโดยที่เราไม่รู้ตัว และไม่สามารถควบคุมได้
  • ถ้าคุณาสามารถทำให้คนเริ่มทำอะไรบางอย่างเล็กๆน้อยๆ ก็จะมีความเป็นไปได้สูงที่เขาจะทำต่อในก้าวใหญ่ๆ ถัดไป เช่น แม่ค้าขายอาหารทำตัวอย่างให้คุณชิมฟรี เมื่อคุณหยุดชิมก็จะมีโอกาสสูงที่คุณอาจจะซื้ออาหารนั้นกลับบ้าน
  • Susan ได้แบ่งแยกสมองของคนเป็นสองส่วนคือ Old Brain และ New Brain ซึ่งหน้าที่ในการตัดสินใจส่วนใหญ่จะเป็นของ Old Brain และเป็นไปอย่างอัตโนมัติ เช่น การตอบสนองต่อการเอาตัวรอด ภาวะทางอารมณ์และสัญชาติญาน
  • อีกส่วนหนึ่งเรียกว่า New Brain ซึ่งเป็นสมองส่วนที่เพิ่งวิวัฒนาการขึ้นใหม่ ทำหน้าที่ในการคิด การวางแผน การแก้ปัญหา การหาเหตุและผล การคำนวน และอื่นๆ ดังนั้นการทำงานและการตอบสนองจะค่อนช้ากว่า Old Brain เอามากๆ จึงไม่แปลกที่ความสนใจของคนหรือ Attention จะส่งผลโดยตรงและอย่างรวดเร็วไปยัง Old Brain เนื่องจากเป็นส่วนที่ตอบสนองเร็วที่สุด (ถ้าสนใจเรื่องแนวนี้ผมแนะนำหนังสือของ Thinking, Fast and Slow ของ Daniel Kahneman)
  • นอกจากนี้ Old Brain ยังมีส่วนที่เรียกว่า Limbic System ที่มี amygdala, hippocampus และ hypothalamus ที่ทำหน้านี้ควบคุมการตอบสนองทางด้านพฤติกรรมและอารมณ์
  • ภาพและเรื่องราวสามารถส่งผลต่ออารมณ์และความรู้สึกผ่านสมองของคน ซึ่งมีปัจจัยสำคัญที่ส่งผลต่อการตัดสินใจของคน
  • มีหลายตัวแปรที่ส่งผลต่อพฤติกรรมของคนโดยที่เราไม่รู้ตัว ตัวอย่างที่จะให้ต่อไปนี้อาจจะไม่ส่งผลโดยตรงกับคนไทยเท่าไร เพราะเป็นตัวอย่างเคสใน USA เช่นคำว่า “retired”, “Florida,” และ “tired” สามารทำให้คนหนุ่มสาวเดินช้าลง เพราะรัฐ Forida ขึ้นชื่อว่าเป็นสถานที่ปลดเกษียนของชาว USA (ปรากฏการณ์นี้เรียกว่า Framing Effect.)

9. ผู้คนสร้างแบบแผนความคิดของตัวเอง (Mental Models)

  • Mental Models คือแบบแผนความคิดของคนๆนึงต่อความเข้าใจในการทำงานของสิ่งต่างๆ ซึ่ง Mental model ของแต่ละคนต่อการทำอะไรบางอย่าง (Tasks) อาจจะส่งผลต่อความรู้สึกต่อการใช้งาน ยาก/ง่าย ไม่เหมือนกันได้ เช่น การสั่งอาหารผ่านแอพสีเขียวอาจจะง่ายสำหรับ User A แต่กลับยากสำหรับ User B ก็ได้
  • คุณสามารถใช้ Mental Model ในการออกแบบ UX ที่ดีโดยการทำ Conceptual Model ของ Product หรือ App ที่ออกแบบตรงกับ Mental Model ของผู้ใช้งานส่วนใหญ่ได้ หรือออกแบบวิธี “สอน” ผู้ใช้งานที่มี Mental Model ที่แตกต่างออกไป
  • คำอุปมา หรือ Metaphors ช่วยให้ผู้ใช้งานเห็นภาพ และเข้าใจ conceptual model มากขึ้น เช่น ลูกค้าคือพระเจ้า หรือกินเนื้อจระเข้รสชาติเหมือนกินเนื้อไก่
  • วิธีที่ดีที่สุดในการเช้าถึง Mental Model ของผู้ใช้งานคือการทำ User Research

10. Visual System

  • ถ้าข้อมูลดูกองๆรวมกัน ทำให้ผู้ใช้งานอ่านหรือหาข้อมูลที่ต้องการยาก ให้ใช้การจัดกลุ่ม (Grouping) เพื่อช่วยผู้ใช้งานมองแยกเนื้อหา และเห็นส่วนที่สำคัญง่ายขึ้น (Gestalt laws of grouping)
  • เลือกใช้ Font ที่มีขนาดเหมาะสม และอ่านง่าย คิดถึงระยะการมอง ขนาดหน้าจอ และเงื่อนไขทางกายภาพของผู้ใช้งาน เช่น สายตากับผู้สูงอายุ
  • งานวิจับพบว่า คนใช้การมองเห็นรอบข้าง (peripheral vision) เพื่อทำความเข้าใจ “ใจความหรือแก่น” ของสิ่งที่เค้ากำลังมองอยู่ด้วย ดังนั้นถึงแม้ว่าการทดลองทำ Eye tracking จะน่าสนใจแค่ไหน ไม่ได้หมายความว่าสิ่งที่คนกำลังมองอยู่จะเป็นสิ่งที่เค้ากำลังสนใจเสมอไป
  • Susan บอกว่าสีมองยากที่สุดถ้าอยู่ด้วยกันคือ แดงกับน้ำเงิน ดังนั้นให้หลีกเลี่ยงการใช้ Font สีแดงบนพื้นหลังสีน้ำเงิน *** แต่ผมไม่เห็นด้วยทั้งหมด เราควรมองไปที่ Contrast Ratio ของสี (อย่างน้อย 4.5:1) พร้อมๆ กับขนาดของตัว Font ด้วยมากกว่า และปัจจุบันมีเวบและตัวช่วยในการคำนวนค่า Contrast มากมาย
  • ผู้คนสามารถจดจำวัตถุบนหน้าจอได้ดีเวลาที่เค้าเห็นวัตถุนั้นมีมิติของมุมเอียงๆเล็กน้อย หรือมี Perspective ที่ค่อยไปทางมุมด้านบน (canonical perspective).


  • สีสามารถใช้เพื่อสร้าง Harmony หรือใช้เพื่อสร้างทิศทางของข้อความที่จะสื่อได้ได้ แต่พยายามอย่าใช้แค่วิธีเดียว ให้มองหาวิธีอื่นสำหรัลคนที่มีเงื่อนไขทางกายภาพ เช่น สำหรับคนตาบอดสีด้วย ตัวอย่างError Message ที่เป็นสีแดงอย่างเดียวอาจจะไม่เพียงพอในการแจ้งเตือนผู้ใช้งานที่ตาบอดสี ให้ใช้สัญญลักษณ์อื่นๆประกอบด้วย เช่น ❌  หรือ 🚫

Post a Comment

You can share any idea here.......

Previous Post Next Post

Contact Form