在影片播放時,有許多資訊要同時展示:動態地圖、在地資訊、評語等,要 在不拉動網頁下展現,因展示版面有限,呈現不易,而且使用者也不會同時看所 有的資訊,因此本論文提出相關資訊展示窗,此展示窗並排於影片播放器旁邊,
讓使用者觀看影片時,可以立即地取得相關資訊。
展示窗的下方設計一個工具列(圖 4-2),整合動態地圖、關鍵圖片、影片描 述、網友評語、教學畫面選擇的功能,而此工具列有兩種模式:影片模式與教學 模式,影片模式設計給一般影片播放使用,教學模式專門給教學影片使用,兩者 功能有些許不同如表 4-1所示。
表 4-1 相關資訊展示窗模式比較表
影片模式 教學模式
動態地圖 教學畫面
關鍵圖片
影片描述
在地資訊 評語/分
使用者在觀看影片同時,可以透過此工具列任意選擇自己所要觀看的資訊,
或是利用關鍵畫面瀏覽的功能立即地了解影片內容並觀看有興趣的內容;使用者 在使用此展示窗瀏覽相關資訊的功能時,影片仍然繼續播放不受影響。
圖 4-2 相關資訊展示窗工具列
4.3.1 動態地圖
很多影片雖然有提供遊玩的地點,但都僅止於文字敘述,若能提供地圖參考 拍攝地點,可以快速地知道確切位置,本系統使用 Google 開放的 API[13]可以 在網頁中操作Google Maps,此API基於AJAX開發,只需要會JavaScript就可以透 過API取用Google Maps豐富資訊,不必自己準備圖資,也不用自己開發地圖系 統,利用現有的資源,創造更多的附加功能與應用,這樣的調用方式稱為交叉服 務[4]。
當使用者瀏覽影片時,在影片中景點若有使用者定位過,則動態地圖可以立 即展示影片的定位資訊方便瀏覽者明確地知道景點位置與周邊環境如圖 4-3所 示,左側影片播放澎湖的吉貝,右側的地圖隨之顯示吉貝的衛星地圖,透過此機 制使用者可以立即知道吉貝的位置在何處,如果想更進一步觀看地圖,可以將指 標移到動態地圖上以拖拉方式觀看想了解的詳細地圖,亦可在在一般地圖與衛星 地圖做切換。
圖 4-3 動態地圖
如果沒有定位資訊,則使用者馬上可以擔任景點的提供者此部分在4.4.3節 有詳細操作說明,而動態地圖提供搜尋功能方便定位者找尋目的資訊,當找到定 位點後在動態地圖上點擊,即可將景點位置資訊存入資料庫中,方便之後瀏覽者 觀賞。
當景點定位過多時,動態地圖在切換景點時,需花費較多時間計算,而造成 延遲現象,此問題本論文在4.4.4節提出解決方法,實作後影片播放順暢,感覺 不出有延遲現象。
4.3.2 關鍵畫面瀏覽
在「旅遊導覽」系統有提供關鍵畫面截圖(圖 4-4),但當使用者為影片增加 更多景點時,整個網頁不好呈現這些關鍵畫面,無法在一個使用者所見的畫面內 觀看關鍵畫面與影片,使用上有些不便,有鑑於此,本論文提出關鍵畫面瀏覽視 窗,版面的編排讓關鍵畫面與影片放在平行的位置,其可以同時顯示九個關鍵畫 面(圖 4-5),使用者欲觀看更多的畫面也可以拉動頁面右邊的頁面捲軸,拉動時 只會拉動到關鍵畫面,畫面框與影片的位置不變,此窗口的也可以讓使用者不必 觀看影片即可先預覽影片內容,並依據個人喜好來點選觀看。
圖 4-4 「旅遊導覽系統」中的關鍵畫面展現
資料來源:李佳蓁,「Web 2.0 線上多媒體旅遊導覽系統」[1]
圖 4-5 關鍵畫面瀏覽
4.3.3 影片描述
圖 4-6是呈現影片描述的畫面,視窗中的文字是由影片上傳者在上傳時所提 供之影片描述,透過此機制可以讓瀏覽者概略地知道影片內容,影片描述的內容 也可以用來當做影片搜尋時的資料來源。
圖 4-6 影片描述
4.3.4 在地資訊
使用者在觀看影片時,可能會想規劃一個行程到影片中的景點參觀旅遊,因 此本論文在系統中增加在地資訊,如圖 4-7右側所顯示的資訊,是在系統先比對 後,呈現與景點相關的食宿旅遊資訊,提供瀏覽者參考,比對方法與使用時機將 在4.4.2節詳細說明。
圖 4-7 在地資訊
4.3.5 使用者評語
圖 4-8是影片播放畫面時顯示使用者評語之畫面,此功能提供使用者在觀賞 影片時可以看到其他使用者對此影片、景點的建議與分享彼此的心得或提供評 論,讓觀看使用者的使用者有參與互動的地方。
圖 4-8 使用者評語
4.3.6 教學畫面
圖 4-9為本系統播放模式採用「教學模式」播放影片的畫面,教學影片常常 會配合投影片資料,透過教學畫面視窗瀏覽者可以一邊看著簡報一邊看教學者的 教學,除此之外還可以使用本系統提供的關鍵畫面功能,馬上觀看使用者有興趣 的教學片段,解決現今網路上教學影片播放困難之問題。
圖 4-9 教學畫面