0

User Journey กับ User Flow ต่างกันยังไง? ใช้ AI ร่างให้เร็วแต่ไม่มั่ว

บ่ายวันพฤหัส สัปดาห์ที่สองของสปรินต์ ทีมของคุณกำลังทำฟีเจอร์ “สั่งล่วงหน้าแล้วมารับ” ให้แอปร้านกาแฟ งานออกแบบดูพร้อมดี เพราะทีมมีทั้ง User Journey กับ User Flow อยู่ในมือ จนกระทั่ง Dev ที่ทำฟีเจอร์นี้พิมพ์มาในแชททีม

“ถ้าลูกค้าปิดการแจ้งเตือนไว้ จะรู้ได้ยังไงว่ากาแฟเสร็จแล้ว? แล้วถ้าเมนูหมดตอนที่เขากำลังจ่ายเงิน หน้าจอต้องขึ้นอะไร?”

คุณเปิดไฟล์ Figma ดู แล้วก็ต้องอึ้ง ในไฟล์มีแต่เส้นทางที่ทุกอย่างราบรื่น ไม่มีหน้าไหนตอบสองคำถามนี้ได้เลย

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

หน้าจอหนึ่งหน้ามีได้หลายสถานะ เช่น ตอนกำลังโหลด หรือตอนเกิดข้อผิดพลาด (เรียกกันว่า State) พอ Dev มาเจอ State ที่ขาดหายกลางสปรินต์ แล้วทั้งทีมต้องย้อนมารื้องานออกแบบ ตรงนี้แหละคือจุดที่ควรบอกตัวเองว่า “ต้องจัดการเรื่องนี้แล้ว”

ยิ่งตอนนี้ AI ร่างทั้งสองอย่างได้ในไม่กี่วินาที ถ้าไม่รู้ว่าต้องตรวจอะไร ก็ยิ่งได้เอกสารที่ดูเรียบร้อย แต่ข้างในเต็มไปด้วยการเดา

บทความนี้จะเล่าให้เห็นว่าสองอย่างนี้ต่างกันยังไง ควรใช้อันไหนเมื่อไหร่ พร้อม Prompt ให้ AI ร่าง Journey จาก Persona และร่าง Flow จาก Journey วิธีจับว่า AI กำลังเดา และรายการกรณีที่หลุดจากเส้นทางปกติ (Edge Case) ที่ควรเช็กก่อนส่งงานให้ Dev

สรุปสั้น ๆ

  • User Journey มองภาพกว้าง: ประสบการณ์ทั้งหมดของผู้ใช้ ที่ข้ามหลายช่องทางและกินเวลานาน รวมถึงสิ่งที่เขาคิดและรู้สึก
  • User Flow มองภาพแคบ: ผู้ใช้กดอะไร แล้วระบบตอบอะไร ภายในผลิตภัณฑ์เดียว เพื่อทำงานหนึ่งอย่างให้สำเร็จ
  • ใช้คู่กัน: Journey บอกว่าควรแก้ตรงไหน Flow บอกว่าจะแก้บนหน้าจอยังไง
  • AI ร่างได้เร็ว แต่คุณต้องตรวจจุดที่มันเดา และเติมกรณีผิดพลาด ไม่มีข้อมูล กำลังโหลด และไม่มีสิทธิ์ (Error, Empty, Loading, Permission) ให้ครบทุกครั้ง
นักออกแบบวาดโครงหน้าจอและเส้นทางการใช้งานบนไวท์บอร์ด

User Journey กับ User Flow ต่างกันยังไง

เริ่มจากคำถามที่ทีมในเรื่องนี้ตอบกันไม่ได้ก่อน Nielsen Norman Group สรุปไว้ในบทความ User Journeys vs. User Flows ว่า User Journey อธิบายประสบการณ์ภาพรวมของผู้ใช้ ที่ข้ามหลายช่องทางและเกิดต่อเนื่องไปตามเวลา ส่วน User Flow เหมือนการซูมลงไปดูบางช่วงของ Journey นั้นแบบละเอียด

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

กลับมาที่แอปร้านกาแฟของเรา ภาพจะเป็นแบบนี้

  • User Journey ของการสั่งกาแฟก่อนเข้างาน เริ่มตั้งแต่ลูกค้ารู้ตัวว่ามีประชุมเก้าโมงแต่ยังไม่ได้กินกาแฟ เปิดแอปสั่งระหว่างนั่งรถไฟฟ้า จ่ายเงิน รอการแจ้งเตือน เดินเข้าร้าน มองหาแก้วของตัวเองที่จุดรับ จนถือกาแฟเข้าห้องประชุมทัน หลายช่วงเกิดนอกแอปด้วยซ้ำ
  • User Flow ของงาน “สั่งและจ่ายเงิน” เลือกสาขา → เลือกเมนู → ปรับขนาดและความหวาน → ตรวจตะกร้า → เลือกวิธีจ่ายเงิน → ระบบตัดเงิน → ถ้าสำเร็จ แสดงหมายเลขออเดอร์และเวลารับโดยประมาณ แต่ถ้าไม่สำเร็จ ต้องบอกเหตุผลและทางไปต่อ

ถ้าอยากเห็นความต่างแบบเทียบกันทีละข้อ ดูตารางนี้

เรื่องUser JourneyUser Flow
ตอบคำถามว่าผู้ใช้ผ่านอะไรมาบ้าง ติดตรงไหน รู้สึกยังไงผู้ใช้กดอะไร ระบบตอบยังไง แล้วไปทางไหนต่อ
ครอบคลุมแค่ไหนหลายช่องทาง ทั้งในและนอกผลิตภัณฑ์ในผลิตภัณฑ์เดียว
ช่วงเวลาเป็นวัน เป็นสัปดาห์ หรือนานกว่านั้นไม่กี่นาทีถึงไม่กี่ชั่วโมง
จดอะไรไว้สิ่งที่ทำ สิ่งที่คิด ความรู้สึก และจุดที่ติดขัดสิ่งที่ผู้ใช้ทำ สิ่งที่ระบบตอบ และจุดที่ต้องเลือกทาง
หน้าตาที่เห็นบ่อยJourney Map เรียงเป็นช่วงตามเวลาFlowchart (กล่องกับลูกศร) หรือ Wireflow
ใครหยิบไปใช้บ่อยPM, Designer, ทีมธุรกิจ และทีมบริการDesigner, Developer และ QA (ทีมทดสอบ)
ถ้าไม่มีแก้ปัญหาผิดจุด หรือไปแก้จุดที่ไม่สำคัญหน้าจอมีช่องโหว่ Dev ต้องเดาเอง

ดูแถวสุดท้ายให้ดี ช่องของ User Flow คือสิ่งที่เกิดกับทีมในเรื่องของเรา Flow ไม่ครบ Dev เลยต้องมาถามเองกลางสปรินต์

ควรใช้อันไหน เมื่อไหร่

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

  • ยังไม่แน่ใจว่าปัญหาอยู่ตรงไหน เริ่มจาก Journey เพื่อหาช่วงที่ผู้ใช้ติดขัดที่สุด
  • ต้องเลือกว่าจะทำฟีเจอร์ไหนก่อน ใช้ Journey ชี้ว่าแก้ช่วงไหนแล้วได้ผลมากที่สุด
  • ปัญหาเกี่ยวกับคนหลายบทบาท เช่น ลูกค้า บาริสต้า และผู้จัดการสาขา ทำ Journey ก่อน แล้วค่อยแตก Flow ของแต่ละบทบาท
  • กำลังจะออกแบบหน้าจอของงานหนึ่งอย่าง ใช้ Flow
  • กำลังส่งงานให้ Dev หรือให้ QA เขียน Test Case (รายการกรณีที่ต้องทดสอบ) ต้องมี Flow ที่ครบทุกทางแยก

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

กติกาง่าย ๆ คือ Journey หนึ่งอันแตกออกเป็นหลาย Flow ได้ ให้เลือกช่วงที่ติดขัดที่สุดมาทำ Flow ก่อน อย่าพยายามทำ Flow ของทุกอย่างพร้อมกัน ถ้ายังไม่เคยทำ Journey Map มาก่อน เริ่มได้จาก มาทำ User Journey Map แบบ Step By Step กัน !

ใช้ AI ร่าง User Journey จาก Persona

ทีนี้มาดูว่าจะให้ AI ช่วยยังไง เริ่มจาก Journey ก่อน จุดตั้งต้นที่ดีที่สุดคือ Persona (ภาพตัวแทนผู้ใช้ที่สรุปจากข้อมูลจริง) ที่ทีมตรวจแล้ว อย่าให้ AI แต่ง Persona ใหม่ไปพร้อมกับ Journey ในคำสั่งเดียว เพราะถ้าฐานเป็นการเดา ทุกอย่างที่ต่อยอดขึ้นไปก็เดาตามหมด

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

Prompt / Templateนี่คือ Persona ที่ทีมตรวจแล้ว:
<วาง Persona>

ข้อมูลจริงที่เกี่ยวข้อง (ลบชื่อและข้อมูลส่วนตัวแล้ว):
<วางรีวิว ข้อความแชท หรือโน้ตสัมภาษณ์>

ช่วยร่าง User Journey ของ Persona นี้ ตั้งแต่ <จุดเริ่มต้น เช่น รู้ตัวว่าอยากได้กาแฟก่อนเข้างาน> จนถึง <จุดสิ้นสุด เช่น ได้กาแฟในมือ>
ทำเป็นตาราง มีคอลัมน์: ช่วง, สิ่งที่ผู้ใช้ทำ, ช่องทางที่ใช้, ความคิด, ความรู้สึก, จุดที่ติดขัด, โอกาสในการปรับปรุง
ทุกช่องให้ใส่ป้าย [จากข้อมูล] หรือ [AI คาดเดา]
ถ้าช่วงไหนไม่มีข้อมูลรองรับเลย ให้เขียนว่า "ต้องหาข้อมูลเพิ่ม" แทนการแต่งขึ้นมา

ได้ร่างแล้ว อย่าเพิ่งเอาไปใช้ต่อ ตรวจ 3 จุดนี้ก่อน

  1. ช่องทางนอกแอป เช่น ทักแชทถามร้าน โทรหาสาขา หรือเดินไปถามที่เคาน์เตอร์ AI มักลืมช่องทางพวกนี้ หรือใส่ช่องทางที่ธุรกิจคุณไม่มีมาให้
  2. อารมณ์ที่ดูเป็นสูตร ถ้าทุกช่วงขึ้นลงเป็นจังหวะสวยงาม ตื่นเต้น กังวล แล้วโล่งใจ ทั้งที่ไม่มีข้อมูลรองรับ ให้ติดป้ายเป็นสมมติฐานไว้ก่อน
  3. จุดติดขัดตรงกับเสียงจริงไหม เทียบกับสิ่งที่ผู้ใช้บ่นจริงในข้อมูล ถ้าจุดที่ AI บอกว่าสำคัญที่สุด ไม่มีใครพูดถึงเลย ก็อาจเป็นการเดา

ใช้ AI ร่าง User Flow จาก Journey

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

Prompt นี้สั่งให้ AI แตกทางแยก และใส่กรณีที่ไม่ราบรื่นตั้งแต่แรก นี่คือสิ่งที่ Flow ในไฟล์ Figma ตอนต้นเรื่องขาดไป

Prompt / Templateจาก User Journey ข้างบน ให้โฟกัสที่ช่วง <ชื่อช่วงที่ติดขัดที่สุด>
ช่วยร่าง User Flow ของงาน "<งานที่ผู้ใช้ต้องทำให้สำเร็จ>" ใน <ชื่อผลิตภัณฑ์>

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

ถ้าใช้ Claude ลองพิมพ์ต่อว่า “วาด Flow นี้เป็น Flowchart” Claude สร้างไดอะแกรมแบบนี้เป็น Artifact ได้ คือเปิดเป็นหน้าต่างแยกข้างบทสนทนา และสั่งแก้ต่อได้ ทีมจะเห็นทางแยกทั้งหมดในภาพเดียว

จุดที่ต้องตรวจเป็นพิเศษ คือกติกาของร้านที่ AI ใส่มาเอง (เรียกว่ากติกาทางธุรกิจ) เช่น “ถ้าเมนูหมด ระบบคืนเงินอัตโนมัติทันที” ฟังดูมีเหตุผล แต่ถ้าร้านคุณให้เปลี่ยนเป็นเมนูอื่นแทน หน้าจอทั้งชุดจะผิดตั้งแต่ต้น กติกาแบบนี้ต้องยืนยันกับคนที่ดูแลขั้นตอนนั้นจริงเสมอ

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

ตัวอย่างแอปรับออเดอร์บนมือถือ หน้าคิวงานคลังสินค้า และแดชบอร์ดรายงาน End of Day
ตัวอย่างผลงานจากคอร์ส Start Step AI for UX/UI Design: แอปรับออเดอร์และแดชบอร์ด

ทบทวนพื้นฐานการเขียน Flow แบบละเอียดได้ใน มาออกแบบ Flow เพื่อสร้างประสบการณ์ที่ดีให้ User กันเถอะ ! – part 1 และ Part 2

อยากลอง Workflow นี้กับโจทย์จริงพร้อมคนช่วยตรวจงาน? Start Step AI for UX/UI Design พาทำครบตั้งแต่ Persona ถึงหน้าจอใน Figma ภายในวันเดียว

วิธีจับว่า AI กำลัง “เดา”

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

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

ถ้าเริ่มสงสัย ให้ทำ 3 อย่างนี้

  1. ถามกลับตรง ๆ ว่า “ข้อไหนในคำตอบที่ไม่มีข้อมูลรองรับ” แล้วดูว่าคำตอบตรงกับป้ายที่มันติดไว้ไหม
  2. ไล่หาต้นทาง ทุกข้อที่ติดป้าย [จากข้อมูล] ต้องชี้กลับไปที่ข้อความต้นฉบับได้ ถ้าหาไม่เจอ ให้ย้ายไปเป็นสมมติฐาน
  3. ให้คนหน้างานอ่าน ส่ง Flow ให้คนที่อยู่กับงานจริง เช่น บาริสต้าหรือผู้จัดการสาขา อ่านสักไม่กี่นาที คนกลุ่มนี้มักชี้จุดที่ไม่ตรงกับความจริงได้ทันที

เช็กลิสต์ Edge Case ก่อนส่งงานให้ Dev

กลับมาที่คำถามของ Dev ตอนต้นเรื่อง ลูกค้าปิดการแจ้งเตือน เมนูหมดตอนจ่ายเงิน พวกนี้คือกรณีที่หลุดจากเส้นทางปกติ หรือ Edge Case นั่นเอง

Edge Case คือจุดที่การเดาของ AI สร้างความเสียหายมากที่สุด เพราะรีวิวหน้าจอตามปกติจะมองไม่เห็น แล้วมันไปโผล่ตอน Dev เขียนโค้ด ใช้ตารางนี้ไล่ทุก Flow ก่อนส่งต่อ

กรณีต้องตอบให้ได้ว่าตัวอย่างในแอปร้านกาแฟ
Error (ผิดพลาด)ผู้ใช้ทำผิดหรือระบบล้มเหลว จะบอกอะไร และให้ทำอะไรต่อจ่ายเงินไม่ผ่าน หรือเน็ตหลุดตอนกดยืนยัน ลูกค้าต้องรู้ว่าโดนตัดเงินไปแล้วหรือยัง
Empty (ยังไม่มีข้อมูล)หน้าจอจะแสดงอะไรแทนลูกค้าใหม่เปิดหน้า “ออเดอร์ของฉัน” ที่ยังไม่มีรายการ
Loading (กำลังโหลด)ระหว่างรอ ผู้ใช้เห็นอะไร กดซ้ำได้ไหมกดจ่ายแล้วระบบกำลังรอผล ถ้ากดซ้ำจะโดนตัดเงินสองครั้งไหม
Permission (สิทธิ์และการอนุญาต)ใครทำอะไรได้บ้าง ถ้าไม่มีสิทธิ์หรือไม่ได้อนุญาตจะเห็นอะไรลูกค้าปิดการแจ้งเตือนไว้ หรือพนักงานหน้าร้านพยายามยกเลิกออเดอร์ที่ต้องให้ผู้จัดการอนุมัติ
ของไม่พอทำต่อได้บางส่วน หรือต้องหยุดเมนูหมดหลังใส่ตะกร้าไปแล้ว
สำเร็จทำเสร็จแล้วบอกอะไร และไปไหนต่อจ่ายแล้ว แสดงเลขออเดอร์ เวลารับ และจุดรับในร้าน
เปลี่ยนใจยกเลิก แก้ไข หรือย้อนกลับได้แค่ไหนขอยกเลิกออเดอร์หลังบาริสต้าเริ่มทำแล้ว

สังเกตว่าคำถามของ Dev ทั้งสองข้ออยู่ในตารางนี้แล้ว คือแถว Permission กับแถวของไม่พอ ถ้าทีมไล่ตารางนี้ก่อนเริ่มสปรินต์ ก็มีโอกาสเจอคำถามพวกนี้ตั้งแต่ก่อนลงมือเขียนโค้ด

อยากเห็นตัวอย่างหน้าจอของแต่ละสถานะเพิ่ม อ่าน แนะนำ 7 UI STATE ที่แต่ละเว็บควรมี ! ประกอบได้

AI ช่วยไล่หาช่องโหว่ได้ดี ขอแค่สั่งให้มันตั้งคำถาม แทนที่จะตัดสินใจแทนทีม

Prompt / Templateนี่คือ User Flow ที่ทีมร่างไว้:
<วาง User Flow>

ช่วยไล่ทีละขั้น แล้วหาว่ายังขาดกรณีไหนบ้าง โดยเช็ก 4 กลุ่ม: Error, Empty, Loading, Permission
ตอบเป็นตาราง มีคอลัมน์: ขั้นที่, กรณีที่ขาด, สิ่งที่ผู้ใช้ควรเห็น, คำถามที่ทีมต้องตัดสินใจ
อย่าตัดสินใจเรื่องกติกาทางธุรกิจเอง ให้เขียนเป็นคำถามแทน

คอลัมน์สุดท้ายสำคัญที่สุด เพราะมันจะกลายเป็นวาระประชุมสั้น ๆ กับ PM และ Dev ก่อนเริ่มสปรินต์ แทนที่จะไปเจอคำถามเดียวกันกลางสปรินต์ แบบที่ทีมเจอตอนต้นเรื่อง

ฝึกร่าง Journey และ Flow กับโจทย์จริงในวันเดียว

ถ้าอยากลองทำทั้งหมดนี้กับโจทย์จริง โดยมีคนดูงานให้ Start Step AI for UX/UI Design คือ Workshop สด 1 วันของ borntoDev ที่ช่วงสายพาร่าง Persona ต่อด้วย User Journey กับ User Flow โดยตรง

เวลาเรียนอะไร
09:45–10:30ใช้ AI ร่าง Persona จากข้อมูลปัญหาผู้ใช้จริง และแยกว่าข้อไหนมาจากข้อมูล ข้อไหน AI เดา
10:45–11:30ใช้ AI ร่าง User Journey จาก Persona นั้น และแก้จุดที่ AI เดาผิด
11:30–12:00ใช้ AI ร่าง User Flow ของหน้าจอหลัก และตรวจว่าเส้นทางสมเหตุสมผล
13:00–14:00ต่อยอดเป็น Low-fidelity Prototype จาก User Flow แล้วปรับให้ตรงกับปัญหาผู้ใช้
15:00–15:50รีวิวผลงานทั้งหมด ยืนยันว่าทุกชิ้นที่ AI ร่างผ่านการตรวจและอธิบายเหตุผลแล้ว

ทุกช่วงใช้ลูปเดียวกัน คือ ตั้งโจทย์ → AI ร่าง → ตรวจสอบ → แก้ไข → อธิบายเหตุผล บนกรณีศึกษาเดียวที่ต่อเนื่องทั้งวัน ช่วงบ่ายจะพาไปถึงการสร้างหน้าจอจริงด้วยตัวเองใน Figma และผู้เรียนได้การ์ดสรุปขั้นตอนกลับไปใช้ต่อ

บรรยากาศ Workshop UX/UI ในห้องอบรม borntoDev ผู้เรียนฝึกทำงานด้วยโน้ตบุ๊กพร้อมผู้สอน
บรรยากาศ Workshop ที่ Training Room บริษัท บอร์นทูเดฟ จำกัด
  • เครื่องมือ 3 ตัว ChatGPT (Idea & Research), Claude (Design / Artifacts) และ Figma (UI Design) เตรียมคอมพิวเตอร์ที่ต่ออินเทอร์เน็ต และบัญชีของทั้ง 3 เครื่องมือ
  • คลาสไม่เกิน 12 ท่าน ผู้สอนจึงดูงานของแต่ละคนได้ และช่วงท้ายวันมีการรีวิวผลงานทั้งหมด
  • เหมาะกับ Designer ที่อยากใช้ AI ช่วยออกแบบและสร้าง Prototype ได้เร็วขึ้น, Developer ที่อยากร่วมวาง User Flow และเข้าใจแนวทางการออกแบบหน้าจอ และ Product / Business ที่อยากสื่อสารงานออกแบบได้อย่างมืออาชีพ
  • ไม่ต้องมีพื้นฐานมาก่อน นอกจากใช้คอมพิวเตอร์ได้ตามปกติ เนื้อหาเริ่มจากพื้นฐานการใช้ AI ในงานออกแบบ แล้วพาลงมือทำทีละขั้น
  • รอบเรียน 28 พฤศจิกายน 2569 เวลา 09:00–16:00 น. ที่ Training Room สำนักงานใหญ่ borntoDev ถนนเสรีไทย เขตบางกะปิ ใกล้ The Mall บางกะปิ และ NIDA เรียนสดเท่านั้น ไม่มีวิดีโอย้อนหลัง และได้ประกาศนียบัตรเมื่อเรียนจบ

ผู้สอนคือ อาจารย์พีรพนธ์ (อ.พี) Expert UX/UI Designer ของ borntoDev ผู้ออกแบบผลิตภัณฑ์ให้แบรนด์ระดับประเทศ เชี่ยวชาญด้าน Design System, User Research และ Product Design Thinking อ.พีอยู่กับงานด้าน HCI (Human-Computer Interaction) มากว่า 10 ปี สอนผู้เรียนมาแล้วกว่า 600 คน และเป็นผู้สอนหลักของ Master of UX/UI Bootcamp ของ borntoDev

ดูตารางเรียนเต็มวันและรายละเอียดการสมัครได้ที่หน้าคอร์ส Start Step AI for UX/UI Design

Onsite Workshop · เรียนวันเดียวจบ

Start Step AI for UX/UI Design

ใช้ AI ช่วยออกแบบ UX/UI ให้เร็วขึ้น โดยไม่ลดคุณภาพ ลงมือทำจริงตั้งแต่ Persona → User Journey → User Flow → Prototype → หน้าจอจริงใน Figma พร้อมฝึกตรวจผลงานจาก AI และอธิบายเหตุผลได้

  • วันเรียน: 28 พฤศจิกายน 2569 · 09:00–16:00 น.
  • สถานที่: Training Room บริษัท บอร์นทูเดฟ จำกัด (ถนนเสรีไทย บางกะปิ ใกล้เดอะมอลล์บางกะปิและนิด้า)
  • ขนาดคลาส: ไม่เกิน 12 ท่าน · เรียนสด ไม่มีวิดีโอย้อนหลัง · รับ Certificate เมื่อจบหลักสูตร
  • เครื่องมือ: ChatGPT · Claude · Figma
  • ผู้สอน: อาจารย์พีรพนธ์ (อ.พี) Expert UX/UI Designer ทีม borntoDev
  • ค่าเรียน: 8,500 บาท/คน · สมัครกลุ่ม 3–4 คน 7,700 บาท/คน · นักศึกษา 6,800 บาท/คน (ยืนยันสิทธิ์กับแอดมินก่อนสมัคร) รวม VAT

ดูรายละเอียดและจองที่นั่ง →

คำถามที่พบบ่อย

User Journey กับ Customer Journey เหมือนกันไหม

ใกล้เคียงกันมาก และหลายทีมก็ใช้แทนกัน ปกติ Customer Journey มักมองความสัมพันธ์กับแบรนด์ทั้งหมด ตั้งแต่รู้จักจนถึงบริการหลังการขาย ส่วน User Journey มักโฟกัสที่คนใช้ผลิตภัณฑ์เพื่อทำเป้าหมายหนึ่งให้สำเร็จ ที่สำคัญกว่าชื่อ คือทีมตกลงขอบเขตให้ตรงกันตั้งแต่ต้น

ต้องทำ User Journey ก่อน User Flow ทุกครั้งไหม

ไม่จำเป็น ถ้าเป็นการปรับฟีเจอร์เล็ก ๆ ที่รู้ปัญหาชัดอยู่แล้ว เริ่มที่ Flow ได้เลย แต่ถ้าเป็นฟีเจอร์ใหม่ หรือปัญหาที่เกี่ยวกับหลายบทบาทและหลายช่องทาง ทำ Journey ก่อนจะช่วยให้ไม่แก้ผิดจุด

User Flow กับ Wireflow ต่างกันยังไง

User Flow มักเป็นกล่องกับลูกศร ที่แสดงลำดับขั้นตอนและทางแยก ส่วน Wireflow ใส่โครงหน้าจอแบบหยาบลงไปในแต่ละขั้นด้วย เลยเห็นทั้งเส้นทางและหน้าตาไปพร้อมกัน Wireflow เหมาะกับตอนที่ทีมต้องคุยกันว่าแต่ละขั้นแสดงอะไรบนหน้าจอ

ให้ AI ร่าง User Journey กับ User Flow เชื่อถือได้แค่ไหน

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

Developer เรียนคอร์ส Start Step AI for UX/UI Design ได้ไหม

ได้ คอร์สระบุว่าเหมาะกับ Developer ที่อยากร่วมวาง User Flow และเข้าใจแนวทางการออกแบบหน้าจอ และไม่ต้องมีพื้นฐานด้านออกแบบมาก่อน ขอแค่ใช้คอมพิวเตอร์ได้ตามปกติ และเตรียมบัญชี ChatGPT, Claude และ Figma มาให้พร้อม

0

แนะนำสำหรับคุณ

คัดลอกลิงก์สำเร็จ

เราใช้คุกกี้เพื่อพัฒนาประสิทธิภาพ และประสบการณ์ที่ดีในการใช้เว็บไซต์ของคุณ คุณสามารถศึกษารายละเอียดได้ที่ นโยบายความเป็นส่วนตัว และสามารถจัดการความเป็นส่วนตัวเองได้ของคุณได้เองโดยคลิกที่ ตั้งค่า

ตั้งค่าความเป็นส่วนตัว

คุณสามารถเลือกการตั้งค่าคุกกี้โดยเปิด/ปิด คุกกี้ในแต่ละประเภทได้ตามความต้องการ ยกเว้น คุกกี้ที่จำเป็น

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

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

  • คุกกี้สำหรับการติดตามทางการตลาด

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

บันทึกการตั้งค่า