วิธีสร้างกระแสผู้ใช้สำหรับอีคอมเมิร์ซ

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

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

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

และเป็นแฟนตัวยงของพอลลอคหรือไม่ ภาพวาดของเขาไม่เคยต้องนำทางจากขั้นตอนหนึ่งไปยังอีกขั้นตอนหนึ่ง

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

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

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

User Flow Diagram คืออะไร?

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

ตัวอย่างไดอะแกรมการไหลของผู้ใช้จาก UX Collective

บทบาทของการไหลของผู้ใช้ในการออกแบบ UX

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

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

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

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

ตัวอย่างไดอะแกรมการไหลของผู้ใช้จาก Creately

การไหลของผู้ใช้ระดับสูงและรายละเอียด

ขั้นตอนของผู้ใช้ระดับสูงนั้นรวดเร็วและสั้น สร้างขึ้นเพื่อให้ภาพรวมคร่าวๆ ของแนวคิดหรือกระบวนการ

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

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

กระแสผู้ใช้เทียบกับการเดินทางของผู้ใช้

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

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

วิธีสร้างไดอะแกรมโฟลว์ผู้ใช้

1. ตัดสินใจเกี่ยวกับวัตถุประสงค์ของแผนภาพ

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

ให้ชื่อที่ชัดเจนแก่ผู้ใช้ตามวัตถุประสงค์สำหรับการอ้างอิงในอนาคต

2. ทำความเข้าใจผู้ใช้ทั่วไปของคุณ

การทำความเข้าใจผู้ใช้ของคุณจะช่วยแจ้งการนำทางโฟลว์งานที่ทำงานได้ดีที่สุดและเนื้อหาที่จะรวมไว้ในแต่ละหน้า

ดำเนินการวิจัยผู้ใช้เพื่อรวบรวมผู้ใช้ของคุณ:

• เป้าหมาย
• แรงจูงใจ
• คุณสมบัติที่ต้องการ
• ระดับประสบการณ์/ความรู้
• อุปสรรค

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

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

การศึกษากระแสการแข่งขันของคุณสามารถให้ข้อมูลเชิงลึกได้เช่นกัน

3. สร้างคีย์โฟลว์งาน

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

สัญลักษณ์โฟลว์ผู้ใช้ทั่วไป ได้แก่:

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

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

ผังงานผู้ใช้ประเภทอื่นๆ

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

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

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

ตัวอย่าง User Flow จาก สลินทิพย์ แก้วเกิด บน Behance

4. ร่างไดอะแกรมโฟลว์ผู้ใช้ของคุณ

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

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

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

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

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

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

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

5. ลดกระแสของคุณ

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

1. การลบข้อมูลที่ไม่จำเป็นสำหรับการแสดงภาพโฟลว์
2. การย้ายรายละเอียดภายนอกการนำทางของผู้ใช้ไปยังแผนที่การเดินทาง
3. การระบุขั้นตอนที่ซ้ำซ้อนหรือไม่จำเป็น

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

6. ป้ายด้วยความตั้งใจ

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

เพิ่มประสิทธิภาพการไหลของผู้ใช้ของคุณด้วย Data

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

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

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

การไหลลดลงอาจเป็นผลมาจากตัวเลือกทางธุรกิจ: การเพิ่มขึ้นของอัตราตีกลับหลังจากที่ผู้ซื้อที่มีศักยภาพเห็นต้นทุนในการจัดส่งบ่งชี้ว่าอัตราค่าจัดส่งที่สูงน่าจะเป็นปัญหา

วิเคราะห์ขั้นตอนโดยรอบอัตราตีกลับ และตั้งสมมติฐานว่าปัญหา (และวิธีแก้ไข) คืออะไร ทดสอบ A/B โซลูชันของคุณจนกว่าการออกจากระบบลดลงและผู้ใช้จำนวนมากขึ้นไปยังขั้นตอนถัดไป

สร้างความแตกต่างให้กับกระแสเว็บไซต์อีคอมเมิร์ซของคุณ

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

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

คุณสามารถเสนอเพิ่มเติมได้หรือไม่? ผู้ใช้ของคุณจะได้รับประโยชน์จากคุณลักษณะเพิ่มเติมหรือไม่

ร้านค้าอีคอมเมิร์ซบางแห่งผสมผสานการเดินทางของผู้ใช้และขั้นตอนงานโดยรวมแบบทดสอบส่วนบุคคลหรือคุณลักษณะการทดลองใช้ ตัวอย่างเช่น Virtual Artist ของ Sephora ให้ผู้ใช้จำลองหน้าตาของการแต่งหน้าก่อนที่จะซื้อจากที่บ้าน

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

เมื่อสร้างโฟลว์สำหรับเว็บไซต์และแอปอีคอมเมิร์ซ พึงระลึกไว้เสมอว่าทุกขั้นตอนของช่องทางอีคอมเมิร์ซ:

• การพิจารณา
• การประเมิน
• ซื้อ
• หลังการซื้อ

ขับเคลื่อนยอดขายด้วยกระแส UX ที่มีประสิทธิภาพ

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

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

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

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