Tag Archives: User Experience

User Experience

User Experience

User Experience

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

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

โดย UX ที่แท้จริงมีความหมายครอบคลุมกว้างกว่า สิ่งที่ลูกค้าต้องการ หรือ สิ่งที่เราจัดไว้ให้ และเพื่อให้บรรลุเป้าหมาย UX ที่มีคุณภาพ จะต้องมีการผสมผสานกันอย่างกลมกลืน จากหลายๆ บริการ รวมไปถึง การออกแบบวิศวกรรม การตลาด การออกแบบกราฟฟิค การออกแบบอุตสาหกรรม และ การออกแบบInterface

 

นิยามของการออกแบบ
Design is the process of finding the most elegant answer to the question of ‘how do I…?’ (Scrivs)
การออกแบบคือ กระบวนการหาคำตอบที่สวยงามที่สุดสำหรับคำถามที่ว่า ฉันจะทำมันอย่างไร

Design is a set of decisions about a product. It’s not an interface or an aesthetic, it’s not a brand or a color. Design is the actual decisions.! (Rebekah Cox)
การออกแบบคือ ชุดของความตัดสินใจซึ่งเกี่ยวกับผลิตภัณฑ์ มันไม่ใช่แค่รูปร่างหน้าตาหรือความงาม มันไม่ใช่เครื่องหมายการค้าหรือสี แต่การออกแบบคือ การตัดสินใจอย่างแท้จริง!

 

Why is user experience design important?

  1. เพื่อปรับปรุงจุดประสงค์
  2. เพื่อความรวดเร็วและตรงกลุ่มเป้าหมาย
  3. เพื่อเพิ่มมูลค่าผู้ใช้
  4. เพื่อยืดเวลาให้ผู้ใช้ใช้งานนานขึ้น

 

The elements of user experience (องค์ประกอบของ UX)

องค์ประกอบของ UX

User experience research

  • ลงสนามพบวัฒนธรรมผู้ใช้จริง
  • คิด Concept ของแบบทดสอบ
  • ออกแบบโดยให้หลายฝ่ายมีส่วนร่วม
  • สำรวจความคิดเห็น
  • ตำแหน่งที่ตามอง Eye Tracking
  • เรียงลำดับข้อมูล
  • ทดสอบในห้องปฏิบัติการก่อน

Eye Tracking ของ Form
ตำแหน่งของ Text อยู่บนกล่อง ถูกมองเห็นได้มากที่สุด

ตำแหน่งการมองที่ดีที่สุด ของแบบฟอร์ม

Content Strategy (กลยุทธ์ในการเขียนเนื้อเรื่อง)

กล่าวได้ว่า Content Strategy is Design!

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

กลยุทธ์ในการเขียนเนื้อเรื่อง

Interaction Design

Interaction design จะเป็นตัวกำหนดโครงสร้างและพฤติกรรมของผู้ใช้ ที่ใช้สินค้าหรือผลิตภัณฑ์แบบที่ต้องมีปฏิกริยาตอบโต้

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

 

10 heuristics for user interface design (10 หลักการทั่วไปสำหรับการออกแบบ User Interface Design)

http://www.useit.com/papers/heuristic/heuristic_list.html

1. Visibility of system status
การแสดงผล ของสถานะของระบบ (ระบบควรแจ้งให้ผู้ใช้ทราบเกี่ยวกับสิ่งที่กำลังทำ ผ่าน text, graphic ในช่วงเวลาที่เหมาะสมเพื่อเสริมความเข้าใจ)

2. Match between system and the real world
ปรับให้ระบบเหมือนกับโลกแห่งความจริง (ส่วนที่เกี่ยวกับระบบควรจะปรับให้เป็นภาษาพูด ให้ผู้ใช้เข้าใจง่ายไม่ใช้ภาษาคอมพิวเตอร์มากเกินไป)

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

4. Consistency and standards
การออกแบบที่สอดคล้องต่อเนื่องกัน และมาตราฐานเดียวกัน (รวมทั้งผู้ใช้ไม่ควรต้องสงสัยในคำที่เขียนต่างกัน ในแต่ละจุด ถ้ามันหมายถึงสิ่งเดียวกัน ควรใช้คำ คำเดียวให้เป็นมาตราฐาน

5. Error prevention
การตรวจเช็คจะป้องกันปัญหาที่ยูสเซอร์อาจคลิกหรือทำ Action อะไรผิดได้

6. Recognition rather than recall
เห็นแล้วจำได้เลยดีกว่าต้องนึกคิดก่อน เช่น การตั้งชื่อปุ่ม ควรชัดเจนไม่ต้องให้นิ่งคิดตีความ เช่น ปุ่ม Save กับ OK ปุ่ม Save ชัดเจนกว่า หรือ คำว่าคลิกที่นี่ ควรเปลี่ยนเป็น คลิกดูทั้งหมด เป็นต้น

7. Flexibility and efficiency of use
เว็บควรจะหยืดหยุ่น และใช้งานได้เต็มประสิทธภาพที่ควรจะเป็น ตอบสนองความต้องการได้ทั้งผู้ใช้มือใหม่และมือเก่า

8. Aesthetic and minimalist design
การออกแบบที่สวยงาม และเรียบง่าย

9. Help users recognize and recover from errors
เมื่อเกิดการ errors ทั้งหลายจากระบบหรือจากการกรอก ควรมี pop upเตือนและแจ้งให้เข้าใจว่าผิดพลาดอะไรอย่างชัดเจน พร้อมวิธีแก้ไข

10. Help and documentation
เป็นการดีที่สุดถ้าออกแบบแล้วผู้ใช้เข้าใจได้ทันที แต่การทำหน้า Help, Tool Tip และ file.doc ให้ดาวน์โหลดไปอ่านก็เป็นตัวช่วยให้ผู้ใช้สามารถแก้ปัญหาต่างๆ ได้ด้วยตัวเอง

 

Visual Design
The principles of design หลักการออกแบบ

  1. Balance ความสมดุลย์
  2. Proximity ความใกล้ชิด เชื่อมโยง
  3. Alignment การจัดวาง
  4. Consistency ความกลมกลืน
  5. Contrast ความขัดแย้ง
  6. White space พื้นที่ว่างสีขาว

 

ตัวอย่าง Proximity ที่ดี (มีการจัดหมวดหมู่)

ตัวอย่าง การจัดหมวดหมู่ของเมนู

 

 

ตัวอย่าง Proximity ที่ดี (การจัดวางและตั้งชื่อปุ่ม)ตัวอย่าง การเชื่อมโยงที่ดี ของปุ่มกับแบบฟอร์ม

 

 

Alignment ที่ดี ยังต้องคำนึงถึงทิศทางของภาพประกอบ จุดนำสายตา รวมทั้งภาพที่สื่อความหมายไปในแง่บวกต่อธุรกิจ

ตัวอย่างการวาง Alignment ที่ดี ต้องคำนึงถึงทิศทางของภาพ และความคิดแง่บวกต่อธุรกิจ

 

 

การดีไซน์ White Space จะให้ความรู้สึกแตกต่างกันโดยสิ้นเชิง ตามลักษณะงาน ดีไซน์เนอร์ควรเลือกใช้ให้เหมาะสม

ตัวอย่างการใช้ White Space และความรู้สึกที่แตกต่าง

 

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

ตัวหนังสือแบบพิมพ์ใหญ่จะอ่านง่ายกว่า ดังตัวอย่าง

ตัวอย่าง ความแตกต่างในด้านรูปทรงตัวอักษร

 

The Rule of Visual Design

 

ขั้นตอนการวางแผนและเตรียมงานนั้นเต็มไปด้วยความยุ่งยาก แต่จบลงด้วยความสบายของทุกฝ่ายขั้นตอนการวางแผนนั้นยุ่งยาก แต่จบลงด้วยความสบายของทุกฝ่าย