?רפסה ללוכ המ - Pixelmaster€¦ · Storyboard-ה תא עצבל ץלמומ !בל ......

22
מה כולל הספר? חשוב לדעת: תרגילים עם הנחיה. את קובצי התרגול ניתן להוריד בלינק הבא:30- הספר מכיל כhttps://drive.google.com/drive/folders/0Bx1XBd3-fSEoVk5ObUFqWUtPcFE?usp=sharing יצירתם, סידור, ארגון, עריכה וכדומה- עבודה עם אובייקטים עבודה עם צבעים שילוב מלל עבודה עם שכבות ייבוא ושילוב תמונות וקבצים וקטורים עבודה עם חלון יצירת האנימציה מושגי יסוד באנימציה יצירת אנימציה קלאסית יצירת אנימציה עם מעבר תנועה מסוג צורה יצירת אנימציה עם מעבר תנועה מסוג תנועה עבודה עם מסכות Movie Clip - עבודה עם סימבולים: סימבול גרפי ו הוספת פילטרים ושיטות שילוב יצירת כפתורים ושילובם בסרטון הוספת קוד תיכנותי עבור פעולות אינטראקטיביות שילוב סאונד באנימציה ובכפתורים שילוב קובצי וידאו שילוב עם תוכנות פוטושופ, אילוסטרייטור ומיוז טיפים ליצוא משקל הקובץ באופן יעיל ייצוא הסרטון בפורמטים שונים

Transcript of ?רפסה ללוכ המ - Pixelmaster€¦ · Storyboard-ה תא עצבל ץלמומ !בל ......

Page 1: ?רפסה ללוכ המ - Pixelmaster€¦ · Storyboard-ה תא עצבל ץלמומ !בל ... ,Timeline ןולח תיתחתב תמקוממה Edit Multiple Frames:הדוקפה ...

מה כולל הספר?

חשוב לדעת: הספר מכיל כ-30 תרגילים עם הנחיה. את קובצי התרגול ניתן להוריד בלינק הבא:

https://drive.google.com/drive/folders/0Bx1XBd3-fSEoVk5ObUFqWUtPcFE?usp=sharing

עבודה עם אובייקטים - יצירתם, סידור, ארגון, עריכה וכדומה

עבודה עם צבעים

שילוב מלל

עבודה עם שכבות

ייבוא ושילוב תמונות וקבצים וקטורים

עבודה עם חלון יצירת האנימציה

מושגי יסוד באנימציה

יצירת אנימציה קלאסית

יצירת אנימציה עם מעבר תנועה מסוג צורה

יצירת אנימציה עם מעבר תנועה מסוג תנועה

עבודה עם מסכות

Movie Clip -עבודה עם סימבולים: סימבול גרפי ו

הוספת פילטרים ושיטות שילוב

יצירת כפתורים ושילובם בסרטון

הוספת קוד תיכנותי עבור פעולות אינטראקטיביות

שילוב סאונד באנימציה ובכפתורים

שילוב קובצי וידאו

שילוב עם תוכנות פוטושופ, אילוסטרייטור ומיוז

טיפים ליצוא משקל הקובץ באופן יעיל

ייצוא הסרטון בפורמטים שונים

Page 2: ?רפסה ללוכ המ - Pixelmaster€¦ · Storyboard-ה תא עצבל ץלמומ !בל ... ,Timeline ןולח תיתחתב תמקוממה Edit Multiple Frames:הדוקפה ...

נושאי לימוד:

1 ................... פרק 1 - מושגים בעולם האינטרנט והגרפיקה

פורמטים לשמירת קבצים......................................................................................3

מסך הפתיחה.............................................................................................................7

8............................................................................................................ מבנה התוכנה

מעבר בין קבצים פתוחים.......................................................................................9

פקודות בסיסיות...................................................................................................... 10

יצירת קובץ חדש..................................................................................................... 11

פתיחת קובץ קיים/שמירת הקובץ.................................................................... 13

14 .............................................................................................. הגדרות תצוגת מסך

הגדלה והקטנה תצוגת הבמה............................................................................ 15

תצוגת האובייקטים בבמה.................................................................................... 17

תצוגת סרגלים......................................................................................................... 18

תצוגת רשת עבודה................................................................................................ 19

20 ........................................................................................................ תצוגת קווי עזר

מאפייני הבמה.......................................................................................................... 21

פרק 2 - יצירת אובייקטים גרפים........................................... 26

כלי הצורות הבסיסיות........................................................................................... 27

יצירת צורות באמצעות הכלים ה״פרימיטיביים״............................................ 29

כלי המברשת........................................................................................................... 31

כלי המחק.................................................................................................................. 35

כלי הברז.................................................................................................................... 37

עבודה עם כלי בחירה............................................................................................ 38

מצב Shape עבור אובייקט................................................................................. 40

42 .....................................................................................Object Drawing מצב

44 ........................................................................................................... Group מצב

כלי הלאסו................................................................................................................. 45

46 ...................................................................................................... המרת קו לצורה

47 ............................................................................................ הרחבת/צמצום צורה

ריכוך קצוות צורה.................................................................................................... 48

Page 3: ?רפסה ללוכ המ - Pixelmaster€¦ · Storyboard-ה תא עצבל ץלמומ !בל ... ,Timeline ןולח תיתחתב תמקוממה Edit Multiple Frames:הדוקפה ...

שילוב צורות.............................................................................................................. 49

עבודה עם מסלולים............................................................................................... 50

כלי הקו....................................................................................................................... 51

כלי העיפרון............................................................................................................... 52

כלי הציפורן............................................................................................................... 53

54 ............................................................. כלים שימושיים בעבודה עם מסלולים

55 .......................................................................................................... כלי החץ הלבן

תכונות הקו................................................................................................................ 56

כלי המכחול.............................................................................................................. 58

עבודה עם מברשות................................................................................................ 59

שינוי סדר אובייקטים.............................................................................................. 60

יישור אובייקטים....................................................................................................... 62

68 ..........................................................Free Transform Tool - כלי השינוי

פרק 3 - צבעים............................................................................. 73

הוספת מילוי וקו עבור אובייקט........................................................................... 74

כלי הדלי..................................................................................................................... 75

כלי קסת הדיו........................................................................................................... 76

כלי הדוגם.................................................................................................................. 77

78 ...............................................................................................................Color חלון

הגדרת מילוי אחיד.................................................................................................. 79

80 .....................................................................Gradient - יצירת מעבר צבעים

עבודה עם כלי הדלי ומעבר צבעים................................................................... 82

83 ..................................................................................... עריכת מעבר צבעים ישר

עריכת מעבר צבעים עגול.................................................................................... 85

88 ..............................................................................Bitmap - מילוי עשוי תמונה

90 ....................................................................................................Swatches חלון

פרק 4 - מלל.................................................................................. 95

יצירת תיבת מלל..................................................................................................... 96

סוגי תיבות המלל.................................................................................................... 97

98 ............................................................................... שינוי גודלה של תיבת המלל

99 ............................................................................................. עריכת תכונות המלל

בחירת פונט לאינטרנט......................................................................................... 100

Page 4: ?רפסה ללוכ המ - Pixelmaster€¦ · Storyboard-ה תא עצבל ץלמומ !בל ... ,Timeline ןולח תיתחתב תמקוממה Edit Multiple Frames:הדוקפה ...

שימוש בפונטים מיוחדים..................................................................................... 102

המרת מלל לצורה................................................................................................. 103

כתיבה בעברית....................................................................................................... 104

פרק 5 - ייבוא קבצים............................................................... 105

עבודה עם תמונות בסרטון.................................................................................. 108

המרת תמונה לאיור וקטורי................................................................................. 110

111 .......................................................................Break Apart שימוש בפקודה

עריכת מאפייני התמונה....................................................................................... 112

113 .....................................................................................................PSD יבוא קובצי

118 ................................................................................... ייבוא קובצי אילוסטרייטור

122 ........................................................................CC Libraries עבודה עם חלון

פרק 6 - עבודה עם שכבות.................................................... 126

128 .............................................................................................. יצירת שכבה חדשה

129 .............................................................................................. שינוי מאפייני שכבה

131 .................................................................... העברת אובייקט משכבה לשכבה

132 ................................................................................... הצגה/הסתרה של שכבה

נעילה/שחרור שכבה............................................................................................ 133

תצוגה מלאה או תצוגה קווית............................................................................. 134

חלון מאפייני השכבה............................................................................................ 135

תקיית שכבות.......................................................................................................... 136

פרק 7 - אנימציה....................................................................... 138

מושגי יסוד באנימציה............................................................................................ 139

144 ...................................................................................... יצירת אנימציה קלאסית

148 ......................................................................... יצירת אנימציה עם מעבר צורני

153 ............................................................. Classic Tween יצירת מעבר מסוג

158 .............................. Classic Tween תרגיל סוס נדנדה עם מעבר מסוג

162 ........................................................................................................Copy Frame162 .......................................................................................................Paste Frame

Page 5: ?רפסה ללוכ המ - Pixelmaster€¦ · Storyboard-ה תא עצבל ץלמומ !בל ... ,Timeline ןולח תיתחתב תמקוממה Edit Multiple Frames:הדוקפה ...

162 ...............................................................................................Revevrse Frameיצירת אנימציה עם שכבות.................................................................................. 167

175 .......................Classic Tween עריכת אנימציה עם מעבר ביניים מסוג

179 ...................................Onion Skin בחינת האנימציה באמצעות הפקודה

עריכת מספר Keyframes במקביל............................................................. 181

184 .............................Classic Tween שינוי קצב האנימציה עם - Easing

187 ............................. פרק 8 - שכבת מסלול תנועה קלאסית

דברים שחשוב לדעת בעבודה עם שכבת מסלול תנועה קלאסית........ 199

שינוי צבעו של האובייקט המוצמד בהתאם לצבעו של המסלול............. 200

פרק 9 - יצירת מסיכה.............................................................. 206

יצירת טקסט מבריק בעזרת מסיכה................................................................ 212

218 ...............................Motion פרק 10 - מעבר ביניים מסוג

219 .........................................Motion יצירת אנימציה עם מעבר ביניים מסוג

יצירת אנימציה עם מעבר ביניים מסוג Motion עם סיבוב..................... 226

231 ......................................... Motion פיצול אנימציה עם מעבר ביניים מסוג

העתקה וצירוף של מעבר תנועה...................................................................... 237

243 ........................................................ Motion מעבר ביניים מסוג - Easing251 ..............................Motion Presets - שימוש בתבניות תנועה מוכנות

253 ....................................... Motion עריכת אנימציה עם מעבר ביניים מסוג

פרק 11 - סימבולים.................................................................. 263

264 ....................................................................... Symbols יתרונות בעבודה עם

עריכת סימבולים.................................................................................................... 265

עבודה מסודרת עם סימבולים.......................................................................... 266

269 .................................. Animate ייבוא קובץ ספריות מקבצים אחרים של

270 .................................................................................Graphic Symbol יצירת

יצירת Graphic Symbol - תרגיל פקמן.................................................. 273

Page 6: ?רפסה ללוכ המ - Pixelmaster€¦ · Storyboard-ה תא עצבל ץלמומ !בל ... ,Timeline ןולח תיתחתב תמקוממה Edit Multiple Frames:הדוקפה ...

מאפייני הסימבול הגרפי .....................................................................................280

282.............................................................................Movie Clip - סימבול מסוג

287................................................ יצירת Movie Clip - תרגיל ביקור החייזר

296.................................................................................. Movie Clip -מאפייני ה

298................................................................... Movie Clip-הוספת פילטרים ל

תרגיל - שילוב פילטר באנימציה.......................................................................300

304................................................................................... החלפת מופע של סימבול

פרק 12 - כלי המצלמה............................................................ 308

עבודה עם כלי המצלמה......................................................................................309

311..................................................................... יצירת אנימציה עם כלי המצלמה

פרק 13 - הוספת אינטראקטיביות....................................... 316

317............................................................................ יצירת Symbol מסוג כפתור

318...............................................................................Hit - הגדרת שטח הכפתור

יצירת כפתור נסתר................................................................................................321

Movie Clip בתוך כפתור.................................................................................322327........................................................................................... שילוב תיכנות בסרטון

תרגיל הוספת תכנות בבאנר .............................................................................331

תרגיל - הצמדת קישור חיצוני לכפתור...........................................................337

340......................................................................Actions הוספת קוד מוכן בחלון

עקרונות בעבודה עם פעולות תכנותיות..........................................................345

346 .............................................. פרק 14 - הוספת קול לסרטון

תרגיל - שילוב קול בסרטון..................................................................................348

עדכון קובץ קול בספרייה.....................................................................................351

352.......................................................................... דחיסת משקלו של קובץ הקול

סינכרון ניגון הקול לניגון הסרטון........................................................................353

אפקטים על קול......................................................................................................354

תרגיל - יצירת כפתור המשמיע קול.................................................................355

359 ................................................... פרק 15 - ייבוא קובצי וידאו

360...........................................ActionScript ייבוא קובץ וידאו לסרטון מסוג

Page 7: ?רפסה ללוכ המ - Pixelmaster€¦ · Storyboard-ה תא עצבל ץלמומ !בל ... ,Timeline ןולח תיתחתב תמקוממה Edit Multiple Frames:הדוקפה ...

תרגיל - שילוב קובץ וידאו בסרטון....................................................................361

367......................................HTML5 תרגיל - שילוב קובץ וידאו בסרטון מסוג

371 ........................................................... פרק 16 - ייצוא הסרטון

ייצוא הסרטון בפורמט תמונה.............................................................................377

380...................................................Image Sequence ייצוא הסרטון במבנה

ייצוא סרטון במבנה וידאו......................................................................................382

383...................................................... Animated GIF - ייצוא הסרטון במבנה

385......................................................................... קביעת הגדרות פרסום הסרטון

386..................................... HTML5 קביעת הגדרות פרסום הסרטון בפורמט

392.................................................................Flash Movie ייצוא סרטון במבנה

כיצד לעבוד בצורה נכונה על מנת לקבל סרטון קל משקל......................394

Page 8: ?רפסה ללוכ המ - Pixelmaster€¦ · Storyboard-ה תא עצבל ץלמומ !בל ... ,Timeline ןולח תיתחתב תמקוממה Edit Multiple Frames:הדוקפה ...

שימו לב! מומלץ לבצע את ה- Storyboard בתוכנת אילוסטרייטור תוך כדי הקפדה על עבודה עם שכבות

Animate cc מושגי יסוד באנימציה

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

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

Storyboard כאשר ניגשים ליצור סרטון אנימציה, השלב הראשוני הוא לתאר באמצעות את התסריט.

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

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

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

139

Page 9: ?רפסה ללוכ המ - Pixelmaster€¦ · Storyboard-ה תא עצבל ץלמומ !בל ... ,Timeline ןולח תיתחתב תמקוממה Edit Multiple Frames:הדוקפה ...

שלב 1:

ממקמים את הסוס על הבמה

ActionScript 3 פותחים קובץ חדש מסוג באמצעות תפריט File > New ומאשרים את החלון הפתיחה.

כעת לפנינו במה לבנה, ניגשים לפקודה: File הממוקמת בתפריט Import to Stage < Import

ומייבאים את הקובץ: Rockinghorse.ai. ממקמים את הסוס במרכז הבמה.

שלב 2:

הופכים את הסוס לסימבול

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

הרצוי. מסמנים את הסוס וניגשים לפקודה: .Modify הממוקמת בתפריט Convert to Symbol

באמצעות החלון שנפתח מגדירים שאנו מעוניינים בסימבול rocking horse :נותנים את השם לסימבול Movie Clip מסוג

ומאשרים את החלון.

Animate cc Classic Tween תרגיל סוס נדנדה עם מעבר מסוג

:4 תרגיל

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

158

Page 10: ?רפסה ללוכ המ - Pixelmaster€¦ · Storyboard-ה תא עצבל ץלמומ !בל ... ,Timeline ןולח תיתחתב תמקוממה Edit Multiple Frames:הדוקפה ...

הערות אישיות:

שלב 8:

צפיה בסרטון

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

F5 מסמנים את פריים מספר 80 ובאמצעות מקש מקלדתמוסיפים עוד פריימים פעילים לסרטון.

על מנת לצפות בסרטון ניתן לעשות שימוש בקיצור מקלדת:

על מנת להמחיש שיש תנועה מוצגת בדוגמה

התנועה באמצעות שיכפול האותיות מקטן לגדול תוך

כדי תזוזה.

Animate cc תרגיל אנימציה עם שכבות

Control

CommandEnter+או

174

Page 11: ?רפסה ללוכ המ - Pixelmaster€¦ · Storyboard-ה תא עצבל ץלמומ !בל ... ,Timeline ןולח תיתחתב תמקוממה Edit Multiple Frames:הדוקפה ...

Timeline1 5 10 15 20 25 30 35 40 45 50 55 60 65 70 80 85

1 0.024.00 s

Timeline1 5 10 15 20 25 30 35 40 45 50 55 60 65 70 80 85

1 0.024.00 s

הערות אישיות:

Animate cc עריכת מספר Keyframes במקביל

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

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

הפעלת הפקודה: Edit Multiple Frames הממוקמת בתחתית חלון Timeline, מאפשרת לערוך את כל האובייקטים המשתתפים באנימציה ולראות את התוצאה באופן מיידי.

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

181

Page 12: ?רפסה ללוכ המ - Pixelmaster€¦ · Storyboard-ה תא עצבל ץלמומ !בל ... ,Timeline ןולח תיתחתב תמקוממה Edit Multiple Frames:הדוקפה ...

שלב 1:

ממקמים את הרכב בבמה

פותחים מתוך תיקיית התרגילים את הקובץ Classic Motion Guide.fla, ניגשים לחלון Library וגוררים מתוכה את הסימבול בשם: redcar animation וממקמים אותו באזור

הימני התחתון של הבמה.

שלב 2:

יוצרים שכבת מסלול תנועה קלאסית

.car-ניגשים לחלון השכבות, משנים את שם השכבה ל

מקליקים קליק ימני ובאמצעות התפריט בוחרים בפקודה: Add Classic Motion Guide כעת נוספה שכבת מסלול תנועה קלאסית.

שימו לב! ברגע שנוצרה שכבת מסלול התנועה הקלאסית השכבה � car שמתחתיה כפופה לה. לכן ניתן לראות בדוגמה שלפנינו ששכבת

זזה מעט ימינה בתצוגה. Timeline

1 5 10 15 20 25 30 35 40 45 50 55 60 65 70 75 80 85 90 95

Guide: car

car

1 0.024.00 s

Animate cc תרגיל ביצירת אנימציה עם שכבת מסלול תנועה קלאסית

תרגיל 7 - יצירת אנימציה עם שכבת מסלול תנועה קלאסית:

באמצעות תרגיל זה נלמד כיצד ליצור אנימציה עם שכבת מסלול תנועה. תרגיל זה מכיל 6 שלבים:

188

Page 13: ?רפסה ללוכ המ - Pixelmaster€¦ · Storyboard-ה תא עצבל ץלמומ !בל ... ,Timeline ןולח תיתחתב תמקוממה Edit Multiple Frames:הדוקפה ...

Timeline

1 5 10 15 20 25 30 35 40 45 50 55 60 65 70 75 80 85 90 95

Guide: car

green car

red car

מסלול גלוי

1 0.024.00 s

שלב 2:

יוצרים את האנימציה על גבי המסלול

ניגשים לכלי Free Tranform בחלון כלי העבודה וממקמים את נקודת הציר במרכז בחלקו התחתון של הרכב כפי שמופיע בדוגמה:

מיקום נקודת הציר

מסמנים את ה-Keyframe הראשון בשכבת הרכב הירוק, ממקמים את הרכב בקצה השמאלי של המסלול ומוודאים שנקודת הציר היא זו המוצמדת למסלול.

Animate cc הצמדת מספר שכבות למסלול בשכבת מסלול קלאסית

195

Page 14: ?רפסה ללוכ המ - Pixelmaster€¦ · Storyboard-ה תא עצבל ץלמומ !בל ... ,Timeline ןולח תיתחתב תמקוממה Edit Multiple Frames:הדוקפה ...

Timeline

1 5 10 15 20 25 30 35 40 45 50 55 60 65 70 75 80 85 90 95

Guide: car

car

1 0.024.00 s

שלב 4:

יוצרים את האנימציה על גבי המסלול

ניגשים לכלי Free Tranform בחלון כלי העבודה וממקמים את נקודת הציר במרכז בחלקו התחתון של הרכב כפי שמופיע בדוגמה:

מיקום נקודת הציר

מסמנים את ה-Keyframe הראשון בשכבת הרכב וממקמים את הרכב בקצה הימני של המסלול ומוודאים שנקודת הציר היא זו המוצמדת למסלול.

Animate cc שינוי צבעו של האובייקט המוצמד בהתאם לצבעו של המסלול

202

Page 15: ?רפסה ללוכ המ - Pixelmaster€¦ · Storyboard-ה תא עצבל ץלמומ !בל ... ,Timeline ןולח תיתחתב תמקוממה Edit Multiple Frames:הדוקפה ...

שלב 1:

ממקמים תמונה על גבי הבמה

File > New באמצעות תפריט ActionScript 3 פותחים קובץ חדש מסוגומאשרים את החלון הפתיחה.

כעת לפנינו במה לבנה, ניגשים לפקודה:Import to Stage < Import הממוקמת בתפריט File ומייבאים את הקובץ:

Cowboys.jpeg. ממקמים את התמונה כך שתכסה את כל שטח הבמה Image ומעניקים לשכבה את השם

Timeline1 5 10 15 20 25 30 35 40 45 50 55 60 65 70 80 85

image

1 0.024.00 s

Animate cc תרגיל ביצירת שכבת מסיכה

תרגיל 10 - יצירת אנימציה עם שכבת מסיכה:

באמצעות תרגיל זה נלמד כיצד ליצור אנימציה עם שכבת מסיכה. תרגיל זה מכיל 5 שלבים:

207

Page 16: ?רפסה ללוכ המ - Pixelmaster€¦ · Storyboard-ה תא עצבל ץלמומ !בל ... ,Timeline ןולח תיתחתב תמקוממה Edit Multiple Frames:הדוקפה ...

Timeline1 5 10 15 20 25 30 35 40 45 50 55 60 65 70 80 85

Roket

1 0.024.00 s :2 שלב

יוצרים את האנימציה

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

F5 מוסיפים פריימים פעילים לסרטון בפריים מספר 60 בעזרת קיצור מקלדת Insert Frame :או באמצעות קליק ימני ובחירה בפקודה

מסמנים את אחד מהפריימים באופן חופשי בין 1 ל-60, מקליקים קליק ימני ובוחרים Create Motion Tween :בפקודה

מסמנים את פריים מספר 60 וגוררים את הטיל לחלק הימני העליון של הבמה.

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

Create Motion TweenCreate Shape TweenCreate ClassicTweenConvert to Frame-by-Frame Animation

Insert FrameRemove Frame

Insert KeyfreamInsert Blank KeyfreamClear KeyfreamConvert to KeyframesConvert to Blank Keyframes

Cut FramesCopy FramesPaste FramesPaste and Overwrite FramesClear FramesSelect All Frames

Copy MotionPaste MotionPaste Motion Special...

Reverse FramesSynchronize SymbolsSplit Audio

Actions

Animate cc Motion יצירת אנימציה עם מעבר ביניים מסוג

220

Page 17: ?רפסה ללוכ המ - Pixelmaster€¦ · Storyboard-ה תא עצבל ץלמומ !בל ... ,Timeline ןולח תיתחתב תמקוממה Edit Multiple Frames:הדוקפה ...

שלב 6:

הגדרת תנועה לפי מסלול

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

על מנת שהטיל ינוע על המסלול בצורה אותנטית מסמנים פריים אחד בין ה-Keyframes ומסמנים את האפשרות:

Properties בחלון Orient to path

Animate cc Motion יצירת אנימציה עם מעבר ביניים מסוג

224

Page 18: ?רפסה ללוכ המ - Pixelmaster€¦ · Storyboard-ה תא עצבל ץלמומ !בל ... ,Timeline ןולח תיתחתב תמקוממה Edit Multiple Frames:הדוקפה ...

הערות אישיות:

שלב 1:

על גבי הבמה Drop :ממקמים סימבול בשם

פותחים מתוך תיקיית התרגילים את הקובץ Drops.fla, יוצרים שכבה חדשה ומעניקים לה את השם Drop1. ניגשים לחלון Library וגוררים סימבול בשם:

Drop על גבי שכבה בשם: drop1 ממקמים ומקטינים אותו בצמוד לצינור המים כפי שניתן לראות בדוגמה.

Timeline

1 5 10 15 20 25 30 35 40 45 50 55 60 65 70 75 80 85 90 95

drop1

Pipeline

grass

1 0.024.00 s

בפתיחת הסרטון - הקובץ מכילשלוש שכבות.

Animate cc העתקה וצירוף של מעבר תנועה

תרגיל 15 - יצירת אנימציה תוך כדי שימוש בהעתקה וצירוף של מעבר תנועה

תרגיל זה מכיל 5 שלבים:

238

Page 19: ?רפסה ללוכ המ - Pixelmaster€¦ · Storyboard-ה תא עצבל ץלמומ !בל ... ,Timeline ןולח תיתחתב תמקוממה Edit Multiple Frames:הדוקפה ...

Timeline

1 5 10 15 20 25 30 35 40 45 50 55 60 65 70 75 80 85 90 95

man

Background

1 0.024.00 s

הערות אישיות:

שלב 2:

יוצרים את האנימציה

מוסיפים פריימים פעילים בשתי השכבות בפריים מספר 95 בעזרת קיצור מקלדת Insert Frame :או באמצעות קליק ימני ובחירה בפקודה F5

מסמנים את אחד מהפריימים באופן חופשי בין 1 ל-95 בשכבת man, מקליקים Create Motion Tween :קליק ימני ובוחרים בפקודה

מסמנים את פריים מספר 35 וגוררים את הדמות עד לתחילתו של השיפוע כפי שמופיע בדוגמה:

Create Motion TweenCreate Shape TweenCreate ClassicTweenConvert to Frame-by-Frame Animation

Insert FrameRemove Frame

Insert KeyfreamInsert Blank KeyfreamClear KeyfreamConvert to KeyframesConvert to Blank Keyframes

Cut FramesCopy FramesPaste FramesPaste and Overwrite FramesClear FramesSelect All Frames

Copy MotionPaste MotionPaste Motion Special...

Reverse FramesSynchronize SymbolsSplit Audio

Actions

Animate cc Motion יצירת אנימציה עם מעבר ביניים מסוג

259

Page 20: ?רפסה ללוכ המ - Pixelmaster€¦ · Storyboard-ה תא עצבל ץלמומ !בל ... ,Timeline ןולח תיתחתב תמקוממה Edit Multiple Frames:הדוקפה ...

הערות אישיות:

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

)רצוי שכאשר בוחרים בכלי העיפרון - בתחתית חלון כלי העבודה הוא יהיה במצב )Smooth

שימו לב! על מנת שהמשימה תצליח המסלול חייב להיות במצב Shape וכמו כן, �המסלול צריך להיות מושלם, ללא חיתוכים או לולאות מורכבות.

Timeline

1 5 10 15 20 25 30 35 40 45 50 55 60 65 70 75 80 85 90 95

Guide: חייזר

Background

חייזר

1 0.024.00 s

Animate cc יצירת Movie Clip - תרגיל ביקור החייזר

292

Page 21: ?רפסה ללוכ המ - Pixelmaster€¦ · Storyboard-ה תא עצבל ץלמומ !בל ... ,Timeline ןולח תיתחתב תמקוממה Edit Multiple Frames:הדוקפה ...

שלב 1:

מתחילים לשלב אנימציה

File > Open באמצעות תפריט Camera Tool Ex :פותחים קובץ בשם

ניגשים לשכבת Camera ומסמנים את ה-K/F הראשון בשכבה.

באמצעות כלי המצלמה הממוקם בחלון כלי העבודה, מבצעים תקריב של הסרטון עד לכדי 250% בעזרת

גרירת המכוון המופיע בתחתית הבמה או באמצעות המאפיין Zoom המופיע

בחלון Properties. לאחר יצירת התקריב מזיזים את הסרטון שמאלה

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

במורד ההר.

250%

Animate cc תרגיל - יצירת אנימציה עם כלי המצלמה

תרגיל 22 - יצירת אנימציה עם כלי המצלמה

תרגיל זה מכיל 5 שלבים:

311

Page 22: ?רפסה ללוכ המ - Pixelmaster€¦ · Storyboard-ה תא עצבל ץלמומ !בל ... ,Timeline ןולח תיתחתב תמקוממה Edit Multiple Frames:הדוקפה ...

הערות אישיות:

שלב 4:

צפיה בסרטון

על מנת לצפות בסרטון ניתן לעשות שימוש בקיצור מקלדת

Animate cc תרגיל - שילוב קול בסרטון

Control

CommandEnter+או

350