EP.14 รู้ไว้ใช่ว่า UX/UI นั้นหนาเขาทำอะไรกันบ้าง

Warittaya W.
WeLoveBug dot Com
Published in
3 min readOct 9, 2023

เส้นทางสู่การเป็น Tester 🐞 Bootcamp by WeLoveBug (18–23 กันยายน 2566)

สืบเนื่องจากสัปดาห์วันที่ 11–15 กันยายน 2565 ทางทีม WLB นำทีมโดยพี่หนุ่ม-ประธาน ด่านสกุลเจริญกิจ ได้จัด Workshop ภายใต้ชื่อ “Test Design In Action Workshop” เพื่อส่งมอบองค์ความรู้และประสบการณ์ด้านการออกแบบการทดสอบระดับพื้นฐาน ประกอบด้วยภาคบรรยาย 20% และการลงมือปฏิบัติ 80% ซึ่งเหมาะอย่างมากกับผู้ที่ทำงานในสายงาน Software Development หรือแม้แต่ผู้ที่ต้องการย้ายสายงานแต่ไม่มีประสบการณ์ในสายงานก็สามารถเข้าร่วมได้เช่นกัน หากท่านใดสนใจสามารถสอบถามรายละเอียดเพิ่มเติมได้ที่ Facebook page — Be Skilled Software Tester the Series ค่ะ WLB ยินดีต้อนรับ

ภาพบรรยากาศของ Test Design In Action Workshop โดยพี่หนุ่ม ประธานพร้อมด้วยทีม WLB

จากการจัด Workshop ดังกล่าวข้าพจ้อยได้รับบททั้งผู้ร่วมสอนและผู้ช่วยสอน จึงขอ Skip มายังพาร์ทการทำงานในสัปดาห์ถัดมาแทน ⏭️ ครั้งนี้เป็นการเข้าไปช่วยอีกบ้านหนึ่งภายใต้โปรเจคการพัฒนา “ระบบของฝ่ายการขายบริษัทชื่อดังแห่งหนึ่ง” ภาพรวมสัปดาห์นี้จึงเป็นการฝึกและทำซ้ำๆ ในด้านของ Test Design นั่นคือการออกแบบ Test Cases และ Test Scenarios

Step การทำงานของบ้านนี้คือการขุดเซาเจาะหาความต้องการ >> สร้าง Flow การทำงานของแต่ละ Feature >> ออกแบบและสร้าง Test Cases และ Test Scenarios ทั้งในส่วน Success และ Alternative บน Miro board >> สร้าง Test Scenarios บน Google sheet

ภาพรวมของงานที่เข้าไปช่วย

สัปดาห์นี้ปิดจบสวยๆ ด้วยการเข้ารับมอบความรู้และประสบการณ์เพื่อนำไปใช้ในการทำงานร่วมกับ UX/UI พอจะเดากันได้แล้วใช่มั้ยคะว่าเป็นการเรียนรู้เกี่ยวกับเรื่องอะไรกัน แต่นแต้นนนนน 🎉 ใช่ค่ะ Workshop สำหรับปูพื้นฐานความรู้เรื่อง UX และ Usability Test — โดยพี่ป๋อม สุธัม นั่นเองฮะ

UX/UI คืออะไร?

การทำงานของ UX/UI โดยเปรียบบทบาทของ UX/UI ในรูปแบบของการทำงานของร้านอาหาร ดังนี้

UI == User Interface เปรียบเสมือนหน้าร้านของร้านอาหาร เช่น การตกแต่งหรือบรรยากาศของร้าน ภาพลักษณ์และการบริการของพนักงาน เป็นต้น

UX == User Experiences เปรียบเสมือนพ่อครัวที่อยู่หลังร้านทำหน้าที่ รังสรรค์เมนูและเสิร์ฟอาหารให้ถูกปากลูกค้าและอร่อย

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

ทำไมต้องศึกษาประสบการณ์เดิม?

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

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

การศึกษาประสบการณ์เดิมสามารถศึกษาได้ด้วยวิธีการ ดังนี้

  1. การสัมภาษณ์ (Interview) ผู้ใช้งาน

ทริคในการสัมภาษณ์ คือ การมองหาและรวบรวมประโยคหรือคำพูดที่ซ้ำๆ กันของผู้ถูกสัมภาษณ์ (Grouping words)

2. การทำแบบสำรวจ (Survey)

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

3. การนำผลวิจัยที่มีมาปรับใช้ (Secondary)

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

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

Customer journey

Customer journey == การศึกษาขั้นตอนและพฤติกรรมของผู้ใช้งานว่าในการทำกิจกรรมใดก็ตาม จะต้องผ่านขั้นตอนใดบ้างและมีความรู้สึกอย่างไรเมื่อทำขั้นตอนนั้น

เราได้ทำการแบ่งกลุ่มเป็น 3 กลุ่ม เพื่อระดมสมองจัดทำ Customer journey ตามโจทย์ที่พี่ป๋อมกำหนดให้

กติกา: ทุกคนต้องสร้าง Customer journey ของตนเองด้วยสถานการณ์ที่กำหนดให้ลงใน Post-it และไม่สามารถสร้างเกินจำนวน Post-it ที่กำหนดให้ได้

โจทย์ที่ 1: กินข้าวกับเพื่อน มีสถานการณ์ดังนี้

  • กินข้าวกับเพื่อน
  • ต้องจ่ายเงินคืนเพื่อน
  • ตอนหลังกินข้าวเสร็จ

หลังจากนั้นให้ทุกคนนำ Post-it ทั้งหมดมาทำการจัดกลุ่มของพฤติกรรมและร้อยเรียง Timeline ที่เกิดขึ้นตั้งแต่ต้นจนจบ

โจทย์ที่ 2: ตามหัวข้อกลุ่ม มีสถานการณ์ดังนี้

  • แอปคลินิก
  • พนักงานเอกชน Developer อายุ 35 ปี
  • ติด Covid-19

เนื่องจากเวลา Workshop ที่มีอยู่อย่างจำกัดทำให้เราไม่ได้ทำการใส่อารมณ์หรือความรู้สึก (Emotion) ลงไปในแต่ละขั้นตอน

หัวข้อต่อมาเป็นการสอนใช้งานเครื่องมือที่ชื่อว่า “Figma” ใช้สำหรับการสร้างหน้าจอ UI ในระดับเบื้องต้น และปิดท้ายด้วย Usability Test

Usability Test

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

Photo by freestocks on Unsplash

สิ่งที่ได้เรียนรู้จาก UX/UI Workshop

  • เห็นถึงมุมมองการทำงานของ UX/UI ที่ไม่ได้มีเพียงการออกแบบหน้าจอให้มีความสวยงามเท่านั้น และบางครั้งความสวยงามก็ไม่ได้ตอบโจทย์การใช้งานของผู้ใช้งานเสมอไป
  • การทำ Customer Journey มีลักษณะคล้ายกับการเขียน End to End Flow ของ Software Tester ที่เป็นการร้อยเรียงพฤติกรรมการใช้งานตั้งแต่ต้นจนจบ
  • ในการทำ Usability Test รวมถึง Research หรือ Interview หากเราศึกษา User ในปริมาณที่เยอะก็ยิ่งทำให้ได้ข้อมูลที่แม่นยำขึ้น และยิ่งเราทำการการเจาะจงและให้ความสำคัญกับ User มากเท่าไหร่ก็จะยิ่งส่งผลให้ข้อมูลมความชัดเจนและแม่นยำมากขึ้นตามไปด้วย

ภาพรวมการทำงานสัปดาห์นี้เห็นได้ชัดว่า สามารถออกแบบ Test Case และ Test Scenarios ได้คล่องและไวยิ่งขึ้น ทั้งนี้จะพยายามฝึกฝนให้คล่องแคล่วและว่องไว พร้อมกับความละเอียดรอบคอบต่อๆ ไปอีกเช่นเคยและ Workshop พิเศษที่ได้เข้าร่วมก็มีความสนุกมากๆ เรียกได้ว่า Nice week สุดๆ เลยก็ว่าได้ ด้วยเกียรติของยุวกาชาดเก่าจะขอน้อมนคำสอนและคำแนะนำของพี่ๆ ไปปรับใช้ในการทำงานให้เต็มที่เลย ขอบคุณค่าาาา 🙇🏻‍♀️

--

--