การกำหนดเวลาของภาพเคลื่อนไหวแบบอสมมาตร

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

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

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

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

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

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

โดยมีกฎทั่วไปดังนี้

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