תזמון אנימציה אסימטרית

שבירת סימטריה מספקת ניגודיות ומושכת לפרויקטים שלכם. מתי ואיך ליישם את זה על הפרויקטים שלכם?

תזמון האנימציה האסימטרית משפר את חוויית המשתמש בכך שהוא מאפשר לך לבטא את האישיות, ובו-זמנית להגיב במהירות לאינטראקציות של המשתמשים. בנוסף, העיצוב יוצר ניגודיות, ולכן הממשק מושך יותר מבחינה חזותית.

• אפשר להשתמש בתזמון אנימציה אסימטרי כדי להוסיף אישיות וניגודיות לעבודה.
• תמיד כדאי לתת עדיפות לאינטראקציה של המשתמש, להשתמש במשכי זמן קצרים יותר כשמגיבים להקשות או לקליקים, ולשמור פרקי זמן ארוכים יותר למקרים שבהם הצופים לא מגיבים.

כמו רוב "כללי" האנימציה, עליכם להתנסות כדי לגלות מה מתאים לאפליקציה שלכם, אבל בכל מה שקשור לחוויית המשתמש, המשתמשים ידועים לשמצה בחוסר סבלנות. העיקרון הוא תמיד להגיב במהירות לאינטראקציה של משתמש. עם זאת, ברוב המקרים פעולת המשתמש היא אסימטרית, ולכן גם האנימציה יכולה להיות.

לדוגמה, כשמשתמש מקיש כדי להציג ניווט בסרגל הצד, יש להציג אותו במהירות האפשרית, בטווח של כ-100 אלפיות שנייה. עם זאת, אם המשתמש סוגר את התפריט, אתם יכולים להשאיר אנימציה של התצוגה לאט יותר, נניח, בערך של 300 אלפיות השנייה.

לעומת זאת, בהפעלה של תצוגה מודאלית, בדרך כלל אמורה להופיע שגיאה או הודעה קריטית אחרת. במקרים כאלה, רצוי להציג את התצוגה לאט יותר, שוב בערך של 300 אלפיות השנייה, אבל ביטול, שהמשתמש מפעיל, אמור להתרחש מהר מאוד.

לאחר מכן, העיקרון המנחה הוא:

• במקרה של אנימציות בממשק המשתמש שמופעלות על ידי אינטראקציה של משתמש, כמו מעבר בין תצוגה או הצגת רכיב, יש לכלול פתיח מהיר (משך זמן קצר), אבל סיום איטי יותר (משך זמן ארוך יותר).
• באנימציות בממשק המשתמש שמופעלות על ידי הקוד, כמו שגיאות או תצוגות חלון, יש להציג פתיח איטי יותר (משך זמן ארוך יותר), אבל סיום מהיר (משך זמן קצר).