資訊融入國小鄉土教學－網站介面設計與學習成效之研究

(1)

資訊融入國小鄉土教學－網站介面設計與學習成效之研究

詹慧文黃國鴻

國立嘉義大學教育科技所

s0910171@mail.ncyu.edu.tw

摘要

由於鄉土教學以及資訊融入教學逐漸受到重視，目前在嘉義市有將近半數的國小建置了鄉土教學網站作為教師在鄉土教學課程之上課教材、以及教學工具，這些鄉土教學網站呈現的方式均以文字敘述為主再加上相關圖片的輔助說明。由於國小是空間概念認知發展的重要階段，因此設計適當的地圖教材於課程中將有助於提高學生空間的能力，以及從空間概念的角度來認識鄉土。因此，本研究將探討以地圖為主之鄉土教學網站的介面如何設計，並且比較學生透過以地圖為主和以文字為主之鄉土教學網站在學習上的影響及差異。以地圖為主的介面主要的設計包含有課程主題、工具列（地圖放大、地圖縮小、回到原本大小、地圖移動）、文字訊息、地圖區（指北針、地圖、地圖上點資料資訊的呈現）、圖層勾選區、圖例等功能；以文字為主的介面主要是以文字來敘述課程的內容，再加上一些圖片、以及表格的輔助整理。研究者將 40 位受試者分為兩組，分別為實驗組（操作以地圖為主之網站）和對照組（操作以文字為主之網站），在前測之後，實驗以受試者單獨操作網頁介面的方式進行，同時研究者也進行使用者介面操作的錄影，隨後再進行後測及訪談。研究結果顯示，實驗組和對照組的後測成績之平均數檢 定之 t 值為 2.092（p＝0.043＜0.05），達到顯著差異水準，因此，操作以地圖為主之網頁介面的受試者在後測成績表現上優於操作以文字為主之網頁介面的受試者。關鍵詞：介面設計、鄉土教學、學習成效、資訊融入教學、地圖。

1. 前言

「鄉土教學」在國內開始受到重視是近幾年來的事，然而在教育部民國五十一年和六十四年所修訂及頒布的「國小課程標準」當中，教育目標項目裡早已有標示，但是真正的落實卻是在民國八十二年修訂公佈「國小課程標準」之後，到了民國八十三年「鄉土活動課程標準」的訂頒，使得鄉土教學的推行可有較具體的法令依循，從九年一貫課程實施之後，鄉土教學依據舊課程逐漸發展新課程，主要重點在「學校本位課程的發展」、「多元文化的學習」、「主題統整的學習」、「以及以學生為主體，強調以生活經驗為重心」[6][10]。另一方面，資訊科技融入學習領域已是九年一貫新課程實施資訊教育之重要工作，「資訊科技融入教學」是將資訊科技融入於課程、教材與教學中，讓資訊科技成為師生一項不可或缺的教學工具與學習工具，使資訊科技的使用成為在教室中日常生活的一部分[1][4]。因此，資訊科技融入教學是希望透過資訊科技和學習領域的結合，可以提升學生在該領域上的學習成效，同時也使得學生在資訊能力上也獲得提升[8]。由於教育部推動資訊科技融入教學的緣故，很多的學校紛紛建立了鄉土教學網站作為鄉土教學課程上的輔助教材，網站的內容大多採取文字敘述的方式來介紹校區所在地的歷史文化、生活環境及自然環境。國小是空間概念認知發展的重要階段，教師在教學時若能配合學生空間概念的發展，設計適當的地圖教材於課程中，從小來培養學生讀圖、認圖的能力，將有助於提升學生的空間智能，透過地圖也可拓展學生的視野以及增進學生在地理方面應用的能力[12]。因此，建置以地圖為主之鄉土教學網站，有助於將地圖與鄉土歷史文化、生活環境及自然環境加以結合，使得學生能夠從空間概念的角度來認識鄉土。另外，地理資訊系統（Geographic Information System，GIS）在教育上所扮演的角色與功能為資訊的提供者、視覺化的工具以及資料整合的工具，它的特色是可以整合展示地理資料以及空間資料 [5][9][13]。地理資訊系統是以一個地圖為主的系統，在其中有著圖層的概念，使用者可將地圖一層層的疊起來，並且可選擇顯示需要的圖層、隱藏不需要的圖層，在地圖中包含了各個點的資料，使用者可以自行查詢。但是，地理資訊系統運用在教學上時會面臨三個困難[16]，第一是時間（Time），包含了實施的時間、訓練的時間、以及課程發展到成熟所需要的時間；其次是訓練（Training），包含了訓練老師和學生使用地理資訊系統，以及技術支援的團隊訓練；最後也是最實際的問題就是金錢（Treasure），所有必需資源的花費，包含了硬體設備、軟體、資料、訓練以及支援等的開銷。因此，將地理資訊系統的功能運用在鄉土教學網站的建置，不但可以將鄉土教學中的各種空間資料與地圖的地理概念相結合，有效的整合呈現鄉土教學的內容，還可避免直接運用地理資訊系統於教學時之困難。

(2)

2. 介面設計

本研究中設計了兩個不同的介面，一個是文字為主的介面，另一個是地圖為主的介面。詳細界面說明如下： 2.1 文字為主之網站介面 以文字為主之網站是用 FrontPage XP 所設計，研究者參考了目前嘉義市國民小學所使用的鄉土教學網站來設計，主要是以文字來敘述課程的內容，再加上一些圖片、以及表格的輔助整理，分成課程主題區、內容主題區、內容呈現區三個區塊。共有四個主題，分別是我們的學區、家鄉的地理、家鄉的機構、以及家鄉的古蹟，如下圖 1、圖 2、圖 3、圖 4 所示： 圖 1 我們的學區 圖 2 家鄉的地理 圖 3 家鄉的機構 圖 4 家鄉的古蹟 2.2 地圖為主之網站介面 以地圖為主之教學網站是用 Flash MX 2004 來開發的，研究者參考地理資訊系統的功能，並且依據介面設計的原則所設計，在介面中主要的設計包含有課程主題、工具列（地圖放大、地圖縮小、回到原本大小、地圖移動）、點標籤查詢、地圖區（指北針、地圖、地圖上點資料資訊的呈現）、圖層勾選區、圖例等功能，如下圖 5、圖 6、圖 7、圖 8 所示。為了幫助使用者能夠正確的操作介面，在介面設計時運用了以下三種技術[15]： 1. 積極的互動：在操作介面的過程當中，使用者能夠主動的操作電腦，進行探索式的學習。 2. 隱喻和類推：能夠幫助解釋系統的功能運作，這項技術運用在按鈕（放大、縮小、移動）的設計，以及圖層勾選單上。 3. 空間模式：利用圖像來幫助概念的傳達，使用者在操作介面後便會立即得到回應，達到直接操作的效果。詳細的設計說明如下：

(3)

2.2.1 地圖工具設計 在介面上，由於網站的架構是以地圖為主，因此以紙本地圖的樣式作為底圖的設計，讓使用者有在看地圖的感覺，而不僅止於在操作一個系統。為了讓系統使用起來更容易，因此在介面設計中通常會加入隱喻或類推。許有真的研究中指出[11]，隱喻的三個主要部分為新知識（概念）、已知知識以及兩者之間的關係；隱喻就是一種概念模式，它的功效在於提供學習者或電腦使用者適當而可類推的模式。例如老師在上課時，為了能夠讓學生更加了解新知識的內容，會運用一些比喻來幫助學生在新舊知識之間來做連結，這就是隱喻和類推的效果。為了讓使用者在使用網頁裡的工具時，能夠清楚快速的了解到各種工具的功能，在工具圖案的設計上，研究者參考了隱喻與類推的原則，作為此教學網站工具圖案設計的依據。工具圖案樣式可參考圖 5，詳細工具設計及功能說明如下： 2.2.1.1 放大縮小 利用放大鏡的造型來呈現地圖放大功能。放大鏡中有「＋」的是『放大』功能，可類推到放大鏡中有「－」的則是『縮小』功能。 2.2.1.2 回到原來大小 參考 Windows 圖片檢視器中「實際大小」的按鈕，作為這個圖形設計的參考依據。按下後地圖可回到一開始的大小。 2.2.1.3 地圖移動 以上下左右的箭頭按鈕隱喻為可將地圖向上、向下、向左、向右移動的工具，使用者按下按鈕後，便可移動地圖的位置。 2.2.1.4 圖層勾選 用「□」來表示出可以勾選的項目，使用者在勾下選項後，該項目的地圖就會顯示出來。網頁一開始就預設主要街道的「□」是被勾選的，且主要街道的是顯示的，可類推至勾選其它項目的「□」也可顯示出該項目的地圖。 2.2.2 圖層疊圖設計 本研究中所設計的圖層功能和地理資訊系統中的圖層功能採取的方式相同，使用者均採取打勾的方式來選擇顯示或不顯示圖層，當多個圖層都被選取時，地圖上也會立即出現所選取的圖層。如下圖 5 所示： 圖 5 圖層顯示/隱藏 2.2.3 點標籤查詢及資訊呈現 回饋的目的在於鼓勵、導正學習者朝向正確的學習目標，當使用者以滑鼠或鍵盤等裝置輸入的某些動作，電腦能夠對其動作做出立即、適當的回應，而且畫面上的動作或回應必須是連續的呈現，這樣才有直接操作的效果，如此可幫助使用者明白狀況、減少操作錯誤、知道結果，因而能有效的使用電腦[2][3][14]。因此，此網頁之資訊查詢以及呈現，均依循以上的原則來設計。 2.2.3.1 點標籤查詢 當使用者將滑鼠移到各個點上時，該點的名稱便會立即出現在滑鼠指標一旁，使用者可立刻知道目前所查詢的點為何，如下圖 6 所示： 圖 6 點標籤的查詢 2.2.3.2 資訊呈現 當使用者用滑鼠點下所查詢的點後，便會立即跳出一個含有該點資訊的小新視窗，使用者透過閱讀小新視窗內所呈現的資訊，便可更加了解該點的

(4)

功能或介紹。在介面設計時，應盡量讓畫面保持簡單，使用者看到清爽單純的畫面時，將有利於使用者與介面相互之間的溝通[2][7]。但是過分的一致性反而會使得介面的呈現顯得枯燥無味、缺乏變化，因此介面設計者必須考量在不同的情況下，能夠維持類似的介面環境，保持必要的一致性與標準化[3]。因此，在網頁資訊呈現的介面設計上，根據點的性質以及該點所要呈現的資訊量不同，而將呈現資訊的視窗畫面區分為以下兩種：一為家鄉機構資訊的呈現視窗，如下圖 7 所示；另一為家鄉古蹟資訊的呈現視窗，如下圖 8 所示。 圖 7 家鄉機構的資訊呈現 圖 8 家鄉古蹟的資訊呈現

3. 實驗研究

3.1 研究設計 本研究採取準實驗設計法，受試者在實驗開始進行之前，會針對課程內容先進行一次全體的前測，實驗完畢之後馬上再進行一次後測，測驗的時間均以 20 分鐘為上限。在實驗進行過程中共有兩組的受試學生，一組使用以文字為主的教學網站介面為對照組，一組使用以地圖為主的教學網站介面為實驗組，實施的課程單元名稱為「我的家鄉」；在整個實驗進行的過程當中，每位受試學生都是以個別操作網站的方式來進行，操作電腦的時間為 25 分鐘，先完成學習單的學生可選擇繼續操作或是直接進行測驗，受試學生在操作網站的同時，研究者會將受試學生操作網站介面的過程錄下來，以作為分析受試學生網站介面操作行為之用；實驗後，會分別對兩組的學生進行訪談，以更深入的了解受試學生的行為以及想法。 3.2 研究對象 本研究是以嘉義市○○國民小學五年級之學生作為實驗研究對象，研究者從五年級當中隨機挑選兩班學生先進行前測，依照學生的前測成績 30~40 分、40~50 分、50~60 分、60~70 分將兩班學生區分別分成四組，並且從每組中各隨機挑選 5 人，兩班各挑選出 20 位學生之後，將兩班測驗成績同組的 10 位學生平均分配成兩組，總共有 40 位測試學生，每組 20 位；一組學生操作以文字為主的網站介面，一組學生則操作以地圖為主的網站介面。兩組的受試學生均居住於該學區內，在生活環境以及家庭背景方面是相類似的。 3.3 研究結果 本研究是以不同的鄉土教學網站介面為自變項，測驗成績為依變項，進行平均數考驗。首先探討使用不同介面之鄉土教學網站的學生在前測成 績表現上是否有差異，這個部分採用獨立樣本 T 考 驗來進行檢驗；其次探討使用地圖介面的鄉土教學網站的學生在前後測成績表現上是否有差異，以及使用文字介面的鄉土教學網站的學生在前後測成 績表現上是否有差異，這個部分採用相依樣本 T 考 驗來進行檢驗；最後探討的是使用不同介面之鄉土教學網站的學生在後測成績表現上是否有差異，這 個部分採用獨立樣本 T 考驗來進行檢驗。 3.3.1 使用不同介面之鄉土教學網站的學生在 前測成績表現的差異 首先是分析使用不同介面之鄉土教學網站的學生，在前測成績表現上是否有差異。由下表 1 以及表 2 可得知，地圖組的前測成績平均數為 47.75，文字組的前測成績平均數為 46.50，變異數同質性 的 Levene 檢定並未達到顯著水準（F＝.012，p＝.913 ＞.05），表示地圖組與文字組前測成績的離散情形 沒有明顯差異。由假設變異數相等的 t 值及顯著性 發現考驗結果未達顯著水準（t(38)＝.293，p＝.771 ＞.05），表示地圖組與文字組的前測成績並無明顯

(5)

差異。由此可知，地圖組與文字組在前測成績的表現上是差不多的。 表 1 前測成績分組統計量表 分組人數平均數標準差地圖組 20 47.75 13.62 前測成績文字組 20 46.50 13.39 表 2 前測成績獨立樣本檢定表 Levene 檢定平均數相等的 t 檢定 F p t df p 假設變異數相等 .012 .913 .293 38 .771 不假設變異數相等 .293 37.989 .771 3.3.2 使用不同介面之鄉土教學網站的學生分 別在前後測成績表現的差異 其次是分析使用文字介面的鄉土教學網站的學生以及使用地圖介面的鄉土教學網站的學生，在前後測成績表現上是否有差異。 3.3.2.1 使用文字介面的鄉土教學網站 由下表 3、表 4、以及表 5 可得知，文字組學生之前測成績平均數為 46.50，後測成績平均數為 61.50，前測成績與後測成績的相關性達到顯著水準 （r＝.446，p＝.049＞.05），表示前測成績與後測成績的表現是有中度相關。由成對樣本檢定的 t 值及 顯著性發現考驗結果達到顯著水準（ t(19) ＝ -4.383，p＝.000＜.05），表示文字組的學生在前測成績和後測成績表現上是有顯著差異。由平均數來，看後測成績較前測成績高 15 分，表示文字組學生的後測成績是有所進步的。 表 3 文字組前後測成對樣本統計量表 平均數人數標準差平均數的標準誤前測 46.50 20 13.39 2.99 成對 1 後測 61.50 20 15.48 3.46 表 4 文字組前後測成對樣本相關表 人數相關顯著性成對 1 前測和後測 20 .446 .049 表 5 文字組前後測成對樣本檢定表 成對變數差異成對 1 _{M SD} _{t df} _p 前測-後測 -15.00 15.30 -4.383 19 .000 3.3.2.2 使用地圖介面的鄉土教學網站 由下表 6、表 7、以及表 8 可得知，地圖組的學生前測成績平均數為 47.75，後測成績平均數為 71.00，前測成績與後測成績的相關達到顯著水準（r ＝.587，p＝.007＞.05），表示前測成績與後測成績 的表現是有中度相關。由成對樣本檢定的 t 值及顯 著性發現考驗結果達到顯著水準（t(19)＝ -8.544， p＝.000＜.05），表示地圖組的學生在前測成績和後測成績表現上是有顯著差異。由平均數來看，後測成績較前測成績高 23.25 分，表示地圖組學生的後測成績是有所進步的。 表 6 地圖組前後測成對樣本統計表 平均數人數標準差平均數的標準誤前測 47.75 20 13.62 3.05 成對 1 後測 71.00 20 13.14 2.94 表 7 地圖組前後測成對樣本相關表 人數相關顯著性成對 1 前測和後測 20 .587 .007 表 8 地圖組前後測成對樣本檢定表 成對變數差異成對 1 _{M SD} _{t df} _p 前測-後測 -23.25 12.17 -8.544 19 .000 3.3.3 使用不同介面之鄉土教學網站的學生在 後測成績表現的差異 最後是分析使用不同介面之鄉土教學網站的學生，在後測成績表現上是否有差異。由下表 9 及表 10 可得知，地圖組的後測成績平均數為 71.00，

(6)

文字組的後測成績平均數為 61.50，變異數同質性 的 Levene 檢定並未達到顯著水準（F＝.922，p＝.343 ＞.05），表示地圖組與文字組後測成績的離散情形沒有明顯差異。由假設變異數相等的 t 值及顯著性 發現考驗結果達到顯著水準（t(38)＝2.092，p＝.043 ＜.05），表示地圖組與文字組的後測成績是有明顯的差異。因此，地圖組與文字組在後測成績的表現上是有顯著差異的，由後測成績平均數來看，地圖組的後測成績明顯表現的比文字組的後測成績好。 表 9 後測成績分組統計量表 分組人數平均數標準差地圖組 20 71.00 13.14 後測成績文字組 20 61.50 15.48 表 10 後測成績獨立樣本檢定表 Levene 檢定平均數相等的 t 檢定 F p t df p 假設變異數相等 .922 .343 2.092 38 .043 不假設變異數相等 2.092 37.020 .043

4. 結論與建議

由實驗研究結果可發現，在實驗進行前的測驗中，兩組學生的表現是相仿的，實驗進行後兩組學生的測驗成績都有顯著的進步，而地圖組學生的測驗成績又明顯高於文字組的學生，表示使用地圖為介面的教學網站在鄉土教學上會比文字介面的教學網站來的有效。另外，從訪談的資料中得知，有的學生覺得看地圖之後印象會比較深刻，也有人認為一般的地圖太複雜了，像網頁中這樣可以選圖層的會比較清楚；除了可以自己操作之外，老師也要上課、講解內容，這樣會更清楚；最後就是希望可以和其他同學一起操作、互相討論。並非所有鄉土教學的內容都適合與地圖的網頁結合，因此在設計時必須選擇合宜的教材內容，例如選擇與地理位置相關的內容，便可與地圖互相搭配。未來在鄉土教學的課程當中，教師可將地圖的教學網站作為教學媒體，發展一連串探究式學習的課程，讓學生透過地圖的教學網站來進行合作式的探究學習；其次就是後續的發展，能夠擴大地圖的範圍，並且增加更多的鄉土資料，以豐富網站的內容。

參考文獻

[1] 王全世。2000。資訊科技融入教學之意義與內涵。資訊與教育雜誌，80，23-31。 [2] 李世忠。1993。使用者介面的探討。視聽教育雙月刊，35（1），49-57。 [3] 李青蓉。1998。人機介面設計。國立空中大學。台北。 [4] 何榮桂。2002。臺灣資訊教育的現況與發展－兼論資訊科技融入教學。資訊與教育雜誌，87， 22-48。 [5] 周天穎。2001。地理資訊系統理論與實務。儒林。台北。 [6] 周蓮清。1999。鄉土教學與九年一貫課程。國教輔導，38（4），12-16。 [7] 林淑芳與林麗娟。1995。使用者介面－電腦輔助學習之認知要徑。視聽教育雙月刊，37（3）， 18-27。 [8] 邱瓊慧。2002。中小學資訊科技融入教學之實踐。資訊與教育雜誌，80，3-9。 [9] 施保旭。2000。地理資訊系統。儒林。台北。 [10] 郭至和。2000。從鄉土教學活動到九年一貫課程。國教輔導，39（4），11-17。 [11] 許有真。2001。人機介面隱喻之探討。教學科技與媒體，58，26-33。 [12] 張峻嘉。2003。試論國小地圖教育之重要性。教師之友，44（4），10-14。 [13] 賴進貴、邱顯晉。2003。e 世代教育與地理資訊技能。載於國立師範大學主編，e 世代的地理學－地理與資訊科技的交會論文集（頁 296-306）。國立師範大學。台北。

[14] B. Shneiderman, Designing the user interface:

Strategies for effective human-computer-interaction. Reading, Mass:

Addison Wesley Longman, 2002.

[15] R. E. Eberts, User interface design. Englewood Cliff, NJ: Prentice-Hall, 1994.

[16] R. L. Sanders, L. T. Kajs, & C. M. Crawford, Electronic mapping in education: The use of geographic information systems. Journal of research on technology in education, Vol. 34, No. 2, pp. 121-129, 2001.

資訊融入國小鄉土教學－網站介面設計與學習成效之研究