תגובות

איך להמיר קבצי פלאש לHTML 5 בעזרת Swiffy. מדריך

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

הבוקר (או יותר נכון "לפנות בוקר" – לשעה 07:31 אי אפשר עדיין לקרוא בוקר) נחשפתי לכלי מרשים במיוחד שנוצר במעבדות גוגל (Google Labs). לכלי קוראים Swiffy והיעוד שלו הוא המרת קבצי פלאש (מסוג swf.) לHTML 5. "וואו! מה?! איך?!", כן כן, Swiffy מאפשר ליוצרים להפוך את האנימציות שלהם לזמינות עבור דפדפנים מודרניים ללא תלות בנגן פלאש / פלאגין חיצוני.

איך זה עובד?

Swiffy לוקח את קובץ הSWF וממיר אותו בשני שלבים. בשלב הראשון, הקומפיילר של Swiffy מעבד את קובץ הפלאש וממיר אותו לאובייקט JSON בג'אווה סקריפט. בשלב השני סקריפט אחר טוען את האוביקט ומרנדר אותו תוך כדי שימוש בHTML 5, SVG וCSS 3.

מה עם איזה מדריך קטן?

יאללה. למה לא?

מצרכים:

  • 1 (או יותר) קובץ פלאש עם סיומת SWF.
  • 1 דפדפן תומך HTML 5 וCSS 3. כרום, פיירפוקס, ספארי או IE9+.

שלבי הכנה:

1. היכנסו לדף הבית של GoogleLabs וחפשו את Swiffy. או לחילופין היכנסו ישירות לקישור הזה.

2. חפשו את הכותרת "Upload a SWF file" ולחצו על Browse.

3. בשלב הזה רצוי שיהיה לכם כבר קובץ פלאש שהכנתם מראש. בחרו אותו ולחצו על Open.

4. אל תשכחו לסמן "וי" על הצהרת תנאי השימוש.

5. לחצו על Upload and convert.

6. זה הכל! אנימצית הHTML 5 שלכם מוכנה לשימוש והורדה. אם הכל עבר חלק תוכלו לראות תצוגה מקדימה של קובץ הפלאש המקורי ומתחתיו את תוצאת ההמרה של Swiffy.

7. במידה ותרצו להוריד את התוצאה כקובץ HTML תוכלו לעשות זאת ע"י לחיצה על המקש הימני בעכבר ואז "Save link as…" תלת הכותרת Swiffy output.

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

עדיין לא מושלם

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

יצא לכם לנסות את הכלי החדש של גוגל? שתפו אותנו בתוצאות!

קצת על דניאל שטרנליכט

דניאל שטרנליכט הוא מעצב ומפתח צד לקוח ואב לשני אייפונים מקוריים. חי ונושם ווב בעבודה ובבית, משתדל ללמוד כל יום משהו חדש עם גוגל כמורה, ו- Notepad++ כמחברת. בזמנו הפנוי תמצאו אותו מנהל את הבלוג לעיצוב גרפי וטכנולוגיה וחוקר טכנולוגיות ווב חדשות.

15 תגובות לפוסט "איך להמיר קבצי פלאש לHTML 5 בעזרת Swiffy. מדריך"

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

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

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

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

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

    בקיצור התחלה נחמדה אך לא שימושית במיוחד- יש למה לצפות!


    • ברוך ג'מילי

      מירב, אל תצפי. אם תקראי את כל הספרות של פלאש as2 תמצאי שזה יושב על 9600 עמודים – וזה רק מה שאני ראיתי. לא סביר שיש איזו שהיא חברה המסוגלת לטפל בכמות כזו של חומר, שלא לדבר על זה שיש גם את as3 ואני מניח שמדובר במסה דומה.

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


  • ברוך ג'מילי

    נראה לי שאתה קצת נמהר… נבדק. לא עובד.
    לא ממיר קוד
    והאמת היא שלא ציפיתי
    אבל בדקתי.

    חוץ מזה, מאיפה באה השינא ל………. סוג של טכנולוגיה???
    סך הכל – טכנולוגיה.

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

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

    (יש את גו-לייב שלא הצליחה, אבל לא הם התחילו את זה)

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

    אתה תסלח לי שאני ישאיר כאן שם בדוי. אין לי כוונה להפוך את הנושא לדיון.

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

    • אהלן ברוך,
      הזהרתי מראש, שזה מוצר בפיתוח ושהתמיכה בAS2 וAS3 היא חלקית.

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

      להשוות את אדובי לאפל? ימים יגידו.

  • גם אדובי בכיון של HTML 5 היא הוציא את EDGE
    http://labs.adobe.com/technologies/edge/

  • טוב לדעת! תודה!

  • ניסיתי, וכל עוד מדובר בגרפיקה פשוטה עם אפקטים של פלש 8 זה עובד, כולל כל הוראות האקשנסקריפט (2). זה טוב מאד למי שעושה עיצוב שמיועד גם לסמרטפונים ואייפדים…
    אבל נתקלתי בבעיה ללא פיתרון… אני לא מצליחה להמיר קובץ שמכיל סאונד. או ליתר דיוק – דרך הבראוזר שבמחשב שומעים את הסאונד בקובץ המומר, אבל דרך האייפד לא שומעים כלום.
    אולי מישהו מכיר את הסיבה לכך?? אני מחפשת פיתרון!

כתיבת תגובה

האימייל לא יוצג באתר. (*) שדות חובה מסומנים

*

תגי HTML מותרים: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>