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

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

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

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

เหตุใดการโต้ตอบกับผู้ใช้ระหว่างความคืบหน้าของระบบจึงมีความสำคัญ

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

ให้ผู้ใช้ติดใจกับคำติชม

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

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

จะใช้ตัวบ่งชี้ความคืบหน้าสำหรับการดำเนินการใด ๆ ที่ใช้เวลานานกว่าหนึ่งวินาทีได้อย่างไร

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

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

ประเภทของตัวชี้วัดความก้าวหน้า

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

ตัวบ่งชี้นิเมชั่นแบบวนซ้ำและตัวบ่งชี้เปอร์เซ็นต์ที่ทำเสร็จแล้ว

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

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

  

  

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

วิธีการใช้ตัวชี้วัดความก้าวหน้าอย่างมีประสิทธิภาพ?

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

1. แจ้งให้ผู้ใช้ทราบเกี่ยวกับเหตุผลที่รอ : เป็นความผิดพลาดของมือใหม่ที่จะทำให้ผู้ใช้ลืมเกี่ยวกับความคืบหน้าในการโหลดที่เกิดขึ้นในเบื้องหลัง สิ่งนี้จะเพิ่มแนวโน้มที่จะหมดความอดทนและออกจากแอปพลิเคชันหรือเว็บไซต์ คุณสามารถแจ้งให้ผู้ใช้ทราบโดยแสดงตัวบ่งชี้ความคืบหน้าแบบเคลื่อนไหวพร้อมด้วยข้อความบางส่วนเพื่อความเข้าใจเพิ่มเติม คุณสามารถแสดงกระบวนการที่กำหนดเป้าหมายโดยเฉพาะได้ ตัวอย่างเช่น คุณสามารถแสดงความคืบหน้าในการรอของวิดีโอเกมด้วยแถบการโหลดและข้อความที่อ่านว่ากำลังดำเนินการใดอยู่ เช่น 'กำลังโหลดกราฟิก' หรือ 'กำลังโหลดแผนที่' เป็นต้น
2. ระบุการประมาณเวลาอย่างง่ายสำหรับงานที่ต้องใช้เวลานานกว่า : อย่านำสิ่งต่าง ๆ มาสู่เครื่องชั่งขนาดเล็ก คุณสามารถให้ผู้ใช้มีส่วนร่วมโดยให้ค่าประมาณง่ายๆ การหลอกใช้คำสัญญาที่คุณไม่สามารถรักษาไว้ได้อาจทำให้ผู้ใช้ระคายเคืองและบังคับให้พวกเขาออกไป
3. แสดงระยะเวลาที่ต้องการอย่างแม่นยำ : อย่างไรก็ตาม สำหรับการดำเนินการที่โดยทั่วไปใช้เวลานานกว่าขีดจำกัดการรอเฉลี่ยของผู้ใช้ การเลือกตัวบ่งชี้ความคืบหน้าจะเป็นการดำเนินการที่ชาญฉลาดยิ่งขึ้น ตัวเลือกที่เหมาะสมที่สุดคือตัวบ่งชี้ความคืบหน้าเป็นเปอร์เซ็นต์ เนื่องจากจะทำให้เวลาในการโหลดที่แม่นยำกลายเป็นประเด็นสำคัญ สำหรับการดำเนินการที่ต้องจัดการได้นานกว่า ให้พิจารณาใช้จำนวนขั้นตอนเพื่อเน้นความคืบหน้า
4. ติดตามความคืบหน้า : พยายามตั้งเป้าให้สอดคล้องกันในแถบความคืบหน้าของคุณในระหว่างการโหลดงาน หลังจากประสบการณ์บางอย่าง แถบความคืบหน้าบังคับให้ผู้ใช้พัฒนาความคาดหวังว่าการดำเนินการจะเสร็จสิ้นเร็วเพียงใด ดังนั้น การหยุดนิ่งใดๆ ระหว่างความคืบหน้าอาจส่งผลกระทบร้ายแรงต่อความคาดหวังของผู้ใช้ ตัวอย่างเช่น เมื่อแถบไปถึง 99% และยังคงเป็นเช่นนี้เป็นเวลานาน ผู้ใช้ส่วนใหญ่รู้สึกหงุดหงิดกับพฤติกรรมนี้และปล่อยให้แอปพลิเคชันเชื่อว่าถูกระงับ เพื่อแก้ปัญหานี้ คุณสามารถปิดบังความล่าช้าที่ไม่สอดคล้องกันเหล่านี้ในแถบความคืบหน้าโดยแสดงการเคลื่อนไหวทันทีและต่อเนื่อง
5. แสดงความคืบหน้าในแถบที่เร็วกว่าความเร็วจริง : ความเร็ว ดิบสามารถแสดงออกได้ด้วยการรับรู้ง่ายๆ ที่คุณสามารถสร้างได้เพื่อให้แถบแสดงความคืบหน้ารู้สึกเร็วขึ้น คุณสามารถทำสิ่งนี้ได้โดยการออกแบบแอนิเมชั่นให้เคลื่อนไหวช้าในตอนแรก และเลือกความเร็วเมื่อปิดตอนจบ สิ่งนี้จะสร้างภาพลวงตาของความก้าวหน้าที่รวดเร็วโดยไม่กระทบต่อเวลาในการทำงานให้เสร็จ
6. เสนอสิ่งที่ทำให้ไขว้เขว : การรับรู้เวลาของผู้ใช้จะลดลงอย่างมากด้วยการแนะนำตัวบ่งชี้ความคืบหน้าที่สร้างสรรค์ หากแอปแสดงรายละเอียดที่เป็นข้อความหรือภาพที่น่าสนใจในขณะที่ดำเนินการ แอปอาจเบี่ยงเบนความสนใจของผู้ใช้จากเวลาที่ดำเนินการให้เสร็จสิ้น คุณสามารถนำเสนอสิ่งต่างๆ มากมายเพื่อให้ผู้ใช้ไม่ว่าง เช่น วิดีโอสั้น ข้อเท็จจริงที่น่าสนใจ แอนิเมชั่น และแม้แต่เกมเล็กน้อย

ทางเลือก – ใช้หน้าจอโครงกระดูกเพื่อต่อต้านตัวบ่งชี้ความคืบหน้าของแอนิเมชั่น

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

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

ความคิดสุดท้าย

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

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