淡江大學覺生紀念圖書館 (TKU Library)
進階搜尋


下載電子全文限經由淡江IP使用) 
系統識別號 U0002-2005200520484300
中文論文名稱 網路教學平台視覺化介面影音討論工具之發展
英文論文名稱 Development of Audio-Visual Interface Disscussion Tools for Learning Management System
校院名稱 淡江大學
系所名稱(中) 教育科技學系碩士班
系所名稱(英) Department of Educational Technology
學年度 93
學期 2
出版年 94
研究生中文姓名 吳彩蓮
研究生英文姓名 Tsai-Lien Wu
學號 692100018
學位類別 碩士
語文別 中文
口試日期 2005-05-31
論文頁數 92頁
口試委員 指導教授-李世忠
委員-陳慶帆
委員-張基成
中文關鍵字 視覺化介面  影音討論工具  網路教學平台 
英文關鍵字 Visual-Audio Interface Discussion Tools  Learning Management System 
學科別分類 學科別社會科學教育學
中文摘要 目前國內各大專院校使用的網路教學平台,多媒體教材是相當普遍的學習內容呈現方式,這些多媒體教材包含文字、聲音、動畫、影像等等,而多數教學平台所提供之介面互動方式,仍是以「文字」介面為主,缺乏與學生影音互動的機制和即時影音錄製及播放的功能;故本研究旨在發展網路教學平台視覺化介面影音討論工具,此影音討論工具包含有「非同步影音留言板」及「同步影音討論區」,提供視訊、語音與文字錄製等功能機制;並將此影音討論工具內嵌於開放程式碼的網路教學平台Moodle內;同時探討介面控制的文獻,做為本研究發展影音討論工具介面的原則。
研究開發環境運用Flash Communication Server做為串流伺服器軟體,並以Flash MX 2004最新的Action Script 2.0撰寫程式,功能主要為啟動使用者端語音及視訊功能,並且利用RTMP協定進行串流(Streaming)通訊。再以php做為中介程式將影音資料寫入Moodle資料庫,實際整合影音媒體與網路教學平台。
網路教學平台Moodle整合本研究發展之影音討論工具,使用者毋需額外安裝任何軟體,即可使用聲音或影像錄製的功能,或是與其他使用者做即時同步的影音溝通;網路使用者對於聲音影像的教學活動有相當高的參與度與興趣,教師亦能透過影音討論工具運用更多元的網路教學策略與方法。所以網路教學平台應提供影音互動的相關功能,讓多媒體工具能配合教學的需求;除此之外,圖形化與視覺化的互動介面設計,更能讓使用者快速的瞭解介面功能的運作方式,提昇網路學習的動力。
英文摘要 Today advanced technological development has already provided the mutual audio-visual function, however, most of the web-based learning systems at present are still primarily focusing on text-based discussion. This study focuses on the development of visual-Audio discussion tools and construct interactive platform for teaching and learning on the web. This discussion tools include both the asynchronous message board and the synchronous discussion board. Teachers and students can present video, voice and text message and take the advantage of the recording function. This research also follows the interface design principle in developing the visual-Audio discussion tool for e-learning environment.

This study utilizes Flash Communication Server, Flash MX 2004 software and Action Script 2.0 with RTMP agreement to develop a video and audio discussion tool. This interactive communication board, which was programmed in PHP language, and MySQL database provides users with video, audio and text functions and was integrated in Moodle open source platform.

These tools were developed to provide on-line discussion within the Moodle system. Users may use the tools without any other installation. By using usability testing methods, interview and observation, students who take “Interface design’ course were interviewed to examine what functional elements and interface were used and how they were implemented in relation to current web-based environment. The results revealed that teacher and students were highly motivated and engaged in discussion and willing to use the tools for on-line courses.
論文目次 目錄
第一章 緒論 1
第一節 研究背景與動機 1
第二節 研究目的 3
第三節 研究範圍與限制 4
第四節 本研究預期之貢獻 5
第五節 名詞解釋 6

第二章 文獻探討 7
第一節 網路教學使用者介面設計 7
第二節 討論工具介面設計的原則 11
一、 組織架構區分 11
二、 隱喻象徵 13
第三節 討論工具之介面功能 16
一、 提供互動與介面的控制 16
二、 提供各類媒體訊息 16
三、 互動工具功能 17
第四節 現有影音討論工具分析探討 19
第五節 網路教學平台功能探討 25
一、 自由軟體(freeware) 25
二、 版權軟體(copyright software) 27

第三章 研究架構與設計 33
第一節 分析階段 34
一、 需求分析 34
二、 使用對象分析 34
三、 開發工具分析 34
四、 資源與限制分析 37
第二節 設計階段 39
一、 系統架構設計 39
二、 系統流程設計 40
三、 雛形介面功能設計 43
第三節 發展階段 46
一、 開發環境 46
二、 發展工具 48
第四節 評鑑階段 50
一、 施測的設備 50
二、 施測的方法 50
三、 施測的對象 52
四、 施測的場地 54
五、 施測的流程 54
第四章 研究成果與評鑑 55
第一節 發展成果畫面 55
一、 網路教學平台Moodle 55
二、 影音討論工具模組 57
三、 影音討論工具─非同步影音留言板 58
四、 影音討論工具─同步影音討論區 63
第二節 程式開發流程 65
一、 開發流程 65
二、 程式開發(FCS與Moodle間的溝通連結) 69
第三節 評鑑結果 75
一、 專家評鑑 75
二、 使用者評鑑 75
三、 評鑑結果綜整 80
第五章 結論與建議 82
第一節 結論 82
一、 網路教學平台應提供影音相關功能 82
二、 圖型與視覺化的介面能協助使用者在介面上的操作 83
三、 影音討論介面其內容區塊設計以使用者慣用性為主 83
四、 影音討論工具使用介面宜遵循設計原則做規劃 83
五、 影音討論工具研究發展需程式技術與介面功能設計之整合 84
第二節 建議 85
一、 整合成安裝模組供後續發展 85
二、 影音討論工具的成功模式轉移 85
三、 Moodle使用介面的機制建議 85
參考文獻 87
【中文部份】 87
【英文部份】 88

【附件一】影音討論工具之觀察要點 90
【附件二】使用者訪談大綱─非同步影音留言板 91
【附件三】使用者訪談大綱─同步影音討論區 92

表目次
表2-1-1 WebOffice、Horizonwimba與Breeze Live互動工具功能比較表 23
表2-5-1 網路教學平台媒體使用與互動功能比較表 30
表3-1-1 影音討論工具研究開發的軟硬體資源 38
表3-2-1 非同步影音留言板功能 43
表3-3-1 Moodle的功能設定 46
表3-3-2 開發環境內容 48
表4-2-1 新增mdl_iat_post資料表於Moodle資料庫 66
表4-2-2 新增模組於Moodle上最基本的組成檔案 68
表4-2-3  IAT模組主要程式說明 70
表4-3-1 非同步影音留言板介面─專家訪談結果 75
表4-3-2 同步影音討論區介面─專家訪談結果 75
表4-3-3 使用「非同步影音留言板」─觀察結果 76
表4-3-4 使用「同步影音討論區」─觀察結果 77
表4-3-5 使用「非同步影音留言板」─訪談結果 78
表4-3-6 使用「同步影音討論區」─訪談結果 79

圖目次
圖2-2-1 真實教室照片與相似的教室圖片 14
圖2-2-2 教室的隱喻象徵 15
圖2-4-1 JoinNet的使用者介面 20
圖2-4-2 HorizonWimba的語音使用者介面 22
圖2-4-3 Breeze Live的教師端使用者介面 23
圖2-4-4 中正大學網路教學系統連接語音聊天室畫面 24
圖2-5-1 Moodle討論板畫面 26
圖2-5-2 ATutor討論板畫面 27
圖2-5-3 智慧大師討論板畫面 28
圖2-5-4 Blackboard討論板畫面 29
圖2-5-5 WebCT討論板畫面 30
圖2-5-6 網路教學平台Moodle之功能圖 31
圖3-1-1 研究發展系統化設計模式 33
圖3-2-1 影音討論工具內建於網路教學平台Moodle之架構圖 40
圖3-2-2 非同步影音留言板-教師端設定 41
圖3-2-3 非同步影音留言板-學生端 41
圖3-2-4 影音討論區-教師端設定 42
圖3-2-5 同步影音討論區-學生端 42
圖3-2-6 主題列表與瀏覽留言內容雛形介面 44
圖3-2-7 主題列表與發表新留言雛形介面 44
圖3-2-8 影音討論區雛形介面 45
圖4-1-1 Moodle登入畫面 55
圖4-1-2 Moodle主畫面 56
圖4-1-3 Moodle課程類別畫面 56
圖4-1-4 Moodle單一課程介面 57
圖4-1-5 新增的非同步影音留言板、同步影音討論區 57
圖4-1-6 教師新增影音討論工具的設定畫面 58
圖4-1-7 非同步影音留言板畫面(依組員排列) 59
圖4-1-8 非同步影音留言板畫面(依文章主題回覆排列) 59
圖4-1-9 非同步影音留言板畫面(新留言─文字媒體) 60
圖4-1-10 非同步影音留言板畫面(新留言─聲音媒體) 60
圖4-1-11 非同步影音留言板畫面(新留言─影音媒體) 61
圖4-1-12 非同步影音留言板畫面(觀看文字媒體留言) 61
圖4-1-13 非同步影音留言板畫面(收聽純聲音媒體留言) 62
圖4-1-14 非同步影音留言板畫面(看影音媒體留言) 62
圖4-1-15 非同步影音留言板畫面(非該組同學無法進入留言板的畫面) 63
圖4-1-16 同學使用影音討論區畫面 63
圖4-1-17 非該課程同學無法使用影音討論區畫面 64
圖4-2-1 以root權限帶入phpMyAdmin管理 65
圖4-2-2 Moodle與FCS溝通的設定畫面(包括FCS主機的IP、port與權限等) 68
圖4-2-3 iat_record.fla的基本組成功能畫面 72
圖4-2-4 iat_play.fla的基本組成功能畫面 73
圖4-2-5 影音討論區組成畫面 74
圖4-3-1 非同步影音留言板「錄製介面」修正畫面 80
圖4-3-2 同步影音討論區修正後畫面 81
參考文獻 參考文獻
【中文部份】
方裕民(1998)。使用者介面設計之人因分析模式。中日設計教育研討會論文集,81-90。
旭聯科技(1995-2002),Wisdom Master 智慧大師_產品功能,2004年4月5日。取自http://demo.learn.com.tw/1000510357/product2.htm。
李世忠、何政興(1998)。電腦教學軟體介面設計。台北:立威出版社。
李世忠譯(2001),網路教學手冊。台北:五南。
李其瑋、包景濂(2001)。Web介面學習網站群組互動機制之實作與研發,教學科技與媒體,58,80-90。
阮枝賢。網路教學的設計。文教新潮,5(2)。2004年4月14日,取自http://www.tw.org/newwaves/52/2-2.html。
長亨文化事業有限公司(1996-2005)。Wimba語言教學輔助系統。2004年12月1日,取自http://www.igroupnet.com.tw/。
林淑芳、林麗娟(1995)。使用者介面─電腦輔助學習之認知要徑。視聽教育雙月刊,37(3),18-27。
林菁、李曉媛(2003)。網路教學的媒體呈現方式之研究,教學科技與媒體,65,34-58。
洪榮昭(1992)。電腦輔助教學之設計與應用。台北:師大書苑。
黃仁竑、許政穆、尹惠瑛、宋怡崑(2001)。網路教學系統之多媒體互動機制,資訊與教育雜誌,82,3-11。
蔡淑如(2000)。新聞網站互動性功能設計與使用者感知行為之初探─以聯合新聞網為例。交通大學傳播研究所碩士論文。
Macromedia Inc.(1995-2004)。Macromedia產品- Flash Communication Server MX:功能指南。2004年4月5日,取自http://www.macromedia.com/tw/software/flashcom/productinfo/features/。
【英文部份】
ATRC (Adaptive Technology Resource Center, 2001-2004), ATutor: Learning Management System, verified 10 Aug 2004, from http://www.atutor.ca/.
Belanger, F. & Jordan, D (2000). Evaluation and Implementation of Distance Learning: Technologies, Tools and Techniques. Hershey, PA: Idea Group Publishing.
BlackBoard, Inc (1997-2004), Blackboard verified 10 Aug 2004, from http://www.blackboard.com/.
Cato, J. (2001). User-centered Web Design. London, Addison-Wesley.
Galitz, Wilbert O. (2002). The Essential Guide to User Interface Design: An Introduction to GUI Design Principles and Techniques. NY: John Wiley & Sons.
Heydenrych, J.(2001). Avoiding a tired and stale pedagogy : Activating on-line learning. Progressio, 23(2), University of South Africa, South Africa. Verified 16 April 2004, from http://www.unisa.ac.za/Default.asp?Cmd=ViewContent&ContentID=13276.
Johnson, S. D. & Aragon, S. R. (2002). An instructional strategy framework for online learning environment. Proceedings of E-Learning 2002 World Conference on E-Learning in Corporate, Government, Healthcare, and Higher Education, Montreal, Canada.
Jones, M. G. (1993). Guidelines for screen design and user interface design in computer-based learning environment. unpublished doctoral dissertation, University of Georgia.
Krug, S. (2000). Don’t make me think: A common sense guide to web usability. Indianapolis: New Riders Publishing.
Laurel, B., Oren, T. & Don, A. (1992). Issues in multimedia design: Media integration and interface agents. In M. M. Blattner & R. B. Dannenberg (Eds.), Multimedia interface design. ACM Press.
Martin Dougiamas(2002-2004), Moodle - A Free, Open Source Course Management System for Online Learning, verified 10 Aug 2004, from http://moodle.org
Merrill, D., Li, Z. & Jones, M. (1990). Limitations of first generation instructional design. Educational Technology, 30(1), 7-12.
Miller, G. A. (1956). The magic number seven plus or minus tow: some limits on our capacity for processing information. Psychological Review, 63, 81-97.
Nielsen, J. (2000). Designing web usability. New Rider Press.
Rieber, L. P. (1995). A historical review of visualization in human cognition. Educational Technology Research and Development, 43(1), 45-56.
Shneiderman, B. (1992). Designing the user interface: Strategies for effective human-computer interaction (2nd ed.). Reading, Massachusetts : Addison-Wesley.
Sims, R. (2003). Promises of interactivity: Aligning learner perceptions and expectations with strategies for flexible and online learning. Distance Education, 24(1), 85-103.
WebCT, Inc (1998-2004). WebCT Campus Edition, verified 10 Aug 2004, from http://www.webct.com/.
Weinschenk, S., Jamar, P., & Yeo, S. (1997). GUI Design Essentials. John Wiley & Sons.
論文使用權限
  • 同意紙本無償授權給館內讀者為學術之目的重製使用,於2005-07-11公開。
  • 同意授權瀏覽/列印電子全文服務,於2005-06-28起公開。


  • 若您有任何疑問,請與我們聯絡!
    圖書館: 請來電 (02)2621-5656 轉 2281 或 來信