» נושאי לימוד
» נושאי לימוד
יום שבת 23 באוגוסט 2014
אנימציות
דף ראשי  בניית אתרים  HTML בסיסי  אנימציות גרסה להדפסה

אנימציות                                        

 

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

 

 

מספר דוגמאות של אנימציות GIF

 

 

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

 

 

                              

 

 

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

 

 

דוגמא : בניית אנימציית GIF

 

 

עכשיו נראה כיצד ניתן לבנות אנימצית GIF על ידי הרכבת 4 תמונות ראשונות של האנימציה שלמעלה. נשתמש בתוכנה שידועה בשם Animagic (שהיא מסוג shareware – ניתנת להורדה חינם). בשיעור זה, נניח שאתה כבר יודע כיצד ליצור את התמונות שירכיבו את האנימציה. בדרך אופיינית התמונות שישמשו לאנימציה יילקחו ממקום אחר או יבנו על ידי שימוש בצייר וישמרו בפורמט ש Animagic יוכל לזהות (GIF, BMP, PCX).

 

ניתן להוריד את Animagic כאן (הקובץ שתוריד נמצא בפורמט ZIP  ולפני שתשתמש בו בצע בו “unzip”. כמובן שתצטרך WinZip לצורך העניין). אח"כ פתח את קובץ התוכנה שיראה בערך כך:

 

 

 

 

 

 

איסוף תמונות

 

 

הצעד הראשון הוא כאמור איסוף התמונות. לפניך 4 תמונות שישמשו אותנו לצורך הדוגמא (אתה יכול לשמור אותם כקבצי GIF ולהשתמש בהם):

 

 

                                

 

                                 

 

 

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

 

תוכל לראות שיש רשימה של קבצים שמרכיבים את האנימציה שנראית כך:

 

                                

 

לאחר שתוסיף את כל הקבצים שלך בין אם ישירות לרקע התוכנה (ובין אם  ע"י "File" -> "Open” -> הגעה לספריה בה שמרת קבצי GIF -> ולחיצה על פי סדר על קבצי האנימציה -> לחיצת "Open). יופיעו ברשימה כל הקבצים שבחרת לשתף באנימציה.

 

עכשיו בחר באופציה"animation” -> “Frame rate” בכדי לקבוע את מהירות האנימציה.

זה אמור להיראות כך:

 

                            

 

 

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

 

כעת ניתן לראות את האנימציה ע"י לחיצה על Play ועצירה ע"י Stop. בכדי לשנות את מהירות האנימציה השתמש שוב בפעולה מהפסקה הקודמת.

 

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

 

                                                        

 

 

שינוי סדר הופעת התמונות

 

 

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

 

 

קביעת תצורת האנימציה

 

 

לפני שתיצור אנימציה, נקבע מגוון של אופציות שיקבעו איך האנימציה תרוץ. אופציות אלו ניתן למצוא בתפריט ב "Options" וניתן לשנות פה אופציות רבות (תוכל ללמוד על ידי קובץ ההדרכה באתר בו הורדת את התוכנה). במקרה זה נשאיר את כל ההגדרות הקבועות.

 

 

שמירת האנימציה כקישור

 

 

כשסיימת ואתה מרוצה מהאנימציה שיצרת שמור אותה ע"י "File" -> "Save as" ותן לקובץ שם  "amtest.gif". עכשיו נציג את סרט האנימציה בדפדפן הרשת.

 

פתח את קוד דף הבית שיצרת בפרק 1 והשתמש בעכבר על מנת להעתיק את הטקסט הבא לתוך מקום נוח בקובץ דף הבית.

 

 

<h2> Animated GIF Examples </h2>
<center>
<a href="amtest.gif">Example 1</a>
<p>
</center>

 

 

שמור את השינויים ופתח את דף הבית על ידי דפדפן ותראה קישור לאנימציה שלך שצריך להיות דומה לאנימציה הימנית מראש העמוד.

 

 

יצירת אנימציה משלך

 

 

הדוגמה הקודמת מראה לך איך ליצור אנימצית GIF משלך. עכשיו שרכשת מיומנות בסיסית ליצור אנימציה משלך וגם איך ליצור לה קישור. אז למה אתה מחכה?!?

 

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

 

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

 

 

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

 

 

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

 

 14-01-04 / 11:19  עודכן ,  02-11-03 / 15:17  נוצר ע"י עזרא גנוט  בתאריך 
  רקע מרוצף - הקודםהבא - לכידת מסך 
תגובות הקוראים    תגובות  -  1
דרכונט
מהי מערכת הדרכונט?
אינך מחובר, להתחברות:
דוא"ל
ססמא
נושאי לימוד
חיפוש  |  לא פועל
משלנו  |  לא פועל
גולשים מקוונים: 1