המנגנון שהופך את אפטר לאפטר. Keyframe הוא "עוגן של ערך בזמן מסוים" — שתיים או יותר ואפטר מחליף ביניהם אוטומטית. נשמע פשוט, אבל מתחת לזה מסתתרים Graph Editor, Easy Ease, Bezier curves וכל הסוד של אנימציה מקצועית.
המושג הושאל מאנימציה מסורתית. במקור, ה-"keys" היו הציורים הראשיים — ומלאכת המלאכים שציירו את הפריימים שביניהם. אפטר הוא מלאך האמצעים.
Keyframe = "פריים-מפתח" = נקודה בזמן שבה הגדרתם ערך ספציפי לתכונה מסוימת. אתם קובעים את נקודות המפתח, ואפטר ממלא את כל מה שביניהן.
נניח שרוצים שטקסט ייכנס מצד שמאל. זה אומר שבזמן 0 — הוא ב-X = -500 (מחוץ למסך), ובזמן 1 שנייה — הוא ב-X = 960 (אמצע המסך). אלו שני Keyframes. אפטר מחליף אוטומטית בין 30 (או 60, תלוי ב-FPS) פריימים שמתארים את המסע.
בדוגמה: Keyframe ב-0 עם X = -500, Keyframe ב-1 שנייה עם X = 960. הקו האפור הוא האנימציה הדיפולטיבית (ליניארית — מהירות אחידה). הקו הצהוב הוא אחרי Easy Ease — החלקה של ההאצה וההאטה. ההבדל הויזואלי מטורף.
שלושה שלבים. אבל בפעם הראשונה זה מרגיש קסום — ומשם אי אפשר לחזור.
בחרו שכבה, לחצו על הקיצור המתאים: P (Position), S (Scale), R (Rotation), T (Opacity). התכונה תופיע מתחת לשכבה.
לצד שם התכונה יש אייקון של שעון עצר קטן. לחיצה עליו מפעילה את ה-keyframing. ברגע שהוא דלוק — כל שינוי של הערך יוצר אוטומטית Keyframe במיקום הנוכחי של Playhead.
גררו את Playhead (הקו הצהוב בטיימליין) לזמן אחר — למשל 1 שנייה — ושנו את הערך (הזיזו את השכבה במסך, או הקלידו ערך חדש). Keyframe חדש ייווצר. יש לכם אנימציה.
לא חייבים ליצור Keyframe ידנית בכל פריים. מספיקים שניים: נקודת התחלה ונקודת סיום. אפטר מחשב את כל מה שביניהם. זה המושג "Interpolation" — ה"מילוי" האוטומטי.
בחרו את ה-Keyframe בטיימליין (הוא ייהפך כחול) ולחצו Delete. לחילופין — כיבוי של שעון העצר ימחק את כל ה-Keyframes של התכונה.
אפשר לבחור Keyframes, ללחוץ Ctrl+C, להזיז את Playhead לזמן אחר או לבחור שכבה אחרת, וללחוץ Ctrl+V — הם יוטבעו שם. כלי שימושי מאוד.
Keyframes פשוטים יוצרים תנועה מכנית, רובוטית. Easing יוצר תנועה שמרגישה חיה. ההבדל בין סרטון של חובב לסרטון מקצועי הוא כמעט תמיד — כיוון נכון של Easing.
כברירת מחדל, אפטר יוצר אנימציה לינארית: מהירות קבועה לאורך כל המעבר. זה לא טבעי. בטבע, דברים מתחילים לאט, מגיעים למהירות, וחוזרים לאט. זה Easing.
| סוג | איך זה מרגיש | איך עושים |
|---|---|---|
| Linear | מכני, רובוטי | ברירת מחדל |
| Easy Ease In | מתחיל מהיר, מגיע לאט | לחיצה ימנית על Keyframe → Keyframe Assistant → Easy Ease In (Shift+F9) |
| Easy Ease Out | מתחיל לאט, מתפוצץ החוצה | Easy Ease Out (Ctrl+Shift+F9) |
| Easy Ease (בשני הצדדים) | טבעי, חלק | F9 — הקיצור החשוב ביותר באפטר |
| Custom Bezier | שליטה מלאה — overshoot, bounce, וכו' | Graph Editor (פרק הבא) |
לא מפעילים Easing. אנימציה ליניארית נראית כמו בובה שנגררת על חוט. תמיד — תמיד — בחרו את כל ה-Keyframes ולחצו F9. זה הכלל הראשון של אנימציה.
ל-Keyframe יש צורה שמייצגת את ה-Easing שלו:
Easy Ease זה התחלה טובה. Graph Editor הוא הטירוף. פה בונים אנימציה עם bounce, overshoot, אנטיסיפציה, וכל הטריקים של Pixar.
Graph Editor הוא מצב תצוגה שונה של הטיימליין. במקום לראות את ה-Keyframes כנקודות, רואים גרף של הערך לאורך הזמן. ציר X = זמן, ציר Y = ערך. אפשר לגרור את העקומה ישירות ולעצב אותה.
בחרו תכונה בטיימליין, לחצו על האייקון של הגרף בראש פאנל הטיימליין (או Shift+F3). התצוגה תשתנה — ותראו עקומה גרפית במקום שכבות.
רוצים שאובייקט "יקפוץ" כמו כדור? צרו 2 Keyframes של Position (מלמעלה למטה). פתחו Graph Editor. משכו את ידית הסיום מטה מעבר לקו — ואז חזרה למעלה. העקומה הזו יוצרת אפקט bounce טבעי.
הרמה הבאה (נגיע אליה במדריך מאוחר בסדרה) — במקום Keyframes, כותבים קוד JavaScript שמחשב את הערך אוטומטית. הפקודה הכי פופולרית: wiggle(2, 30) — יוצרת רעידה אקראית עצמאית, בלי Keyframes בכלל.
מה שמבדיל בין "עשיתי אנימציה" ל"אנימציה מקצועית" הוא לא הטכנולוגיה — זה הניואנסים.
אנימציה של 5 אלמנטים שנכנסים יחד = משעמם. אותה אנימציה עם פער של 3 פריימים בין כל אלמנט = מקצועי. בחרו את כל ה-Keyframes ולחצו Alt+] להזיז פריים קדימה.
טקסט שמגיע בדיוק ל-100% Scale נראה סטטי. טקסט שמגיע ל-105%, חוזר ל-98%, ומתיישב ב-100% — נראה חי. זה Overshoot. עושים את זה עם 3 Keyframes במקום 2.
לפני שאובייקט "זז ימינה", הוא זז שמאלה בקצת. זה מה שעושה גיבור מצויר לפני שהוא רץ. באפטר: Keyframe בנקודת ההתחלה, Keyframe קטן בכיוון ההפוך, ואז Keyframe בנקודה הסופית.
הפעילו את אייקון ה-Motion Blur על השכבה (הסמל דומה לשלושה קווים מטושטשים). כל אנימציה שלה תקבל טשטוש תנועה ריאליסטי. הכרחי לאנימציית Scale מהירה או תנועה על מסך.
כדור שמתחבט ברצפה לא נשאר עגול — הוא מתרחב אופקית ומתכווץ אנכית. זה עיקרון יסודי של אנימציה. באפטר מיישמים עם Scale לא-אחיד (לחיצה על השרשרת הקטנה ליד Scale מבטלת את האחידות).
במקום להנפיש 10 שכבות בנפרד — מפרנטים אותן לנול ומנפישים רק את הנול. אם צריך לשנות את האנימציה אחר כך — עורכים רק את הנול. חיסכון עצום בזמן.
גם היום — 80 שנה אחרי שפותחו — 12 עקרונות האנימציה של דיסני (Timing, Spacing, Squash & Stretch, Anticipation, Follow-through, וכו') הם הבסיס של כל סטודיו מקצועי. מומלץ מאוד לחפש ביוטיוב "12 Principles of Animation" ולראות את זה.
זה לא סתם תרגיל קלאסי. הוא משלב את כל מה שלמדנו פה: Keyframes, Easing, Graph Editor, Motion Blur, ועיקרון Squash & Stretch.
תרגיל של 10 דקות. התוצאה: אנימציה שנראית חיה — כדור שקופץ. אחרי שמצליחים את זה — אתם יודעים להנפיש כל דבר באפטר.
99% מהפעמים זה כי לא הזזתם את ידיות ה-Bezier ב-Graph Editor. אנימציה מקצועית בנויה על זה. תרגלו את זה עד שזה הופך לאינסטינקט.
Keyframes הם הלב של אפטר. יצירה בלחיצה על שעון עצר, החלקה עם Easy Ease, שליטה דקה ב-Graph Editor, ועוד שישה טריקים מקצועיים. זה הבסיס לכל אנימציה — מטיטל לפיצ'ר-פילם.
עד פה — שלטתם בממשק (מדריך 01), הכרתם את השכבות (02), ועכשיו יודעים איך להניע אותן (03). זה 80% ממה שמתחילים צריכים. במדריך הבא — פותחים פרק מיוחד: עברית באפטר אפקט. הבעיה הגדולה ביותר של כל מתחיל ישראלי.
לפני שממשיכים למדריך הבא — תרגלו Bouncing Ball לפחות 3 פעמים. זכרו: אנימציה היא מיומנות-שריר. יודעים אותה כשעושים — לא כשקוראים עליה.