วิธีปรับปรุง UX แบบใช้งานได้จริงสำหรับสตาร์ทอัพที่ต้องอยู่รอดโดยไม่มีดีไซเนอร์

 (tibinotes.com)
35 คะแนน โดย GN⁺ 2025-03-14 | 1 ความคิดเห็น | แชร์ทาง WhatsApp
  • การใช้ไลบรารีคอมโพเนนต์อย่าง Material UI อาจเป็นทางลัดที่ง่าย แต่ถึงจะมีบิลดิ้งบล็อกพื้นฐานให้ ก็ยังต้องออกแบบโฟลว์การใช้งานทั้งหมดแยกต่างหาก
  • ถ้าต้องทุ่มเวลาไปกับการทำให้ผลิตภัณฑ์มีเอกลักษณ์ แล้วควรทำอย่างไรเพื่อ กำหนดประสบการณ์ผู้ใช้ที่ดีให้ได้เร็วที่สุดเท่าที่จะทำได้?

หน้าว่างคือกับดัก

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

  • แนวทางที่ควรหลีกเลี่ยง

    • เว็บไซต์รวมรางวัลงานออกแบบ – อาจมีความแปลกใหม่ แต่ไม่ได้รับประกันการใช้งาน
    • Dribbble – เน้นองค์ประกอบด้านความสวยงาม ไม่ได้เกี่ยวกับการใช้งานจริงเสมอไป

  • แนวทางที่ควรอ้างอิง

    • เว็บไซต์ของคู่แข่ง – สร้างบัญชีแล้วเก็บบันทึกเป็นภาพหน้าจอ
    • เว็บไซต์รวมแพตเทิร์น – ดูอ้างอิงได้อย่างรวดเร็วจาก PageFlows, Mobbin เป็นต้น

  • จดแพตเทิร์น UI ทั่วไปไว้

    • องค์ประกอบ UI ที่ใช้ร่วมกัน เช่น ช่องอีเมล ช่องรหัสผ่าน และโฟลว์การยืนยัน
    • กฎด้านภาพและเลย์เอาต์:
      • ฟอร์มจัดวางกึ่งกลาง
      • ดีไซน์แบบ responsive
      • ปุ่มที่ชัดเจน
      • โลโก้ด้านบน

  • Friction ที่ตั้งใจให้มี

    • บางบริษัทขอข้อมูลบัตรเครดิต → เป็นกลยุทธ์เพื่อคัดผู้ใช้ที่จริงจัง
    • ประสบการณ์ที่เร็วไม่ใช่ว่าจะดีกว่าเสมอไป

กำหนดเป้าหมายให้ชัดเจน

  • เป้าหมายไม่ใช่แค่ "ทำหน้าสมัครสมาชิก" แต่คือ → "ทำให้การสมัครง่ายที่สุดเท่าที่จะเป็นไปได้"
  • แปลงเป็นคำถาม:

    "จะทำอย่างไรให้ผู้ใช้สมัครได้ง่าย?"

  • ตัวอย่างวิธีแก้

    • แสดงความแข็งแรงของรหัสผ่านขณะกรอก
    • บอกเหตุผลว่าทำไมต้องกรอกแบบฟอร์มสมัคร

  • คำถามเพิ่มเติม

    • สมัครเสร็จแล้วให้ล็อกอินได้ทันที vs ให้ล็อกอินหลังยืนยันอีเมล
    • หลังสมัครให้แสดงหน้ายืนยัน vs แสดงข้อความสำเร็จ

คิดถึง edge case (สถานการณ์ยกเว้น)

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

  • แนวทางแก้เมื่อเกิดปัญหา

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

ใช้ AI เพื่อค้นหาปัญหา UX

  • สามารถใช้เครื่องมืออย่าง ChatGPT เพื่อตรวจหาปัญหา UX ได้
  • อาจไม่สมบูรณ์แบบ แต่ช่วยตรวจได้รวดเร็วและมีประสิทธิภาพ

  • ตัวอย่างพรอมป์ต์ที่มีประโยชน์

    • Red Team vs Blue Team:

      "มีจุดไหนบ้างในโฟลว์การสมัครนี้ที่ผู้ใช้อาจติดขัด?"
      "เหตุใดดีไซน์นี้จึงใช้งานได้อย่างเป็นธรรมชาติและเข้าใจง่าย?"

    • มาตรฐานอุตสาหกรรม:

      "บริษัท SaaS ชั้นนำออกแบบโฟลว์การสมัครอย่างไร?"

    • Edge case:

      "ถ้าผู้ใช้กรอกอีเมลผิดแต่ไม่รู้ตัว จะเกิดอะไรขึ้น?"

เคล็ดลับอื่น ๆ ในการปรับปรุง UX

  • ตั้งตัวชี้วัด
    • เช่น conversion rate, retention rate, ความพึงพอใจของผู้ใช้ → ประเมินผลด้วยตัวชี้วัดเชิงวัตถุวิสัย
  • ใช้สีแบบเรียบง่าย
    • สีหลัก สีรอง สีเน้น → แนะนำ Coolors
  • ใช้ภาษาที่คุ้นเคย
    • แทนที่จะใช้ "ข้อผิดพลาดของฐานข้อมูล" → ใช้ "ไม่สามารถบันทึกการเปลี่ยนแปลงได้"

บทสรุป

  • สำหรับสตาร์ทอัพ ความเร็วสำคัญ → อย่ายึดติดกับความสมบูรณ์แบบ
  • ใน UX สิ่งที่มาก่อนความแปลกใหม่คือ การใช้งานได้จริง
    • โฟลว์ผู้ใช้ที่ตรงไปตรงมาและชัดเจนมีประสิทธิภาพกว่าดีไซน์ที่ซับซ้อนและแปลกใหม่
  • สร้างนวัตกรรมเฉพาะในคุณค่าหลัก → ส่วนที่เหลือใช้แพตเทิร์นที่พิสูจน์แล้ว
  • ถ้าตามแพตเทิร์นที่ผู้ใช้คุ้นเคยอยู่แล้ว ก็จะช่วยลดภาระในการเรียนรู้

บทความที่เกี่ยวข้อง

1 ความคิดเห็น

 
GN⁺ 2025-03-14
ความคิดเห็นจาก Hacker News

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

    • ผู้ใช้ทั่วไปที่ใช้งานบ่อยมักใช้แถบเครื่องมือ ส่วนผู้ใช้ทั่วไปที่ใช้งานไม่บ่อยมักทำงานผ่านเมนู
    • ผู้ใช้ระดับมืออาชีพจดจำคีย์ลัดผ่านตัวอักษรที่ขีดเส้นใต้ในป้ายชื่อเมนู
    • หากต้องการเปลี่ยนการตั้งค่า ก็เปิดกล่องโต้ตอบการตั้งค่า ซึ่งมีแท็บอย่าง "ทั่วไป", "แบบอักษรและสี" เป็นต้น
    • ในเวลานั้นคนส่วนใหญ่มีความรู้เรื่องคอมพิวเตอร์ไม่มาก แต่ก็สามารถใช้แอปพลิเคชันส่วนใหญ่ได้แทบไม่ต้องพึ่งความช่วยเหลือ
    • เป้าหมายในตอนนั้นคือทำให้เวลาที่ผู้ใช้ใช้ไปกับแอปพลิเคชันน้อยที่สุด เพื่อให้งานเสร็จอย่างมีประสิทธิภาพ
    • UX สมัยใหม่มุ่งให้ผู้ใช้ "มีส่วนร่วม" ให้มากที่สุด ซึ่งอาจใช้ได้กับแอปสำหรับผู้บริโภค แต่เมื่อเอามาใช้กับแอปองค์กรก็กลายเป็นปัญหา
    • มีกรณีที่พนักงานสายไม่เทคนิคในบริษัท Fortune 100 บ่นว่า SPA ตัวใหม่ทำให้งานช้าลง และขอเทอร์มินัลรุ่นเก่ากลับมาใช้อีกครั้ง

  • หลังจากจ้างกราฟิกดีไซเนอร์ การเปลี่ยนแปลงที่เห็นชัดที่สุดคือแอป/เว็บไซต์ดูดีขึ้น

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

  • เครื่องมือที่ดีที่สุดในการหาปัญหาด้านการใช้งานคือแชร์หน้าจอกับ Gemini แล้วอธิบายงานที่ต้องการทำด้วยเสียง

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

  • ตาม "Jakob's Law" ผู้ใช้ใช้เวลาส่วนใหญ่อยู่กับเว็บไซต์อื่น ดังนั้นพวกเขาจึงชอบให้สิ่งต่าง ๆ ทำงานเหมือนเว็บไซต์อื่นที่คุ้นเคย

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

  • มีเหตุผลที่ผลิตภัณฑ์จำนวนมากทำงานในลักษณะคล้ายกัน และถ้ามันทำงานต่างออกไป ก็ควรถามตัวเองว่านั่นเป็นความตั้งใจหรือเป็นความผิดพลาด

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

  • สามารถใช้ AI เพื่อระบุปัญหา UX ได้ และเครื่องมืออย่าง ChatGPT ก็ช่วยชี้ให้เห็นปัญหา UX ที่คุณอาจมองข้ามได้

    • มันไม่สมบูรณ์แบบ แต่ก็ดีกว่าการเดาสุ่ม

  • แนะนำให้โฟกัสที่หลักการออกแบบและกรอบความคิดทั่วไป

    • การอ่าน "The Design of Everyday Things" ของ Donald Norman จะช่วยให้เข้าใจความต่างระหว่างการออกแบบที่ดีกับไม่ดี
    • "The Art of Game Design" ของ Jesse Schell พูดถึงวิธีสร้างประสบการณ์ที่ชวนดื่มด่ำ และเกมเป็นสาขาที่ไม่ค่อยให้อภัยความผิดพลาดเป็นพิเศษ

  • การทำตามสิ่งที่บริษัทใหญ่ทำอาจนำไปสู่แนวคิดแบบเลียนแบบโดยไม่เข้าใจแก่น

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

  • แม้อยู่ในช่วงบูตสแตรปก็ยังสามารถจ้าง UX ดีไซเนอร์ได้ และเป็นการลงทุนที่คุ้มค่ามาก

    • ไม่จำเป็นต้องจ้างเต็มเวลา โดยอาจใช้ design sprint เพื่อออกแบบแนวคิดบางอย่าง จัดเวิร์กช็อป UX แล้วต่อยอดตัวเลือกที่เลือกไว้เป็นต้นแบบที่คลิกได้
    • สิ่งนี้มีมูลค่าคุ้มกับการประหยัดงบพัฒนาฟรอนต์เอนด์ได้ $5k และในปีแรกก็น่าจะสร้างผลตอบแทนเกิน $5k จากอัตราการรักษาผู้ใช้ที่ดีขึ้น

  • จำไม่ได้แล้วว่าครั้งสุดท้ายที่ได้ทำงานร่วมกับดีไซเนอร์เฉพาะทางคือเมื่อไร

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