Flash 轉檔 Html5

3   Comments

flash轉html5
為了便利Flash設計的使用者, Adobe推出Wallaby這支小程式, 可以將Fla檔案發佈成Html格式;及附加檔案.
Google也有線上轉譯服務Swiffy可以利用.
可發佈成Html5的編寫工具目前還很貧瘠. 除了Sothink Swf Decompiler還算勉強編譯外, Adobe直接開發的Edge Preview目前已經修改到第六版, 是唯一直接使用Html/Javascript編寫"類似"Flash效果的工具.
等到Edge從免費版開發成專業版, 恐怕市場上沒有其他軟體開發公司可以與之相比. Apple為了省下Flash權利金犧牲了消費者(當然,觸碰螢幕的手勢規則矛盾也是原因之一), 卻意外的讓Adobe可能再次獨佔網頁設計工具.  如果他開發了特殊的語言標記而能讓Html5完全進化(技術專利), 到時候各家瀏覽器等著瞧吧...

好像有些離題...
在Flash Pro CS6的介面裡面可以直接加裝兩種html5編譯擴充功能.
請先下載檔案: Google Swiffy Extension   Toolkit for CreateJS

示範其中一種安裝方法
1. 從下載頁面下載外掛程式

下載Toolkit for CreateJS

2. 無論是Flash或Photoshop等軟體在加掛擴充時, 都是透過Adobe Extension Manager來安裝. 打開Adobe的程式集裡可見. 按安裝.

swf轉html

3. 從Flash CS6介面呼叫出一鍵轉譯功能的位置如圖:

Flash轉檔操作

4. 一鍵發佈. Swiffy跟Toolkit所發佈的資源不一樣, 各有利弊; 也不一定能完全掌握原始的flash效果.


假使你以為從此可以過著幸福快樂的轉譯生活, 那可就錯了!
目前Html5能做到Flash的效果還差得遠. 更別說轉出來的效果.
這些擴充功能僅能轉簡單的flash. 又例如IE雖然支援base64編碼顯示, 卻無法讀取部分html5的語意規則, 會變成空白頁面. 最後還是要回歸使用html/CSS3的搭配組合.

無庸浪費口水爭執Flash和Html5孰勝優劣, 讓大多數的網路客能夠看到你的網頁內容才是重要的.
所以上次我將部落格內可以轉換的Flash模組轉成Html後內嵌到Blogger, 本來很開心在iPad終於能顯示flash效果.
轉頭一看... 喵的咧!  IE根本不能顯示!! (除了IE 10. IE9部分失效)

讓我們來看看StatCounter六月份最新的瀏覽器市占率分析:
在5月21號全球調查, Chrome首次登上排名冠軍, 擊敗了長期支配網頁發展的IE.

browser stats


另一個瀏覽器市占調查品牌Market share結果卻有著相當大的差距.

2012-06 browser stats


此統計顯示IE目前仍然有五成以上的市占率.
就此兩個品牌的地區分析, 共同指出IE(不分版本)在台灣的市占率有六成.
well... 我還是繼續使用Flash好了, 至少它的市占率高達98%. 而且將flash轉為Html5網頁還有個問題:當作單一物件內嵌時, 背景不能透明的問題.
下一篇寫如何讓轉譯的網頁能夠透明的語法.  (也許會寫吧?)


Author Summary
Flash 轉檔 Html5
Subject : Flash 轉檔 Html5
Author : - Dream Talker Updated at: 8:06 AM
Votes : 100% - 5.0 - based on 2015
Flash檔案轉成html5網頁格式的外掛功能.
5 Stars - Reviews
留言提示 - Comment Tips
◆ 如果您有任何想法或意見,歡迎參與留言。
◆ Disqus匿名留言,信箱及個人資訊不會公開顯示。
◆ 請多使用社群帳號留言,可簡化流程並訂閱回復。
◆ 『私密留言』請使用Google+分享按鍵,留言須使用『@Mark X』在訊息中,以免遺漏通知。
◆ G+ 訊息中指名分享對象的參考文件: 『 說明
  • Disqus
  • Blogger
  • Facebook
Anonymous left your nick please
  1. 我沒有flash軟體,但有動畫檔案.透過線上轉檔和flash轉出來的一樣嗎? 我指檔案大小. Thank you!

    ReplyDelete
    Replies
    1. Hey! Derek,
      轉出來的HTML檔案一樣大小, 不過線上轉檔只能使用swf檔, 15分鐘內要下載.
      使用線上轉檔的方式, 不可直接修改HTML內容的runtime.js的版本, 如果要更新版本必須重新轉檔, 請注意.

      Delete
  2. I'm excited to see how Edge Preview continues to develop and potentially revolutionize web design.

    ReplyDelete