楊英風數位美術館虛擬教室中學習情境之設計研究
The Learning Environment Design of WWW Virtual Classroom for Yuyu Yang’s Digital Art Museum
國立交通大學應用藝術研究所 張恬君 吳安芩 摘要 不可諱言，在此一網路時代中，網際網路教學媒體，的確是現今教育者所不 能忽視的教學利器。而對一般大眾來說，透過網際網路「 自我學習」、「 終身學習」 更是在學校教育外所能攫取知識的最佳途徑。本研究透過實際建置楊英風數位美 術館中之虛擬教室加以探討，以期建構出具教育理念與貼近真實之學習情境的網 站模型，提出一個合乎時代脈動與人文精神的網際網路教學媒體，使得在非同步 網際網路虛擬教室中學習者仍能體驗到傳統教學中師生與同儕的交流互動，且能 運用這個新媒體的特性來建構新的學習經驗，為未來網路學習，提供參考方向。
研究動機與背景
1999 年 5 月，國立交通大學成立了楊英風藝術研究中心，開始有系統地整 理、典藏、研究楊英風教授數量極為可觀且未曾公開的珍貴圖文原始資料，幫助 學者與學生極具條理地審視楊教授一生各時期的創作風格及特色。由於楊教授之 作品極具文化特色與價值，且享有崇高之國際聲望，成為國科會數位博物館專案 主題計畫中之「 台灣民間藝術家數位藝術博物館」 首選的典藏，並建構楊英風數位美術館（http://yuyuyang.e-lib.nctu.edu.tw/）。由於楊英風教授畢生的努力， 最後的指向是在啟發下一代的藝術思維，他的終極關懷是藝術教育（楊維邦， 2001）。因此本研究提出建構一個提昇全民藝術鑑賞能力的「 楊英風藝術鑑賞虛 擬教室」 。期許能為此數位美術館提供符合教育理念與親近學習者的虛擬教室建 置，透過網際網路虛擬教室的教學型態來達成藝術教育的使命，使學習者能透過 此虛擬教室順利且融入地學習到數位美術館豐富而多元的網站內容。作為一個藝 術教育者與視覺文化的傳遞者，為年輕的一代，建立更多更好的美術教育網站， 是責無旁貸的。我們期許網路呈現的不只是資訊流(information flow)而已，而是 對生命有滋養作用的知識流(knowledge flow) (張恬君，2000a)。
「 虛擬教室」 是建構於全球資訊網上的一個教室情境的教學及學習環境，利 用全球資訊網的多媒體與方便的網路應用特性，建立課程伺服器，運用討論空間 及各種教學與學習活動之管理及應用軟體，使得教學更加多彩多姿與便捷（教育 部，2002）。而教育部於民國 89 年公布「 非同步（網路）遠距教學需求規格」 ， 內容相當於一個虛擬教室系統，一個虛擬教室系統可以包含下列教育環境的活動 項目：課程大綱、教師簡介、同學名冊、內容索引、學習進度表、課程內容、課 程公佈欄、學習評量區、課程評鑑表、鏈結資源、課程討論區、疑難信箱、常見 問題集、學生作品展及學生作業和成績查詢區等，以這些項目來實現班級中師生 間及學習者間的互動與切磋（楊家興，2000）。在這裡所提、即是一種可純粹透 過網路來自學之「 非同步」 、「 非即時性」 的線上學習系統，教材是事先建置於網 站上，由學習者主動瀏覽學習，是本研究探討的主題，和另一種「 即時性」 的網 路虛擬教室對學習者要求定時（以網路來即時傳送教學者教學過程）或定點（不 同地域學生可透過網路傳送聲音影像參與課堂討論）的學習模式，網站建置與設
計有著基本上的不同。 線上學習的模式可由下圖（圖 1）來詮釋，由「 教學活動」 、「 遠距教育」 與 「 多媒體」 三者結合而成的「 網際網路虛擬教室」 ，兩兩交互而衍生出在「 網路 虛擬社群」 的「 自我學習」 與「 自我評鑑」 。因此虛擬教室的建置者必須對於教 育性網站有一定的使命感，目前國內網路線上教學和教材上網，已逐漸成形，成 為學校教學之另外一種管道。然而，其中絕大多數仍停留在網路銅器時代，呈現 以傳統圖文形式為主，僅以電子教材替代傳統書籍之功能，未能實際有效提昇教 學之品質及內容﹝張恬君，2000b﹞。 圖 1 由教學活動、遠距教育與多媒體三者結合而成的網際網路虛擬教室示意圖 林奇賢（2000）指出一個完善的網路學習環境中，學習者應該可以進行一 個多元化的學習活動，以構成一個完整的學習歷程。而多元化的學習活動，應包 括 (1) 瀏覽線上學習資源的學習活動、 (2) 搜尋、解決問題、與學習評量等等 之學習檢視的學習活動、與 (3) 討論、觀摩、與學習輔導等人際溝通之合作學 自我評鑑 教學 遠距教育 多媒體 自我學習 虛擬社群
習的學習活動，而目前網路學習環境困境包括缺乏的人際互動、缺乏認同感 (ownership)、學習專注力(learning engagement)低、無法掌握資訊以進行深度的 學習。 將網際網路比喻成有如蜂巢結構，則從其中而出的是分散式群體生物，將自 身不斷複製、散布在網路上，既是獨立分散也是群體意志集合體(Kelly，1995)， 而網路媒體的特點便在於其豐富、多元、與動態性的學習資源，網路學習環境的 人際溝通提供了學習社群的形成空間。許多研究結果顥示，學習社群將左右學習 者在網路學習環境中的學習行為與成效，因此，如何建立一個具有正面功能的學 習社群，提供良好的人際互動空間、以建立合作學習的模式，是在探討網路學習 虛擬教室建構與應用時一個重要的考量點。正因如此，虛擬教室絕對需要有效的 管理與維護，才能讓網路學習達到應有的成效。 探討網際網路虛擬教室的議題，以往多是以硬體及工具性軟體技術的開發為 主（Hiltz, 1993; Palloff & Pratt ,2001）；觀之當前對網際網路虛擬教室的研究，從藝術 與教育領域入手之探討仍不多見；符合建構主義教育理念的教學網站設計、吸引 學習者求知的學習情境設計，是不該在科技的潮流下被忽略的；反之更應積極將 教育的理念加以淬煉昇華、以因應時代的潮流而向上發展，甚而對於此一教學網 站的建置宗旨：在已十分完整的藝術家數位美術館基礎上，將教育理念轉化再現 於網頁形式與視覺的設計，期待能在此一網際網路虛擬教室的設計研究中窺得端 倪。
研究目的
本研究之研究目的有三： 一、探討數位美術館中隱喻(metaphor)之視覺化設計。 二、探討設計與評估虛擬教室中之學習情境與虛擬角色。 三、 將本研究所提出之問題假設與分析評估之結果，透過實際建置之楊英風 數位美術館虛擬教室網站來呈現。
研究方法與步驟
本研究透過對國內現今虛擬教室網路教學之現況觀察、分析及相關文獻探 討，瞭解目前虛擬教室在教育理念傳達及教學情境上的設計情形，提出本研究主 要探討的問題點，而透過實作建置一虛擬教室教學網站、並以已具有完整架構及 資料庫之楊英風數位美術館為教學內容，將研究問題透過網站設計之視覺設計、 互動設計加以呈現，輔以專家評估，進一步修正與更新，以作為研究之結論與成 果。 研究步驟分述如下： 1. 文獻分析探討：研究者透過網際網路搜尋引擎、相關文獻推薦，瀏覽國內各 虛擬教室或教學網站，選取具代表性網站探討其教育理念之呈現、學習情境 之設計及網站視覺風格風格的特質，以做為虛擬教室的定位及網站設計之基 礎。 2. 隱喻分析與視覺設計：找出適當之隱喻來呈現楊英風數位美術館之教育理 念，並加以視覺化再現於網頁設計上。由於楊英風教授崇尚自然的創作哲學， 於是本研究以長青植物「 松」 來作為對本研究中楊英風數位美術館「 虛擬教室」 教育理念上的隱喻。反映出楊英風教授道骨仙風的個人氣質，以及勤勉 不懈的創作精神，同時亦能代表網路教育無遠弗屆、與時並進、不分晝夜的 意義象徵。楊英風數位美術館虛擬教室的網站視覺隱喻設計關連性，推演過 程如下表所示： 表 1 松樹與楊英風數位美術館虛擬教室網站隱喻視覺化推演過程表 松樹與松果（研究者攝） 松樹特性 轉喻意涵 與楊英風虛擬教室之關連 視覺呈現手法設計 常綠不凋 → 持續 → 楊英風創作精神 → 網路即時與不間斷性 → 綠色系的自然風格畫面色調 毬果 → 孕育演化→ 知識的傳承 → 學習的成果 → 毬果造型做為課堂學習連結 按鈕 → 首頁及末頁的毬果落地動畫 松子翅藉風力傳播 → 傳播廣闊→ 網路學習無遠弗屆 → 網路散播知識種子 → 首頁的松子從毬果中飛出散 播並長成大樹 國畫、詩詞中的松 → 中華文化 藝術表徵 → 松齡鶴壽 → 松下對奕 → 楊英風為世界知名的華人雕 塑藝術家 → 國內藝術家的教學網站 → 以工筆國畫中松樹的勾勒手 法繪製具中國風的松樹造型 → 虛擬角色楊老師有著長袍造 型
吟詩彈琴 → 藝術精神之不朽 → 松樹下的藝文活動 → 松樹圖像置於畫面一角 3. 虛擬角色設計：透過文獻探討分析網站中虛擬教師角色所應具備之特質、功 能及所提供之互動。在分析過現有網站的虛擬人物後，以建構主義中教師所 應具備之角色任務、結合虛擬教室之學習情境，並參考既有網站虛擬角色的 任務及互動方式，設計本虛擬教室網站的虛擬教師角色（見表 2）。 表 2 楊英風數位美術館虛擬教師角色任務及互動設計 楊英風數位美術館虛擬教師角色任務及互動設計 1.引起學生完成目標的興趣 >在動畫或小遊戲中扮演適當角色吸引學生注意及引起興趣 >配合學習情境表現不同動作造型模擬真實教師的表現 >以不同的造型表情出現在不同學習場合 2.示範正確完成工作的行動 >在教學過程中模擬專家造型及身份出現，增加信服力並提供 教學內容上的引導。 >提供解決問題之方法或相關連結 3.控制學生可能遭遇的問題 >提供虛擬教師信箱 email 供學習者提出問題。 >在學習過程中以對話泡泡提醒學習過程應注意事項。 >以不同的表情姿態顯示學習所遭遇之不同情境。 4.提供學習回饋 >模擬真實教師給予讚美鼓勵之表情動態顯示學習成就。 >以適當對話泡泡鼓勵學習成果及檢視學習記錄。 5.激勵並導正學生的學習方向 >對話泡泡提示學習所遭遇之不同情境並鼓勵學習者學習。 >鼓勵學生勇於嘗試多元的學習方式。也提醒學生以正確的態 度在網路中學習。 6.利用問題激發學生思考表達 >在教學進行中提出相關問題或引導思考性話語。 7.敘述並組織系統性學習概念 >在教學活動開始前先整理學習內容並適當提示學習方法。 4. 網站設計規劃：設計楊英風數位美術館虛擬教室之網站架構、教學內容、整 體視覺呈現、鏈結及其他相關互動機制的規劃（見表 3）。此設計項目及目標
之對照表，亦為本研究最後專家評估之依據。 表 3 楊英風數位美術館虛擬教室網站設計內容及設計目標 網頁設計內容 頁面 類別 內容 設計目標 畫面單純以強調文字內容 注意事項，力求醒目 屬課前導引頁使用較嚴肅色彩 課前叮嚀，專注學習者情緒 視覺 設計搖動的松果按鈕 並加入楊老師歡迎詞 引發學習者之探索心 虛擬角色 楊老師動作提醒注意事項 學習情境營造 導引頁 角色互動 動態松果引起互動、鼓勵學習 對話內容應引導學習動機 開新的固定視窗 配合目前一般最廣為使用的螢幕解析度最低標 準（800*600） 動畫中松果的滾動播種、松樹生長 隱喻教育十年樹木百年樹人 並藉由網路散播知識種子 由暗而明，畫面色調轉而明亮 猶如進入學習桃花源豁然開朗 視覺 登入畫面色彩鮮明活潑 營造清新學習環境 虛擬角色 楊老師服裝符合楊英風形象 以「楊老師」暗指楊英風，猶如「專家親自授課」 楊老師動作提示登入教室 教師「導引」學習者 登入頁 （包含片頭 動畫、註 冊、登入失 敗頁、查詢 密碼頁） 角色互動楊老師對話措辭生動 營造「虛擬教室」真實感 楊老師到松樹下來授課 比喻教學的開始 暗色背景襯托聯絡單明顯醒目 強調學習歷程自我檢視之重要 視覺 以書法字體顯示學習單畫面 模擬較真實之生活情境 虛擬角色 楊老師揮手招呼出現 模擬真實教師予學習者親切感 聯絡單 網頁互動楊老師透過聯絡單打招呼顯示登入 者名字、上課情形 提供「學習檢視」機制，猶如真實教室中所用「家 庭聯絡本」 松樹與鹿的虛擬教室畫面 鹿喻楊英風，松樹喻教育，並以國畫工筆描繪方 式呈現表現本土藝術家風格 畫面背景與主題色調調和 適切的色彩降低學習干擾 視覺 綠色系畫面呈現 楊英風「崇尚自然」之性格及配合楊英風數位美 術館色調 虛擬角色 楊老師學者的造型動作 模擬真實教師予學習者親切感 進入「公佈欄」的提示問候語 「導引」學習者進行學習活動 進入「上課囉」的提示問候語 「導引」、「鼓勵」學習者進行學習活動 進入「課後討論」提示問候語 教師「導引」、「鼓勵」學習者進行學習活動 虛擬教室 主畫面 角色互動 「下課去」的提示問候語 模擬教室學習情境的「下課」 下課連結僅設定於此面 登出教室需經由主頁面而不能隨意登出結束上 課 搖曳的松樹裡藏有教學內容小遊戲 學習者需具有探索、嘗試的求知欲 點名簿提供學生名單 營造「虛擬社群」的學習情境 舉手發言區可供即時發言 營造「虛擬社群」的擬真情境 網頁互動 發言記錄本的設置 提供「虛擬社群」互動紀錄 轉換成公佈欄畫面 學習情境轉換 畫面其他元件色彩簡化 提供專注之學習環境 視覺 條列式公佈欄畫面 模擬公佈欄之情境 虛擬角色 楊老師造型表情動作 模擬真實教師予學習者親切感 公佈欄 角色互動楊老師對話泡泡連結到數位美術館 的最新消息區 「導引」學習者「探求」的學習方式 轉換成課堂講述畫面 提示學習情境的轉換 畫面其他元件色彩簡化 提供專注之學習環境 授課區黑板畫面 暗示課堂學習 視覺 教學畫面動靜兼具 予學習者網路多媒體的多元學習方式 [上課囉] 單元一 （包含教學 單元內容及 課後測驗） 虛擬角色 楊老師適時出現 「導引」學習者進行學習活動
講述學習內容(page5) 教師適時提示學習重點 角色互動 提示學習瀏覽方式 教師「導引」角色 單元內容及 課後測驗） 網頁互動課後測驗以選擇題型式進行 「導覽性」教學單元以「認知」成分居多故採選 擇題型式 第一頁畫面轉換成類似「聯絡單」 畫面 「提示」學習方法而尚未開始進行課程內容 動態松果做為每頁學習完成的連結 學習收穫果實的教育隱喻 視覺 教室畫面右上角兩個 icon 連結 隨時提供輔助學習工具 虛擬角色 楊老師適時出現 伴隨學習者學習 [上課囉] 單元二 （包含教學 單元內容及 課後測驗） 角色互動並無直接與學生互動對話 學習單式的學習方式偏重學習者自我探求、故不 多加干擾 轉換成討論區畫面 提示學習情境的轉換 視覺 單純的畫面構成以文字為主 著重文字呈現減少其他干擾 虛擬角色 沒有楊老師出現 模擬課後學習情境老師不在場 課後討論 網頁互動課後討論區提供建立新主題及回應 機制 學習者在社群互動經驗中建構屬於個人的知識 累積 呼應上課登入時的畫面及動畫 鼓勵學習之貫徹頭尾，即使網路學習亦應有始有 終 視覺 松果自樹上掉落 喻「知識」種子落地傳布銜接下次上課開始畫面 之生根發芽 虛擬角色 楊老師從樹林中走出來 營造「下課」學習情境 楊老師提供聯絡信箱 「協助」學習者解決學習問題 角色互動 楊老師揮手及豎起拇指 「鼓勵」、「肯定」學習者 下課去 聯絡單 網頁互動顯示上課時間及測驗成績 提供「學習檢視」機制，猶如真實教室中所用「家 庭聯絡本」 5. 網站建置：http://yuyuyang.e-lib.nctu.edu.tw/v2/game/classroom/enter.html 本階段從「視覺設計」開始繪製網頁所需之視覺圖像，並應用於製作「情節 動畫」以傳達設計者之教學理念、同時增添網頁內容的變化及可看性，最後加入 互動機制的設計及資料庫的連結，包含虛擬教師的「角色互動」及虛擬教室的「網 頁互動」，可與學習者進行人性化的互動，使學習者在虛擬的網路情境中，獲得 一般學習情境中情感之認同。 圖 2 楊英風數位美術館虛擬教室網站
6. 進行網站之測試及修正，以呈現更理想之網站設計。 7. 專家評估：本研究之評估表由研究者依照本研究之研究問題、探討理論及在 網站實作上的呈現，以網站頁面為單位，分成「 視覺」 、「 虛擬角色」、「 角色 互動」 及「 網頁互動」 等四大項目，詳述設計內容及設計目標，以「 表現程 度」 分成五個尺度 5(100%)、4(75%)、3(50%)、2(25%)、1(0%)供專家圈選 評估。此外，在評估問卷首頁說明本研究之研究目的、評估及網頁瀏覽過程 注意事項，亦於每個不同頁面的評估之後，加上開放性評估意見欄，供專家 提出其他相關的意見及評述。
研究成果與結論
透過探討、分析、設計、發展到最後的評估等階段，研究者將於本章對整個 研究之過程與結果提出總結性的報告，並提出相關之建議以作為後續相關研究發 展之參考，茲分述如下： 1 虛擬教室教學網站設計應涵蓋教育理念並營造學習情境 正如同任何一個網站之設計，背後都有其設計概念與設計目標之訂定，才能 予以發展建置。而虛擬教室為教育性之網站，為達其教育之功能目標，應慎重規 劃與設計。透過文獻探討與分析，以建構主義教學理念來進行網路教學，即應涵 蓋教育理念的呈現，及學習情境的營造。 2 虛擬教室設計者可將教育理念透過視覺化設計來呈現 本研究以國內教學網站之觀察分析為參考，探討楊英風數位美術館虛擬教室之視覺設計方向，將教育理念透過松樹之隱喻，轉化在網站設計實作上，以松樹 圖像比喻教育十年樹木、百年樹人之理念，以松果掉落彈出松子、長成松樹的動 畫傳達的學習過程，並以松翅之飛揚散布比喻網路之無遠弗屆，最後透過網站整 體視覺設計加以呈現，並經過專家評估為確實可行之虛擬教室設計原則。 3 虛擬教室設計者可利用虛擬教師角色營造更佳之學習情境 本研究透過對國內教學網站中虛擬角色之觀察分析，並以建構主義教學理論 為依據，設計一虛擬教師角色「 楊老師」 ，模擬真實教師角色之任務，以對話泡 泡「 導引學習方法」 、「 指示學習步驟」 ，並以動作表情及話語「 給予學習回饋」 ， 輔助虛擬教室內學生之學習，以營造楊英風數位美術館虛擬教室之學習情境。經 專家評估為確實可行之虛擬教室設計原則。 4 虛擬教室網站建置提供楊英風數位美術館更完整之教育功能 研究者透過對網路教學的分析、教育理論的探討，將教育理念轉化在虛擬教 室網站的視覺設計上、並設計虛擬角色「 楊老師」 提供學習者在參與網站的學習 過程中有更佳之學習情境與學習經驗。 在研究中實作建置之楊英風數位美術館虛擬教室，則落實楊英風數位美術館 建置計畫中增設藝術鑑賞虛擬教室之具體目標，達到楊英風教授對啟迪藝術思 維，推廣藝術教育的期許。
參考文獻
Hiltz, S. (1993).The Virtual Classroom:Learning Without Limits via Computer. Northwood, New Jersey: Ablex Publishing Corporation.
Kelly, K.(1995). Out of control. Readingmass : Addison-Wesley.
Palloff, R. M., Pratt, K. (2001).Lessons From the Cyberspace Classroom: The Realities of online Teaching. San Francisco: Jossey-Bass Publisher.
林奇賢（2000），虛擬學校之建構與應用，資訊應用導航，45，頁 10-25。 張恬君（2000a），科技與藝術整合之課程，中華民國第 14 屆電腦輔助教學研討會手冊，頁 111-122。 張恬君（2000b），高度複製化影像時代之美術教育網站發展，藝術教育與視覺文化，頁 153-166。 教育部（2002），教育部資訊網（http://www.edu.tw/）。 楊家興（2000），航向新世紀的願景：網路上的開放教育環境，遠距教育，第 15.16 期，頁 75-84。 楊維邦（2001），台灣民間藝術家數位藝術博物館— 楊英風、蘇森墉、高棪，行政院國家科學委 員會專題研究計畫，新竹：交通大學。
