สวัสดีครับ วันนี้เราจะมาว่ากันด้วยเรื่องของ การออกแบบสินค้าและบริการที่ตอบโจทย์และดีต่อผู้ใช้ การสร้างสินค้าและบริการจะต้องประกอบไปด้วยการออกแบบทางด้านประสบการณ์ของผู้ใช้ หรือ UX เพราะทุกสิ่งที่ถูกคิดค้นหรือสร้างขึ้นล้วนต้องผ่านการคิด วิเคราะห์ สร้างเพื่ออะไร ทำไปทำไม ตอบโจทย์อะไรกับผู้ใช้ ซึ่งการออกแบบมีด้วยกัน 6 ขั้นตอนหลักๆดังนี้
รูปภาพแสดง design process โดย The Efficient Approach: How to Design a Lean UX MVP | Toptal Step 1 : Understanding Environment (Discovery phase) เป็น phase แห่งการทำความเข้าใจ การทำความเข้าใจในที่นี้หมายถึง การที่เราเข้าใจผู้ใช้, เข้าใจ brand, เข้าใจในเงื่อนไขต่างๆ เพื่อที่จะเอามาเป็นแนวทางในการทำ research ให้ phase ถัดไป
User การทำความเข้าใจผู้ใช้งานระบบ -> Pain Point discovery การค้นหา Pain point ของผู้ใช้ เราต้องเข้าใจว่าปัญหาของผู้ใช้คืออะไรบ้าง เราคิดว่าจะแก้ไขปัญหาให้กับผู้ใช้ได้อย่างไรบ้าง Brand เป้าหมาย/จุดประสงค์ขององค์กร เราต้องรู้โปรเจคนี้มีความเกี่ยวข้องกับภารกิจหรือเป้าหมายขององค์กรเราอย่างไร ต้องพยายามยึดติดอยู่กับเป้าหมายขององค์กรเพราะมันจะเป็นสิ่งที่ทำให้องค์กรประสบความสำเร็จได้ Clear Needs & Conditions ความต้องการและเงื่อนไขที่ชัดเจน เราจะทำอะไร เราต้องทำภายใต้เงื่อนไขอะไรบ้าง Step 2 : Research (Infomation Gathering, Hypothesis phase) เมื่อเราทราบถึงเป้าหมายของการสร้างหรือพัฒนาสินค้าและทราบถึงปัญหาของผู้ใช้แล้ว ขั้นต่อไปคือการค้นหาข้อมูลเพิ่มเติม
phase นี้จึงเป็น phase แห่งการค้นคว้า เก็บข้อมูลตั้งต้นเพื่อที่จะนำมาวิเคราะห์ในขั้นตอนต่อไป การ research มีด้วยกันหลายวิธี
Interview การสัมภา ษณ์1:1 Interview การสัมภาษณ์ตัวต่อตัวกับผู้ใช้ จะเป็นเหมือนการพูดคุยทั่วไปถึงเรื่องการใช้งานระบบ เคยเจอปัญหาอะไรมาบ้าง ยังคงติดปัญหาในจุดไหนอยู่ไหม ในการใช้งานระบบเขามองหาอะไรอยู่ การสัมภาษณ์แบบตัวต่อตัวทำให้ทราบถึงความจริงใจและอารมณ์ของผู้ใช้ สามารถนำมาเป็นตัววัดความเที่ยงตรง เชื่อถือได้ของข้อมูลชุดนั้น การสัมภาษณ์แบบนี้สามารถทำแบบพูดคุยตัวต่อตัวหรือทาง meeting/conference/telephone ก็ได้ Group Interview การสัมภาษณ์แบบกลุ่ม เป็นวิธีการที่ให้ข้อมูลได้แบบไม่ค่อยละเอียด แต่ได้จุดที่สำคัญ มีการกรองกันจากการพูดคุยภายในกลุ่ม ลักษณะการถามก็จะเป็นเหมือนการสัมภาษณ์แบบตัวต่อตัว การสัมภาษณ์ด้วยวิธีนี้อาจจะต้องนำข้อมูลมาวิเคราะห์ค่าเฉลี่ยเพิ่มขึ้นมา กลุ่มของผู้ใช้ 3-5 คนก็เพียงพอไม่จำเป็นต้องไปเก็บจากผู้ใช้ 100-1000 คน (Rule of thumb)
Surveys การทำแบบสอบถาม ในการสร้างแบบสอบถามขึ้นมา เราต้องรู้ถึงปัญหาของผู้ใช้ ปัญหานี้เกิดในผู้ใช้กลุ่มไหน แล้วนำข้อมูลนั้นมาวิเคราะห์ออกมาเป็นสมมติฐาน
หลักการสร้างแบบสอบถาม แยกปัญหาออกมา โดยดูความสำคัญว่า ปัญหาอันไหนสามารถวัดและทำ Testing ได้แล้วนำมาทำให้เป็นคำถามแบบที่ Interactive ได้ พยายามตั้งคำถามปลายเปิดแต่ยังสามารถทำให้เรามองเห็นคำตอบได้ *ไม่ควรตั้งคำถาม Yes/No, Rating เนื่องจากไม่สามารถนำข้อมูลมาพัฒนาต่อได้ รูปภาพแสดงการทำ Heat map analysis ตัวอย่างของการทำ survey ที่ดี Hypothesis: สงสัยว่าหน้าแรกของระบบมันไม่จูงใจผู้ใช้ ทำให้ผู้ใช้ออก (nothing grabs user’s attention)วิธีถาม: 5seconds test นำหน้าเว็ปจริงๆมาและใช้ Heat map ในการวิเคราะห์โดยกำหนดโจทย์ว่า ให้ผู้ประเมินคลิกจุดแรกที่ผู้ใช้สนใจภายใน 5วินาที คำตอบ: Heat map result ผู้ใช้สนใจตรงไหนมากที่สุด สามารถนำข้อมูลมาวิเคราะห์ต่อได้ Hypothesis: ข้อสงสัยที่คิดว่าลูกค้าไม่เข้าใจว่าเค้าทำอะไรได้บ้างบนเว็ปไซต์ของเขาวิธีถาม: 5seconds test ดูหน้าเว็ปแล้วถามว่า คิดว่าหน้านี้เขาสามารถทำอะไรได้บ้าง คำตอบ: ลำดับของความชัดเจนว่า ผู้ใช้สนใจอะไรเป็นอันดับแรก และอันดับตามๆมา Hypothesis: สงสัยว่า content มันน่าจะไม่ดึงดูดผู้ใช้แน่ๆวิธีถาม: นำเว็ปไซต์คู่แข่งมาเปิดคู่กันกับเว็ปไซต์เราและทำในลักษณะของ A/B testing โดยทำ hot spot test ให้ผู้ประเมินเลือก section ของเว็ปตัวอย่าง 3 ชิ้นที่คิดว่าจำเป็นสำหรับเขา คำตอบ: section ที่เขามองหาแต่เราไม่มี หรือจุดไหนที่มีเหมือนกัน หรือจุดไหนที่เรามีแต่คนอื่นไม่มี ข้อดี:: Scale ได้, รวดเร็ว, วิเคราะห์ง่ายข้อเสีย:: คำตอบอาจจะมีการเอนเอียงได้ (Bias) ไม่สามารถอธิบายแทนสิ่งที่ผู้ใช้เจอมาได้ทั้งหมด คำตอบที่ได้ไม่หลากหลาย และมีความเสี่ยงต่อการสูญเสียข้อมูลจากผู้ใช้ ถ้ามีการออกแบบแบบสอบถามไม่ดี ทำให้เกิดการพลาดโอกาส
Usability Testing การสำรวจการใช้งานในกลุ่มเป้าหมาย การทำ Usability test จะทำให้เราทราบถึง pain point และ happy point ของระบบได้ชัดเจนมากขึ้น
User testing คือการทำ test โดยการเปิดหน้าจอให้ผู้ใช้ลองทำ Task บางอย่างแล้วเราสังเกตุการใช้งาน แล้วบันทึกวิธีการ Interact และ Reaction ของผู้ใช้ระหว่างการใช้งานA/B Testing อาจจะทำเป็น Prototype ก็ได้ ไม่จำเป็นต้อง Coding ขึ้นมาจริงๆ Click heat คือการดูว่าผู้ใช้กำลังคลิกตรงไหน บริเวณไหนที่มีการ Interact บ่อยๆหรือไม่มีการ Interact ทำให้เราได้ข้อมูลสมมติฐานไปคุยกับ user ต่อไปได้ (tool e.g. Hotjar)
Contextual Inquiry การสำรวจโดยลงพื้นที่จริง ที่มีการใช้งานจริง การทำ CI เป็นการสังเกตุการณ์จากการใช้งานจริงว่าติดปัญหาอย่างไร เรียนรู้จากเรื่องราวของบุคคลนั้นๆ เป็นแนวสนทนาปลายเปิด บางกรณีผู้ใช้จะเปิดใจพูดได้โดยไม่ต้องกังวลไม่เหมือนการสัมภาสแบบกลุ่มหรือในสภาพแวดล้อมที่ไม่คุ้นเคยก็จะเกิดความไม่ครบถ้วนของข้อมูลได้ มีการทำ/แก้ไข Prototype หน้างานแล้วทดสอบได้เลย
ข้อดี:: ได้ผลการสัมภาสที่เป็นประสบการณ์จากผู้ใช้เองโดยตรง, ผู้สัมภาสได้มีอารมณ์ร่วมกับผู้ให้ประเมิน รับรู้ครบถ้วนในด้านตั้งแต่ประสบการณ์ ทัศนคติ แรงจูงใจ ความประทับใจเป็นต้นข้อเสีย:: ในกรณีที่เป็นเรื่องส่วนตัวก็จะไม่สามารถติดตามวัดผลได้ ต้องถามความสะดวกใจของผู้ใช้ด้วย, ต้องมีการเดินทางไปในแต่ละสถานี ส่งผลถึงเรื่องงบประมาณวิธีการทำ Research อื่นๆ ศึกษาต่อได้ที่ More Research Techniques
Step 3 : Analyze (Brain Storming) เป็น phase แห่งการวิเคราะห์ กลั่นกรองข้อมูลออกมาให้เหลือแต่สิ่งที่สำคัญ ขั้นตอนนี้สามารถทำได้หลายกระบวนการ แต่เราจะยกตัวอย่างมาให้เล็กน้อยก่อน
รูปภาพแสดง User Persona User Persona สร้างโปรไฟล์ตัวอย่างของผู้ใช้ เป็นเหมือนเข็มทิศในการออกแบบ การตัดสินใจ การออกแบบจะแก้ปัญหาของผู้ใช้อย่างไร แล้วจะตอบสนองความต้องการของเขาได้อย่างไร ซึ่งจะประกอบไปด้วย
Bare necessities ข้อมูลจำเป็นเบื้องต้น ชื่อ-นามสกุล อายุ เพศ ที่อยู่ อาชีพ และอื่นๆ ประวัติโดยย่อ แผนผังบุคลิก User’s image รูปภาพของผู้ใช้ บางครั้งรูปภาพของผู้ใช้สามารถบ่งบอกได้ถึงหลายๆอย่าง มากกว่าการเขียนบรรยาย การแต่งกายของผู้ใช้ก็สามารถบ่งบอกถึงบุคลิกได้ Personality แถบที่บ่งบอกถึงนิสัยของผู้ใช้ สามารถทำเป็นแถบค่าพลังบ่งบอกความเป็นบุคลิกต่างๆได้เช่น Extroverted ⇔ Introverted, Passive ⇔ Active, Analytical ⇔ Creative เป็นต้น Goals and Motivations เป้าหมายและแรงบรรดาลใจ เป้าหมายของผู้ใช้ ทำให้เราสามารถสร้างระบบที่ไปตอบโจทย์เป้าหมายของผู้ใช้ แรงบรรดาลใจของผู้ใช้ ก็สามารถนำมาเป็นปัจจัยที่ต้องนำมาวิเคราะห์ก่อนออกแบบ ยกตัวอย่าง การซื้อของออนไลน์ผ่านระบบ e-commerceเป้าหมายของผู้ใช้คือ อยากได้สินค้าที่มีราคาถูกที่สุด คุ้มค่าที่สุด แรงบรรดาลใจของผู้ใช้คือ ต้องการการเปรียบเทียบสินค้าในเรทราคาเท่าๆกัน เราสามารถนำข้อมูลทั้ง 2 มาวิเคราะห์ออกแบบระบบให้รองรับได้เช่น การแนะนำสินค้าใกล้เคียงกับสินค้าที่ผู้ใช้กำลังดูอยู่ มีการแนะนำร้านที่แนะนำโดย platform หรือเรียงตามเรทของสินค้า Pain points จุดที่ผู้ใช้ไม่ชอบ หรือ ข้อเสียของระบบที่ต้องแก้ เป็นสิ่งที่ต้องวิเคราะห์ออกมาจากการสัมภาสหรือได้มาจากการสัมภาสโดยตรง ข้อมูลส่วนนี้คือสิ่งที่ต้องให้ความสำคัญมากๆ ระบบที่สร้างขึ้นมาจะต้องแก้ไข pain points เหล่านี้ให้ได้ แก้ได้ = User happy
User Journey mapping แผนผังแสดง Interaction ของผู้ใช้ รูปภาพแสดง User Journey mapping การทำ user journey จะช่วยให้เรามองเห็นภาพรวมของระบบ ในขั้นตอนต่างๆว่า ผู้ใช้รู้สึกอย่างไร จุดไหนที่ต้องมีการปรับปรุงอีก
User journey จะประกอบด้วย Flow การทำงานของระบบที่ผู้ใช้จะต้องเจอ ข้อมูล Emotions หรืออารมณ์ที่ผู้ใช้จะต้องเจอในแต่ละหน้าแต่ละขั้นตอน ข้อมูลความคิดของผู้ใช้ ณ ขณะนั้นซึ่งสัมพันธ์กับข้อมูลอารมณ์ของผู้ใช้ ข้อมูลโอกาสที่เราวิเคราะห์ออกมาว่า ณ ขณะนั้น เราสามารถ Offer อะไรให้กับผู้ใช้ได้บ้าง ข้อมูลประสบการณ์ มีความง่ายในการใช้งานมากแค่ไหน น่าเบื่อหรือไม่ และข้อมูลอื่นๆเพิ่มเติมที่สามารถนำมาวิเคราะห์ได้
**นอกเหนือจากการทำ User persona และ User journey ที่กล่าวมาข้างต้น ยังมีวิธีการทำ Analyze อีกหลายวิธีเช่น การทำ Storyboard, Card Sorting, SWOT Analysis, Use cases และอื่นๆ More Analyze Techniques
Step 4 : Design (Experiment phase) หลังจากได้ผ่านขั้นตอนแห่งการวิเคราะห์มา ขั้นตอนต่อไปคือการทำให้เกิดขึ้นมา ทำให้ Test ได้ ไม่ว่าจะเป็นการทำ Wireframe หรือ Prototype ขั้นตอนนี้เป็น phase แห่งการทดลอง ลองผิดลองถูก อ้างอิงจาก use case ต่างๆ นำข้อมูลที่ได้จากการ Analyze มาสร้างเป็นสิ่งที่สามารถทดสอบได้ ในขั้นตอนนี้จะประกอบไปด้วยการออกแบบในหลายๆส่วน ส่วนหลักๆจะประกอบไปด้วย
รูปภาพแสดง Wireframe low-fidelity Site map แผนผังของระบบไม่ซับซ้อน หน้าต่างๆอยู่ถูกที่ ถูกลำดับชั้น User flow แผนผังการดำเนินการของผู้ใช้ หน้าไหนไปหน้าไหนInformation Architechture ออกแบบโครงสร้างของข้อมูลเช่น จัดหมวดหมู่ให้กับข้อมูลDesign system แกนหลักในการออกแบบ ประกอบด้วยTypography ชุดตัวอักษร Color Scheme ชุดโทนสี (Primary, Secondary, Accent, Success, Danger, Warning, Default) Icon ชุด Icon Image โทนการใช้รูปภาพภายในระบบ (Photos, Vertor Images, 3D) (optional) Component สำเร็จรูป Wireframe low-fidelity ต้นแบบของระบบ ไม่จำเป็นต้องมีข้อมูล โครงแบบร่างในกระดาษหรือโปรแกรมที่สามารถบอกได้ถึงความเชื่อมโยงระหว่างหน้าและรูปแบบของหน้าจอแสดงข้อมูลต่างๆ ที่ต้องแสดงในแต่ละหน้า เป็นตัวตีกรอบโครงสร้างของแต่ละหน้าได้ แสดงให้เห็น Flow การทำงานและเป็นตัวอธิบาย Interface ในหน้าต่างๆ Prototype การนำ Wireframe มาลงรายละเอียดจริง และนำมา mockup บนอุปกรณ์ต่างๆ เพื่อใช้ในการทดสอบและประเมินผลLoop : Design > Test > Validate > Design > Test > … เมื่อมีการออกแบบเสร็จสิ้น เราจะต้องทำการทดสอบ ประเมินผล ถ้าไม่ผ่านการทดสอบก็ต้องวนกลับมาขั้นตอนเดิมคือ ออกแบบใหม่ ทดสอบ วนไปเรื่อยๆ จนกว่าจะผ่านไป phase ต่อไปได้
Step 5 : Build & Launch (Make it real phase) เมื่อผ่านขั้นตอนของการออกแบบมาแล้ว ขั้นตอนต่อไปคือขั้นตอนของการสร้างมันขึ้นมาให้เหมือนกับที่ออกแบบไว้ ในขั้นตอนนี้อาจจะมีการปรับเปลี่ยนหน้าตาหรือขั้นตอนที่ต่างจากการออกแบบได้เนื่องจากปัจจัยทางการสร้างหรือ coding ซึ่ง ณ ขั้นตอนนี้ก็ควรปรึกษาผู้ออกแบบและช่วยกันหาทางออกร่วมกันได้ ผลที่ได้จากการสร้าง เช่น
รูปภาพแสดง Wireframe Hi-fidelity Prototype หรือ Wireframe Hi-fidelity Prototype เป็นการนำ Wireframe มาต่อยอด มีการลงรายเอียดส่วนของสัดส่วน สี ตัวอักษร รวมถึง Icon และรูปภาพ ลงรายละเอียด Content จริงๆ มีการเชื่อมโยงปุ่มกับหน้าต่างๆหรือเรียกว่า Prototyping ให้เป็น Flow การทำงานจริงๆขึ้นมา เราสามารถนำผลงานมาขึ้น Mockup เป็น device จริงไปให้ผู้ใช้ได้ทดสอบแทนการเปิดหน้าจอ application ให้ดูผ่านจอก็ได้เช่นกัน ในส่วนนี้สามารถทำได้จากหลากหลายโปรแกรมเช่น Figma, Adobe XD และโปรแกรมอื่นๆเป็นต้น
Implement an actual application เป็นการพัฒนา application หรือ feature นั้นๆขึ้นมาจริงๆจะต้องมีการประเมินความสำคัญของ feature หรือความสำคัญถึงการที่จะต้องทดสอบกับการใช้งานจริงๆด้วยเช่นกัน เพราะจะส่งผลต่อการลงแรงของหลายๆฝ่ายและค่าใช้จ่ายที่เพิ่มเติมขึ้นมาได้ (เรียกได้ว่า มีความเสี่ยงสูงเช่นกัน)
Make sure your product is perfect! :: Do you trust in your research and analysis?
ถ้าคิดว่าการ Launch Feature ใหม่หรือสินค้าใหม่ออกสู่ตลาดหรือออกสู่ public ยังไม่กล้าเสี่ยงลองนำผลงานที่ได้ไป
ทำ User testing นำไปให้ผู้ใช้ทดสอบเหมือนขั้นตอนการทำ Usability test ในขั้นตอน Research ทำ Internal testing ทดสอบและรีวิวกันเองภายในทีม ทำ Beta Launch ปล่อยระบบให้กับกลุ่มคนเล็กได้ทดสอบ เก็บ Feedback แล้วนำกลับมาแก้ไข สุดท้ายแล้วเมื่อปรับปรุงแก้ไขจนคิดว่าอยู่ในเกณฑ์ที่ยอมรับได้ ก็ถึงเวลา Launch ปรับ Version ตัวโปรแกรมจริงๆให้ผู้ใช้ได้ใช้
Step 6 : Analyze Validation (Collect Feedback) aka ตรวจการบ้าน เมื่อเราได้ผ่านขั้นตอนของการสร้างมาแล้ว ผู้ใช้ได้เจอกับสิ่งที่เราปรับปรุงหรือสร้างขึ้นมาใหม่ สิ่งที่เรา research analyze design ไปนั้นมันถูกต้องแล้วใช่หรือไม่ ตอบโจทย์ปัญหา pain point ของผู้ใช้หรือไม่ ดึงดูดให้ผู้ใช้กลับมาใช้งานระบบไหม และแน่นอนสิ่งที่ต้องเกิดคู่กันกับการเปลี่ยนแปลงคือ ผลตอบรับหรือ feedback เราจะต้องมีการเก็บข้อมูล feedback มาวิเคราะห์ อาจจะมีจุดที่เราพลาดไป ทดสอบไม่เจอในกลุ่มการทดสอบ beta ก็จะได้แก้ไข ปรับปรุง feature ให้ตอบโจทย์กว่าเดิม หรือคิดว่าการปรับปรุงระบบไปในแนวทางอื่นๆอาจจะส่งผลได้ดีกว่านี้ ข้อมูลตรงนี้ก็จะไปเป็นสารตั้งต้นของการขึ้นรอบการออกแบบและพัฒนาในรอบถัดๆไป
Loop Step 1-6 > Step 2-6 > … > Perfect** Product! (at that time) การที่เราทำ loop แบบนี้ไปเรื่อยๆทำให้ระบบหรือสินค้าที่เราสร้างขึ้นมีการพัฒนาอย่างตรงจุด ตอบโจทย์ผู้ใช้ เป็นระบบที่เข้าใจผู้ใช้ อาจจะมีการปรับปรุงไปในแนวใหม่เพื่อรองรับกลุ่มผู้ใช้ที่หมุนเปลี่ยนไปในทุกๆครั้งที่กลับมาทำ research ก็ไม่ผิดแปลกไป
ปล. การวน loop ในแต่ละครั้งเราสามารถตัดขั้นตอนบางอย่างไปได้เช่น รอบที่ 2 อาจจะเป็นผู้ใช้คนเดิมก็ข้ามไปทำ research ได้เลย หรือมีข้อมูลจาก loop เก่าก็สามารถนำข้อมูลนั้นมา Design & Test ได้เลย การกระทำแบบนี้เราเรียกว่าการ Lean UX Process
**Perfect มันไม่มีอยู่จริง ไม่ต้องไป keep perfect but ทำให้ใกล้คำว่า perfect ที่สุดจะดีกว่า เราไม่สามารถออกแบบหรือสร้างอะไรสักอย่างที่มันตอบโจทย์คนทั้งโลกได้ แต่ทำให้ดีที่สุดของเราได้
Summary
จบแล้วขั้นตอนการออกแบบ UX Design process เบื้องต้น ยาวหน่อยแต่รายละเอียดเกือบครบ จะเห็นได้ว่าจริงๆแล้วขั้นตอนทาง UX design process ได้เข้าไปเกี่ยวข้องกับทุกๆส่วนของชีวิตประวันและของรอบตัว มันมีวิธีการต่างๆหลากหลายรูปแบบ ขึ้นกับมุมมองของผู้ทำ แต่ทุกวิธี base on problem แน่นอน ถ้าเราวิเคราะห์ได้ว่าคนๆนั้นไปเจอปัญหาอะไรมา แล้วเราแก้ไขให้เขาได้ ทำไมเขาจะไม่ซื้อ/ใช้สินค้าของคุณ ที่สำคัญคือ “Keep doing research, keep developing. “
Thanks for references: The UX design process in 6 stages | Inside Design Blog (invisionapp.com) What is user research? | Inside Design Blog (invisionapp.com) หลงไปในงาน UX Research at Agoda. เอะนั่นเห็นมี Event UX Research at… | by Dark_Spirit (Warm) | WIP team | Medium UX Process – UX Mastery
