BDNHOST · AE SCRIPTS LAB
מדריך 24 · Phase 3 · Automation

Expressions —
קוד קטן שעושה אנימציה ענקית.

Expressions הוא אחד הנושאים ש-99% מהמדריכים בעברית עושים ברמה של גוגל טרנסלייט. המציאות: Expression הוא שורת קוד אחת שיכולה להחליף 50 keyframes, ליצור אקראיות שנראית חיה, ולחבר תכונות של שכבות באופן שייצור אנימציות בלתי אפשריות ידנית. כל זה — בלי רקע בתכנות. בואו נסביר את זה נכון בפעם הראשונה.

זמן קריאהכ-22 דקות רמהבינוני דרישות קדם03, 07 תרגולחובה
פרק 01 · מה זה

JavaScript בפנים של אפטר

Expression הוא שורת קוד שמחליפה keyframes. במקום להגדיר ידנית "בזמן 0 הערך הוא X, בזמן 1 הערך הוא Y" — כותבים נוסחה, ואפטר מחשב את הערך לכל זמן אוטומטית.

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

דוגמה קונקרטית — רוצים ששכבה תרעיד לבד בלי שום keyframe. בלי Expression: 60 keyframes אקראיים. עם Expression: שורה אחת — wiggle(3, 20). אפטר יצייר 60 keyframes אקראיים תחת המכסה, בכל פריים.

אין צורך בידע תכנות

רוב ה-Expressions היעילים הם 1-2 שורות. אפילו בלי רקע בתכנות — אחרי שלומדים 5 פונקציות עיקריות, אפשר לבנות 80% מההתנהגויות המורכבות. זה לא "תכנות" — זו שימוש בפונקציות מוכנות.

פרק 02 · איך פותחים

פתיחת Expression Editor

Expression לא נוסף דרך תפריט — מוסיפים אותו ישירות על תכונה. כל תכונה (Position, Scale, Opacity, וכו') יכולה לקבל Expression במקום keyframes.

הדרך המהירה

  1. סמנו את השכבה.
  2. פתחו את התכונה שרוצים (P ל-Position, S ל-Scale, וכו').
  3. Alt + קליק על שעון העצר (stopwatch) ליד שם התכונה.
  4. נפתח Expression Editor בצד של הטיימליין — שדה טקסט שבו כותבים את הקוד.
Expression Editor — הפתיחה ◆ ILLUSTRATED
Layer · Property · Value · Keys · Expression ▾ Shape Layer 1 ▾ Position [ 960.0, 540.0 ] = (expression active) 📎 // ב-Expression Editor — כותבים JavaScript wiggle( 3 , 20 ); ↑ שורה אחת בלבד. יוצרת אנימציה של רעידה אינסופית. מפעילים את Expression בלחיצה על Alt + שעון עצר של התכונה

איך יודעים ש-Expression פעיל

Expression גובר על Keyframes

אם לתכונה יש גם Keyframes וגם Expression — ה-Expression גובר. ה-Keyframes עדיין קיימים אבל לא משפיעים על הערך. לחזור ל-keyframes: Alt+קליק על שעון העצר פעם נוספת — ה-Expression מושבת.

פרק 03 · 5 הביטויים שחייבים לדעת

הארסנל המינימלי

5 פונקציות שמכסות 80% מה-expressions שמשתמשים בהם בעבודה אמיתית. לומדים אותן — ופתאום אפטר שונה.

1. wiggle(frequency, amount)

יוצר תנועה אקראית. frequency = כמה פעמים בשנייה (Hz). amount = עד כמה רחוק מהערך המקורי.

// רעידה עדינה
wiggle(2, 10);

// רעידה חזקה של מצלמה
wiggle(8, 50);

מניחים על Position של שכבה — השכבה מתחילה לרעוד. על Rotation — רעידה של סיבוב. על Scale — רעידה של גודל.

2. time

משתנה מובנה שמחזיר את הזמן הנוכחי בשניות. מתחיל ב-0 ועולה לאורך הקומפוזיציה.

// סיבוב מתמיד — 360° בשנייה
time * 360;

// זז ימינה בקצב קבוע
[time * 100, 540];

מצוין לתנועות קבועות בקצב — סיבוב אינסופי, קרוסלה, נהר גולש.

3. loopOut()

מאפשר לזוג keyframes לחזור על עצמם אינסוף. מאוד שימושי לאנימציות רצות.

// אם יש 2 keyframes, הם חוזרים על עצמם בלופ
loopOut("cycle");

// "pingpong" = הולך קדימה ואז אחורה
loopOut("pingpong");

יצרו 2 keyframes (למשל Y = 540 בזמן 0, Y = 440 בזמן 1), הוסיפו את ה-expression — הריצה תמשיך ללא סוף.

4. linear(t, tMin, tMax, value1, value2)

ממפה ערך מטווח לטווח. שימושי לקישורים מותאמים בין תכונות.

// Opacity יורד מ-100 ל-0 כשה-Position X עובר מ-0 ל-1000
var x = transform.position[0];
linear(x, 0, 1000, 100, 0);

חושב על זה כ"תרגום טווחים": כשהשכבה נעה שמאלה, ה-opacity יורד אוטומטית. בלי keyframes.

5. index

המספר של השכבה בטיימליין (1, 2, 3, ...). מאוד שימושי כשרוצים delay אוטומטי בין שכבות זהות.

// כל שכבה מתחילה עם delay של 0.1 שנייה לפי המיקום
var delay = (index - 1) * 0.1;
valueAtTime(time - delay);

משכפלים שכבה 10 פעמים, כל אחת מקבלת delay אוטומטית — ריכוך אנימציה שנראית מקצועית.

הכלל הזהב

אל תזכרו את התחביר המדויק. תזכרו רק שהפונקציות האלה קיימות. כשצריכים אותן — Ctrl+F (חיפוש בגוגל: "wiggle expression after effects") מביא את התחביר המדויק. הידע החשוב הוא לדעת שהכלי קיים, לא לשנן תחביר.

פרק 04 · קישור בין תכונות

Pick Whip של Expressions — החיבור הקסום

אחד השימושים העוצמתיים ביותר של Expression הוא לחבר תכונה של שכבה אחת לתכונה של שכבה אחרת.

דוגמה: אתם רוצים ש-Opacity של שכבה ב' תהיה תמיד חצי מה-Opacity של שכבה א'. בלי Expression — תצטרכו להנפיש את שתיהן. עם Expression — קישור אחד, וכל שינוי בשכבה א' משפיע אוטומטית על ב'.

איך עושים

  1. פתחו את התכונה של שכבה ב' (זו שרוצים לקשר).
  2. Alt+קליק על שעון העצר — פותח Expression Editor.
  3. ליד ה-Editor יש סליל (pick whip — בדיוק כמו Parenting).
  4. גררו את הסליל אל תכונה של שכבה אחרת.
  5. אפטר יוצר אוטומטית את הקוד שמחבר ביניהן.
// גרירה מ-Opacity של שכבה ב' ל-Opacity של שכבה א'
thisComp.layer("Layer A").transform.opacity;

עכשיו שכבה ב' תמיד יש לה את אותו Opacity כמו A. רוצים חצי? מוסיפים פעולה מתמטית:

thisComp.layer("Layer A").transform.opacity * 0.5;
שימושים קלאסיים
  • Shadow layer — צל שמעתיק תנועה של האובייקט.
  • UI controls — Null עם סליידר ששולט על כל השכבות.
  • Echo trail — 5 שכבות שעוקבות אחת אחרי השנייה עם delay.
  • Chained rotation — צלעות שמסתובבות כשהאובייקט הראשי מסתובב.
פרק 05 · Math

מתמטיקה — sin, cos ואוסילציה

שתי פונקציות מתמטיות שיוצרות תנועה הרמונית — שמרגישה הרבה יותר טבעית מ-wiggle אקראי.

Math.sin(x)

פונקציית sine — מחזירה ערך שנע בין -1 ל-1 בצורה חלקה ותקופתית. שילוב עם time יוצר אוסילציה.

// צף למעלה ולמטה — אוסילציה של 50px ב-1Hz
var y = 540 + Math.sin(time * 2 * Math.PI) * 50;
[960, y];

פירוש: time * 2 * PI = תדר של שני "גלים" בשנייה. sin(...) = ערך בין -1 ל-1. כפל ב-50 = תנועה של ±50px. מוסיף ל-Y הבסיסי (540).

Math.cos(x)

זהה ל-sin — אבל מתחיל מ-1 (במקום 0). שימושי לתנועה מעגלית.

// תנועה מעגלית — מקיף את המרכז ב-rádio 100px
var cx = 960, cy = 540;
var x = cx + Math.cos(time) * 100;
var y = cy + Math.sin(time) * 100;
[x, y];
למה זה חזק

Math.sin וMath.cos הן הבסיס של כל תנועה הרמונית — לב פועם, נשימה, גלי מים, מטוטלת. ברגע שתבינו את הדפוס הזה, תוכלו לבנות תנועות מורכבות שבלתי אפשריות ליצור ידנית. לא "יותר טוב מ-wiggle" — פשוט שונה מהותית. Wiggle אקראי, sin/cos צפוי.

פרק 06 · דיבאג

מה לעשות כש-Expression נשבר

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

כשיש שגיאה

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

ללחוץ על המשולש → פותח תיבת דיאלוג עם ההסבר של השגיאה. בדרך כלל ההודעה ספציפית — "Error at line 2: Undefined variable".

4 השגיאות הנפוצות

שגיאהסיבהתיקון
undefined התייחסות לתכונה שלא קיימת לבדוק שם השכבה, לוודא שכבה קיימת בקומפוזיציה
Error at line X תחביר שגוי (סוגר שחסר, פסיק שלא במקום) לבדוק סוגריים, נקודה-פסיק בסוף שורות
Cannot convert ערך לא תואם לסוג התכונה Position צריך מערך [x, y]. Scale צריך מערך [sx, sy]. Opacity - מספר יחיד
התוצאה שגויה הקוד רץ — אבל הערכים לא הגיוניים לבדוק ערכים של משתנים עם alert(var)
הטעות הכי נפוצה

שכחה של מספר הסוג הנכון — Position הוא [x, y] (שני מספרים), לא מספר אחד. אם תחזירו רק time * 100 — תקבלו שגיאה. צריך [time * 100, 540].

פרק 07 · התרגיל

כדור קופץ עם 3 Expressions

אפקט קלאסי שממחיש את הכוח של Expressions. בלי keyframes — רק קוד.

THE EXERCISE · BOUNCING BALL
01
הכנה
Comp 1920×1080. Shape Layer — עיגול בצבע כתום, 100px רדיוס, במרכז.
02
תנועה אופקית קבועה
Alt+קליק על שעון עצר של Position. כתבו: [time * 200, 540]; — העיגול מתחיל לזוז ימינה בקצב קבוע.
03
קפיצה אנכית
משנים את ה-expression ל: [time * 200, 540 + Math.abs(Math.sin(time * 3)) * -200]; — העיגול קופץ מעלה-מטה (abs מבטיח שרק מעלה, לא מתחת ל-540).
04
סיבוב לפי Position
Alt+קליק על Rotation. גררו pick whip אל Position של אותה שכבה. התוצאה: transform.position[0]; — הסיבוב מתרחב יחד עם התנועה האופקית.
05
Wiggle עדין
Alt+קליק על Scale. כתבו: wiggle(5, 5); — העיגול "פועם" בקצב של 5Hz ב-±5% (מרגיש חי).
06
Motion Blur
הפעילו Motion Blur על השכבה. כל התנועה עכשיו עם blur אוטומטי — נראית מקצועית.
07
תוצאה
RAM Preview. עיגול קופץ מצד לצד, מסתובב לפי התנועה, פועם בגודל, עם בלור. ללא keyframes בכלל. 3 expressions.
הקסם

נסו לשנות את Comp Duration ל-30 שניות. הכדור ימשיך לקפוץ עד הסוף — בלי שתצטרכו להוסיף keyframes. זה הכוח של Expressions: אנימציה "חיה" שעובדת לנצח.

סיכום

מה עכשיו יודעים

Expressions הם קוד JavaScript שמחליף keyframes. חמשת הביטויים החיוניים — wiggle, time, loopOut, linear, index — מכסים 80% מהצרכים. שילוב עם Math.sin/cos פותח עולם של תנועה הרמונית. Pick whip של Expressions מחבר בין תכונות. הכלים האלה הופכים עבודה של שעה לשורה אחת של קוד.

מכאן — שני כיוונים להעמיק. להעמיק ב-Expressions עם פונקציות מתקדמות יותר (valueAtTime, seedRandom, bezierPath) — זה הכיוון של מומחי motion graphics. או לעבור ל-ExtendScript — כתיבת סקריפטים שרצים על הפרויקט (לא בתוך תכונה) — זה הכיוון של אוטומציה מלאה. שני המסלולים מתחברים ב-מדריך 06 — סקריפטים באפטר אפקט.

הצעד הבא — מסקריפט ל-SaaS

אם כבר נהנים מ-Expressions, הצעד הבא הוא לבנות סקריפט משלכם. הסקריפט שלנו Text Layer Manager החל בדיוק ככה — פיסת JavaScript שחסכה 20 דקות של עבודה בכל סשן. היום זה מוצר ב-$29 שמוכר את עצמו. המדריך המלא לבניית סקריפטים עצמאיים מחכה ב-מדריך 06.