Adobe Edge - 03 檔案 projectName.html 分析

1.區塊一：

2.區塊二：

最為本專案 stage (場景) 的，Div。

Adobe Edge - 02 檔案結構分析

1. Adobe Edge Animation 建立專案：

原則上會自動產生，幾個檔案（如圖）。

1.edge includes flie 檔案 :

    edge.5.0.0.min.js - 

    edge 自己的 lib

    

2.依專案名稱（project name）產生的四支檔案：

    (1) projectName_edge.js -


          功能：

          1. 初始化參數 :

              在Adobe Edge 中所有的設定值，都會被記錄到這支程式中，

          2. 預載外部檔案 :  script、css。

    (2) projectName_edgeActions.js -

          執行時的時間軸或是事件動作

    (3) projectName.an -

          Adobe Edge 實際可以開啟的檔案。

    (4) projectName.html -

          產生的主要 Html。

   

 參考資料：

(1) Adobe Edge Api document :

http://www.adobe.com/devnet-docs/edgeanimate/api/current/index.html

Adobe Edge - 01 介紹 與 資料收集

功能

視覺工具，設計師使用工具，快速進行動畫設計。


 1. 屬性面板設定 CSS  - CSS3

 2. 利用時間製作動畫。


優點：


1. 快速分工「設計」與「程式」。

2. 與 Adobe Flash 、 Adobe After Effect 、 Adobe Premiere 有類似的時間軸概念。


缺點：


1. 必須了解 Adobe Edge Animation 架構。

2. 目前相關資料不多，使用著多觀望態度。

3. 為實驗過於較大專案使用，目前多以banner 製作的案例為主。

4. 有共同的preloader機制，dom、css 都已 javascript 動態設定的方式製作。


研究目的：


了解架構，了解可以實作到程度，較大活動或單一網站嵌入的靈活性。