10 Usability Heuristics คือหลักการ 10 ข้อ ที่เป็นเทคนิคหนึ่งที่เอาไว้ตรวจสอบงานของดีไซน์ของเราได้ เพื่อหาข้อบกพร่องของการใช้งาน Interactive Design ได้แบบง่าย ๆ

1. Visibility of System Status

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

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

Tips

• สื่อสารให้ชัดเจน และไม่ควรจะมีผลกระทบอื่น ๆ ตามมาโดยที่ไม่ได้แจ้งผู้ใช้ให้ทราบ
• ตอบสนองให้เร็วที่สุดเท่าที่จะทำได้ (ทันทีถ้าเป็นไปได้)
• สร้างความไว้วางใจจากการสื่อสารที่ต่อเนื่อง

2. Match Between System and The Real World

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

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

เมื่อการออกแบบของเราตรงกับโลกความจริง ก็จะทำให้ผู้ใช้สามารถเรียนรู้และจดจำการทำงานได้ง่าย

Tips

• ควรจะแน่ใจว่าผู้ใช้เข้าใจความหมายโดยที่ไม่ต้องไปหาข้อมูลเพิ่มเติม
• อย่าเดา หรือคิดไปเองว่าผู้ใช้จะเข้าใจ
• การทำ User Research จะช่วยให้เราเข้าใจผู้ใช้ และ Mental Models ของผู้ใช้

3. User Control and Freedom

ความผิดพลาดเกิดขึ้นได้เสมอ ดังนั้นผู้ใช้จึงต้องการ ประตูทางออกฉุกเฉิน เพื่อที่จะยกเลิกการกระทำนั้นได้ทันที โดยไม่ต้องผ่านขั้นตอนอะไรมากมาย เช่น มือถือมีปุ่ม Home เพื่อกลับไปหน้าหลักได้ทันที หรือประตูหนีไฟของห้างที่พาเราออกจากห้างได้ทันที

เมื่อผู้ใช้สามารถย้อนกลับหรือแก้ไขอะไรได้ง่าย ๆ จะทำให้ผู้ใช้เกิดความรู้สึกอิสระ และมั่นใจ

Tips

• ควรออกแบบให้ผู้ใช้สามารยกเลิก หรือย้อนกลับได้ทุกครั้ง
• บอกให้ชัดเจนว่าผู้ใช้จะยกเลิกหรืออกจากสิ่งที่ทำอยู่ได้อย่างไร เช่น มีปุ่ม Cancel

4. Consistency and Standards

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

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

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

Tips

• ผู้ใช้จะจดจำและเรียนรู้ได้ง่ายถ้าการออกแบบมีความสม่ำเสมอ
• ออกแบบให้ตรงกับหลักสากล

5. Error Prevention

ป้องกันความผิดพลาดของผู้ใช้ เมื่อความผิดพลาดเกิดขึ้น อาจสร้างความเสียหายได้ เราจึงควรออกแบบให้ผู้ใช้เกิดความผิดพลาดน้อยที่สุด รวมถึงการยืนยันคำสั่งหรือ การกระทำของผู้ใช้อีกครั้งด้วย Dialogue หรือ Pop Up

ตัวอย่างเช่น ตามจุดโค้งของถนนจะขึ้นป้ายสีเหลืองลูกศรสีดำเสมอ เพื่อเตือนให้ผู้ขับขี่มีความระมัดระวัง หรือ ถ้าเราจะลบอีเมล์ทิ้ง จะมี Dialogue ขึ้นเตือนเพื่อยืนยันคำสั่งว่าเราต้องการจะลบอีเมล์นั้นจริง ๆ

Tips

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

6. Recognition Rather Than Recall

การช่วยให้ผู้ใช้งานนึกออกง่ายขึ้น รู้ว่าสิ่งที่เห็นคืออะไร? ต้องทำอะไร? ทำให้เกิดการตัดสินใจในจุดต่าง ๆ ได้ง่ายขึ้น Recognition Rather Than Recall เข้ามาช่วยในแต่ละจุดเพื่อให้ผู้ใช้งานทำงานต่าง ๆ ได้อย่างสำเร็จลุล่วง ไม่ว่าจะเป็นส่วนง่าย ๆ อย่างเช่น การกดปุ่ม หรือ เข้าเมนูต่าง ๆ บนเว็บไซต์ ไปจนถึง การทำงานที่ซับซ้อน โดยที่ผู้ใช้งานไม่ควรรู้สึกว่าต้องใช้ความพยายามในการทำงานมากจนเกินไป

Tip

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

7. Flexibility and Efficiency of Use

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

Tip

• ออกแบบทางลัด (Shortcut) สำหรับผู้ใช้งานที่เชี่ยวชาญ
• อนุญาตให้ผู้ใช้ปรับแต่งเนื้อหาและการทำงานสำหรับผู้ใช้แต่ละราย

8. Aesthetic and Minimalist Design

อินเทอร์เฟซ (Interface) ไม่ควรมีข้อมูลที่ไม่เกี่ยวข้องหรือไม่มีความจำเป็นสำหรับผู้ใช้ เพื่อลดการแข่งขันกับเนื้อหาที่เกี่ยวข้อง และลดการมองเห็นเนื้อหาที่มีความสัมพันธ์กัน เพื่อช่วยเหลือให้ผู้ใช้สามารถบะลุเป้าหมายหลักการทำงานของพวกเขาได้

Tip

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

9. Help Users Recognize, Diagnose, and Recover From Errors

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

Tip

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

10. Help and Documentation

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

Tip

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

อ้างอิงข้อมูลจาก
https://www.nngroup.com/articles/ten-usability-heuristics/

ติดตามบทความเกี่ยวกับการวิจัยและออกแบบได้ที่
Facebook : https://www.facebook.com/unblockdesign
Instagram : https://www.instagram.com/unblockdesign