Adobe Flashçå ¶ä»æç¨ - é·æ¦®å¤§å¸è³è¨ç®¡çå¸ç³»
Adobe Flashçå ¶ä»æç¨ - é·æ¦®å¤§å¸è³è¨ç®¡çå¸ç³»
Adobe Flashçå ¶ä»æç¨ - é·æ¦®å¤§å¸è³è¨ç®¡çå¸ç³»
Create successful ePaper yourself
Turn your PDF publications into a flip-book with our unique Google optimized e-Paper software.
互 動 Flash 在 直 覺 式 英 語 教 學 上 的 研 發 與<br />
其 他 應 用<br />
蕭 學 宏 助 理 教 授<br />
長 榮 大 學 媒 體 設 計 科 技 學 系
<strong>Adobe</strong> Flash<br />
• 前 稱 Macromedia Flash, 簡 稱 Flash<br />
• <strong>Adobe</strong> Flash Professional 多 媒 體 創 作 程 式<br />
• <strong>Adobe</strong> Flash Player<br />
• 自 從 Macromedia 公 司 於 2005 年 12 月 3 日 被<br />
<strong>Adobe</strong> 公 司 以 價 值 34 億 美 元 的 股 票 進 行 收<br />
購<br />
• http://zh.wikipedia.org/zh-tw/<strong>Adobe</strong>_Flash
• 主 要 檔 案 格 式<br />
<strong>Adobe</strong> Flash<br />
– swf 是 「Shockwave Flash」 的 縮 寫 。 保 護 功<br />
能 依 然 阻 擋 不 了 為 數 眾 多 的 破 解 軟 體 , 有 不 少<br />
閃 客 專 門 以 此 來 學 習 別 人 的 程 式 碼 和 設 計 方 式<br />
。<br />
– fla Flash 的 原 始 檔 , 只 能 用 <strong>Adobe</strong> Flash 打 開<br />
編 輯 。
• 主 要 檔 案 格 式<br />
<strong>Adobe</strong> Flash<br />
– as(ActionScript 的 縮 寫 ) 是 一 種 程 式 語 言 的<br />
簡 單 文 字 檔 案 , 存 成 as 類 別 檔 案 , 以 方 便 共 同<br />
工 作 和 更 進 階 的 程 式 修 改 。<br />
– swc, 是 一 種 供 Flash 使 用 的 庫 格 式 , 可 以 粗 略<br />
地 理 解 為 Flash 用 的 dll。 無 法 被 編 輯 。<br />
– flv, 是 Flash Video 的 簡 稱 ,FLV 串 流 媒 體 格 式<br />
是 一 種 視 訊 格 式 , 有 效 地 解 決 了 視 訊 檔 案 導 出<br />
的 SWF 檔 案 體 積 龐 大 , 不 能 在 網 路 上 有 效 使 用<br />
等 缺 點 。 (YouTube)
<strong>Adobe</strong> Flash Player 10<br />
• 主 要 平 台<br />
– Windows: I E 6.0 、Firefox 、AOL 9、Opera<br />
9.5 、Safari 3.x、Chrome 2.0<br />
– Macintosh 平 台 瀏 覽 器<br />
– Linux 平 台 瀏 覽 器<br />
– Solaris 平 台 瀏 覽 器
• 版 本 歷 史<br />
<strong>Adobe</strong> Flash<br />
– Macromedia Flash MX Professional 2004<br />
(2003 年 9 月 10 日 ) Web Services、ActionScript<br />
2.0 的 物 件 導 向 編 程 、 媒 體 播 放 零 件 。<br />
– Macromedia Flash Basic 8(2005 年 9 月 13 日 ) -<br />
新 增 了 濾 鏡 和 層 混 合 模 式 , 增 加 了 BitmapData<br />
類 , 使 Flash 擁 有 了 全 新 的 點 陣 圖 繪 圖 方 式 。<br />
– Macromedia Flash Professional 8 (2005 年 9 月<br />
13 日 ) - 增 強 為 移 動 裝 置 開 發 的 功 能 、 方 便 創 建<br />
Flash Web、 增 強 的 網 路 視 訊 。
• 版 本 歷 史<br />
<strong>Adobe</strong> Flash<br />
– <strong>Adobe</strong> Flash CS3/9 Professional(2007 年 4 月<br />
16 日 ) - 增 加 全 新 的 Actionscript 3 指 令 碼 語 言 ,<br />
重 新 設 計 命 名 空 間 的 結 構 並 增 強 對 物 件 導 向 的<br />
支 援 , 並 在 其 Flash Player 9 中 增 加 針 對<br />
Actionscript 3 而 完 全 重 新 編 寫 的 虛 擬 機 器<br />
AVM 2。<br />
– ECMAScript 4.0
• 版 本 歷 史<br />
<strong>Adobe</strong> Flash<br />
– <strong>Adobe</strong> Flash CS4/10 Professional(2008 年 9 月<br />
23 日 ) - 新 動 畫 物 件 的 創 建 , 同 時 還 增 加 了 動 畫<br />
編 輯 器 作 為 新 動 畫 方 式 的 輔 助 工 具 。<br />
– Flash CS4 還 整 合 了 3D 變 形 和 反 向 運 動 骨 骼 ,<br />
增 強 了 字 型 引 擎 , 並 可 以 直 接 發 布 <strong>Adobe</strong> Air 檔<br />
案 。<br />
– <strong>Adobe</strong> Flash CS5/11 Professional(Flash<br />
Professional CS5 BETA 版 將 在 2009 年 底 前 開<br />
放 下 載 , 2010 年 1-4 月 )。
<strong>Adobe</strong> Flash 的 其 他 應 用<br />
• Box2dflash<br />
• 官 網 http://box2dflash.sourceforge.net/<br />
• http://www.neave.com/bounce/<br />
– Box2dflash_1.avi<br />
– Box2dflash_2.avi
<strong>Adobe</strong> Flash 的 其 他 應 用<br />
• Papervision3d<br />
– pv3d_www.flv<br />
– pv3d_show.flv<br />
– pv3d_cube.flv<br />
– pv3d_cow.flv<br />
– pv3d_adv.flv
<strong>Adobe</strong> Flash 的 其 他 應 用<br />
• Google Map and Google Earth
<strong>Adobe</strong> Flash 的 其 他 應 用<br />
• Google Maps API for Flash - 3D Maps
<strong>Adobe</strong> Flash 的 其 他 應 用<br />
• Facebook( 開 心 農 場 )<br />
• http://www.adobe.com/devnet/facebook/articles/f<br />
acebook_architecture_overview.html
Flash 的 硬 體 連 接 應 用<br />
• Wiimote and WiiFit<br />
– wii_PV3D.flv<br />
– wii_fit.flv<br />
– wii_game.flv
Flash 的 硬 體 連 接 應 用<br />
• Arduino<br />
– Arduino_FlashPapervision3D.flv
• 分 析 聲 音<br />
聽 說 讀 寫 之 說<br />
– Mao-Yuan Kao, Chang-Biau Yang and Shiue-<br />
Hung Shiau, “Tempo and Beat Tracking for<br />
Audio Signals with Music Genre<br />
Classification.”, International Journal of<br />
Intelligent Information and Database Systems<br />
Volume 3, Number 3, 7 August 2009 , pp.<br />
275-290(16) (EI) [NSYSU, NSC-95-2745-H-<br />
309-003-HPU]<br />
– 幸 運 , 有 分 析 聲 音 之 基 礎 。
聽 說 讀 寫 之 說<br />
• Flash 分 析 聲 音 , 雖 有 快 速 傅 利 葉 轉 換<br />
(Fast Fourier Transform,FFT) 。
聽 說 讀 寫 之 說<br />
• 語 音 辨 識 (Chun-Feng Liao)<br />
– Introduction to CMU Sphinx<br />
• A speech recognition system developed at<br />
Carnegie Mellon University.<br />
• Consists of a set of libraries<br />
– core speech recognition functions<br />
– low-level audio capture<br />
• Continuous speech decoding<br />
• Speaker-independent
聽 說 讀 寫 之 說<br />
• 語 音 辨 識 (Chun-Feng Liao)<br />
– Brief History of CMU Sphinx<br />
• Sphinx-I (1987)<br />
– The first user independent ,high performance ASR of the world.<br />
– Written in C by Kai-Fu Lee ( 李 開 復 博 士 , 曾 任 Microsoft Asia 首 席 技 術<br />
顧 問 / 副 總 裁 , Google 大 中 華 區 總 裁 , 在 中 國 成 立 「 創 新 工 場 」。).<br />
• Sphinx-II (1992)<br />
– Written by Xuedong Huang in C. ( 黃 學 東 博 士 , 現 為 Microsoft<br />
Speech.NET 團 隊 領 導 人 )<br />
– 5-state HMM / N-gram LM.<br />
• 推 測 CMU Sphinx 的 核 心 技 術 對 Microsoft 與 Google Speech<br />
SDK 影 響 很 大 。
聽 說 讀 寫 之 說<br />
• 語 音 辨 識 (Chun-Feng Liao)<br />
– Brief History of CMU Sphinx<br />
• Sphinx 3 (1996)<br />
– Built by Eric Thayer and Mosur Ravishankar.<br />
– Slower than Sphinx-II but the design is more flexible.<br />
• Sphinx 4 (Originally Sphinx 3j)<br />
– Refactored from Sphinx 3.<br />
– Fully implemented in Java.<br />
– There is no restriction against commercial use or<br />
redistribution.
聽 說 讀 寫 之 說<br />
• Merapi AIR/Java Speech Recognition and<br />
Voice Control(Posted June 14,<br />
2009) (http://javadz.wordpress.com/)<br />
– Sphinx 4 (open source)<br />
– Merapi (open source)<br />
– Flash<br />
– Allows user to move a target on the screen by<br />
saying the voice commands LEFT, RIGHT,<br />
MIDDLE.
聽 說 讀 寫 之 聽<br />
• 英 語 互 動 遊 戲 之 進 入 ( 成 果 網 站<br />
http://140.117.168.61/Game.html)
聽 說 讀 寫 之 聽<br />
• 英 語 互 動 遊 戲 進 入 後 之 選 擇
聽 說 讀 寫 之 聽<br />
• 英 語 互 動 遊 戲 1
聽 說 讀 寫 之 聽<br />
• 英 語 互 動 遊 戲 2
聽 說 讀 寫 之 聽<br />
• 英 語 互 動 遊 戲 3
聽 說 讀 寫 之 學 習 歷 程 紀 錄<br />
• 英 語 互 動 遊 戲 結 果 之 紀 錄<br />
– 自 行 開 發 , 採 購<br />
– Moodle,BlackBoard,Sakai<br />
– Mahara 來 自 紐 西 蘭 的 自 由 軟 體 平 台 , 包 含 「 電<br />
子 教 學 歷 程 檔 案 (electronic portfolio)」
Moodle and SCORM<br />
• 2009 年 11 月 銘 傳 大 學 【 教 學 卓 越 計 畫 】 為<br />
增 進 英 語 溝 通 及 閱 讀 能 力 ,Moodle 系 統 推<br />
出 「 英 檢 單 字 挑 戰 王 」<br />
• 桃 縣 教 育 局 英 語 1200 單 字 課 程<br />
• 轉 入 MySQL 資 料 庫 , 透 過 網 路 , 支 援 隨 機<br />
選 取 1200 英 語 單 字 與 例 句 的 資 料<br />
• 英 語 學 習 SCORM 數 位 課 程 包
英 語 1200 單 字 之 MySQL 資 料 庫
英 語 1200 單 字 例 句 之 MySQL 資 料 庫
1200 英 語 單 字 互 動 遊 戲
英 語 1200 單 字 例 句 互 動 遊 戲
1200 英 語 單 字 與 例 句 互 動 遊 戲<br />
• http://210.70.171.84/english1200/flash_Ga<br />
me/myflash.swf<br />
• http://210.70.171.84/english1200/sentence<br />
/sentence.swf
英 語 學 習 SCORM 數 位 課 程 包<br />
• <br />
– 第 一 章 英 語 單 字 測 驗 <br />
– <br />
– 1-1 英 語 單 字 測 驗 <br />
– <br />
•
英 語 資 料 庫 與 Moodle 之 架 構 圖<br />
英 語 1200 單 字 與 例 句 資 料 庫<br />
PHP( 以 隨 機 為 原 則 )<br />
XML<br />
資 料 提 供 者<br />
學 生<br />
Moodle<br />
調 整 過 關 分 數<br />
程 式 設 計 者<br />
英 語 SCORM 數 位 課 程<br />
英 語 教 師
英 語 自 助 餐 供 需 鏈 WEB2.0<br />
蔬 菜 供 應 商<br />
各 式 各 樣 簡 單 素 材<br />
廚 師<br />
自 助 餐 菜 色<br />
顧 客<br />
Moodle
Flash Lite 2.0 執 行 畫 面 (N6120)
• 完 全 失 敗<br />
Flash Lite 2.0 的 執 行<br />
– 各 種 手 機 平 台 的 相 關 技 術 文 件 的 取 得 與 實 作 ,<br />
都 有 相 當 難 度 。<br />
– XMLSocket 應 用 基 礎 有 相 當 難 度 。
替 代 方 案 Flash Player 10 與 Flash CS5<br />
• <strong>Adobe</strong> 預 定 今 年 (2009 年 ) 邁 入 beta 階 段 、 明<br />
年 上 半 年 完 工 的 Flash Player 10, 將 遍 及<br />
市 面 上 所 有 其 他 的 智 慧 手 機 平 台 :<br />
• Google Android<br />
• 黑 莓 機<br />
• Windows Mobile<br />
• Palm WebOS<br />
• 諾 基 亞 Symbian。
• ECMAScript<br />
ActionScript 3.0<br />
– ECMAScript 實 作 版 本 是 JavaScript 、JScript<br />
.Net 以 及 ActionScript 。<br />
– ECMAScript 第 4 版 草 稿 是 ActionScript 3.0<br />
– ECMAScript 第 5 版<br />
• Flash Professional 8 (2005 年 9 月 13 日 )<br />
• Flash CS3(2007 年 7 月 12 日 )<br />
• ActionScript 2.0 -> ActionScript 3.0
<strong>Adobe</strong> Flash CS5<br />
• Flash CS3(2007 年 7 月 12 日 )<br />
• <strong>Adobe</strong> Flash CS4/10 Professional(2008 年<br />
9 月 23 日 )<br />
• <strong>Adobe</strong> Flash CS5/11 Professional(Flash<br />
Professional CS5 BETA 版 將 在 2009 年 底 前<br />
開 放 下 載 , 2010 年 1-4 月 )<br />
• 2009 年 Flash CS5 將 對 iPhone 平 台 , 有 支<br />
援 。( 手 機 最 後 一 塊 拼 圖 )<br />
• 微 軟 Microsoft Silverlight 1.0 ->3.0
Flash Builder 4<br />
• Flex Builder 官 方 5 正 式 更 命 為 Flash Builder<br />
4, 並 且 推 出 Beta 新 版 。<br />
• Flash Builder 4 更 貼 近 人 心 之 命 名 。<strong>Adobe</strong><br />
卯 足 18 個 月 的 努 力 , 將 此 版 本 重 心 放 在 三<br />
個 :<br />
– 設 計 者 與 程 序 員 間 更 緊 密 的 工 作 流 程 。<br />
– 以 資 料 開 發 為 中 心 。<br />
– 提 供 更 好 的 開 發 環 境 與 測 試 環 境 。
互 動 Flash 在 地 圖 上 的 研 發 與 其 他 應 用<br />
蕭 學 宏 助 理 教 授<br />
長 榮 大 學 媒 體 設 計 科 技 學 系
<strong>Adobe</strong> Flash 的 地 圖 應 用<br />
• Google Map and Google Earth<br />
• Umapper 與 現 有 網 路 主 要 地 圖 系 統 都 有 整<br />
合 , 包 括 Microsoft Virtual Earth、Google<br />
Maps、Yahoo Maps 、OpenStreetMap
<strong>Adobe</strong> Flash 的 地 圖 應 用<br />
• Google 於 2008 年 釋 出 了 Google Maps API<br />
for Flash<br />
• 支 援 Flex 與 Flash CS3<br />
• http://blog.roodo.com/esabear/archives/81<br />
16497.html 伊 沙 熊 的 學 習 筆 記 本
<strong>Adobe</strong> Flash 的 地 圖 應 用<br />
• Flash 中 加 入 Google Map 很 簡 單 , 只 需 要 以<br />
下 幾 個 步 驟 支 援<br />
1. 註 冊 產 生 一 組 API Key, 只 是 產 生 一 組 字 串 供<br />
使 用 而 已 。<br />
2. 下 載 SDK 並 解 壓 縮 ( 同 時 包 含 Flex 和 Flash<br />
CS3)<br />
3. 設 定 Flex 或 Flash CS3 的 環 境<br />
4. 測 試 範 本 程 式
註 冊 產 生 一 組 API Key<br />
• 基 本 只 是 產 生 一 組 字 串 供 使 用 而 已 。
註 冊 產 生 一 組 API Key
註 冊 產 生 一 組 API Key<br />
• 210.70.171.84<br />
• map.key="ABQIAAAAmxKx4bZnPddeU1q<br />
Onkoi3xRfPsPBQ0jo0V5I3B724EHbj6nqV<br />
RRPq15U22x589vu4yz4K9sgLkM9zw";<br />
• http://mail.cjcu.edu.tw/~shiaush/<br />
• map.key="ABQIAAAAmxKx4bZnPddeU1q<br />
Onkoi3xTNwrg5QnZgDJdzaX3bsgH12xT<br />
NVRQMujBTIvN_Ie4XmVNVXlbI7XlY3g";
設 定 Flex 的 環 境<br />
• 將 檔 案 裡 lib/ 資 料 夾 下 的 swc 檔 放 到<br />
Windows 裡 的 預 設 路 徑 :C:\Program<br />
Files\<strong>Adobe</strong>\<strong>Adobe</strong> Flash<br />
CS3\{language}\Configuration\Component<br />
s\Google\,{language} 可 能 是 en 或 其 它 語 言<br />
,Google\ 要 自 己 建 立 。 ( 在 本 文 中 版 本 是<br />
1.8, 所 以 檔 名 是 map_1_8c.swc, 給 Flex 用<br />
的 檔 名 則 會 包 含 flex)
Flash CS3 的 環 境<br />
• 打 開 Flash CS3, 工 具 列 中 的 視 窗 (window)-<br />
組 件 (Components), 將 GoogleMapsLibrary<br />
拖 到 元 件 庫 (Library) 裡 , 注 意 目 前 只 支 援<br />
AS 3.0 的 檔 案 。
輸 入 程 式 碼
測 試 結 果 一
輸 入 程 式 碼
測 試 結 果 二
資 料 庫 之 連 結<br />
• WWW: AppSer<br />
• 資 料 庫 : MySQL<br />
– XML<br />
– Json<br />
– AMFPHP<br />
• AMFPHP- 搭 起 Flash 與 PHP 的 美 麗 橋 樑
Change language