Studio Editor: הוספת אנימציה שחוזרת על עצמה בלופּ (Loop)

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

הוספת אנימציית לופ

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

כדי להוסיף אנימציית לופ:

  1. בחרו את האלמנט או המקטע הרלוונטיים.
  2. הקליקו על החץ לפתיחת חלונית ה-Inspector (עריכה)  בפינה הימנית העליונה של ה-Editor.
  3. הקליקו על הטאב Interactions  (אינטראקציות).
  4. הקליקו על ‎+ Add (הוספה) תחת Loop (לופּ).
  5. בחרו אנימציה מהרשימה.
    טיפ: עברו עם העכבר מעל האנימציות כדי לראות תצוגה מקדימה של האנימציות. 
גיף שרואים בו את אנימציות הלופּ הקיימות ואיך רואים תצוגה מקדימה כשעוברים מעליהן עם העכבר

עריכה של אנימציית לופ

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

כדי לערוך אנימציית לופ:

  1. בחרו את האלמנט, המקטע או העמוד הרלוונטיים.
  2. הקליקו על החץ לפתיחת חלונית ה-Inspector (עריכה)  בפינה הימנית העליונה של ה-Editor.
  3. הקליקו על הטאב Interactions  (אינטראקציות).
  4. הקליקו על האנימציה שאתם רוצים לשנות. 
  5. הקליקו על Adjust Animation (שינוי אנימציה) כדי לשנות את ההגדרות שלה:
    • Direction: בחרו את הכיוון שממנו האנימציה תגיע (למשל, משמאל, מלמעלה). 
    • Intensity: הפכו את האנימציה ליותר מעודנת או אגרסיבית. 
    • Duration: שנו את משך ההפעלה של האנימציה.
    • Repeat Delay: הוספת השהיה (בשניות) בין החזרות האינסופיות של האנימציה.   
    • Easing: בחרו באיזה הדרגתיות האנימציה צריכה להיכנס ו/או לצאת. 
הערה:
ההגדרות הזמינות תלויות באנימציה שתבחרו.
צילום מסך של אפשרויות ההתאמה הזמינות של אנימציית לופ נשימה

הסרה של אנימציית לופ

אתם יכולים להסיר אנימציית לופ דרך חלונית ה-Inspector (עריכה) בכל שלב. 

כדי להסיר אנימציית לופ:

  1. בחרו את האלמנט, המקטע או העמוד הרלוונטיים.
  2. הקליקו על החץ לפתיחת חלונית ה-Inspector (עריכה)  בפינה הימנית העליונה של ה-Editor.
  3. הקליקו על הטאב Interactions  (אינטראקציות).
  4. עברו עם העכבר מעל האנימציה והקליקו על אייקון הפעולות הנוספות .
  5. הקליקו על Remove (הסרה).
הסרת אנימציית לופ מחלונית העריכה

זה עזר לך?

|