研究工具

本研究之研究工具包括數位遊戲教材、排序概念學習單、自編考卷與程式 設計學習態度問卷。分別說明如下：

一、教材

教材內容參考創意家出版的「職 校 計 算 機 概 論 II」第六章演算法的排序 單元，課程內容以氣泡排序（Bubble Sort）和選擇排序（Selection Sort）兩種排 序法為主。兩組課程內容學習目標與教材皆相同，只是呈現方式不同，如圖 3-2、

圖 3-3 所示，動畫去除了所有的遊戲元素，使用 Flash 軟體設計。遊戲應用 Unity 軟體設計，命名為「排序遊戲」。課程大綱與學習目標如表 3-1。

圖 3-2 排序動畫與遊戲之比較－排序說明

圖 3-3 排序動畫與遊戲之比較

表 3-1 排序概念教材

單元主題 排序-氣泡排序法和選擇排序法

課程大綱

排序（sorting）是將一組資料依據資料的特性，將資料由小到 大或由大到小排列的一種資料演算方法。本教材介紹氣泡排序 和選擇排序法，提供學生排序演算法的思維方式。

學習目標

1. 瞭解什麼是氣泡排序法和選擇排序法。

2. 能實際操作出氣泡排序法和選擇排序法。

3. 理解排序法的程式與演算過程。

程式語法 Visual Basic

氣泡排序程式 虛擬碼

FOR I = 1 TO N - 1 FOR J = 1 TO N - I

IF A( J ) > A( J + 1 ) THEN SWAP A( J ) ,A( J + 1 ) NEXT J

NEXT I

選擇排序程式 虛擬碼

FOR I = 1 TO N - 1 FOR J = I + 1 TO N

IF A( I ) > A( J ) THEN SWAP A( I ) ,A( J ) NEXT J

NEXT I

二、排序概念學習單

四、問卷

問卷內容分為三個向度，分別為：學生對於程式設計學習的態度、學生對 於使用遊戲學習排序概念的態度以及對於遊戲設計的滿意度。此問卷答題選項 包含封閉式選項與開放式問題，五專生的問卷題目合計 21 題，高中生的問卷題 目合計 22 題。封閉式選項計分採李克特四點量表（Likert scale），選項依非常 同意、同意、不同意、非常不同意之順序，分別給予 4、3、2、1 分。詳細之問 卷調查內容請參見附錄。

五、排序遊戲開發

本遊戲依據創意家出版的「職 校 計 算 機 概 論 II」第六章演算法的排序單 元為基礎，參考 Naps 等人 (2002) 對於視覺化工具應用在演算法教學的建議、

Shabanah and Chen (2009) 提出的排序遊戲設計元素及 Prensky (2007) 提出的 遊戲特性，並採用 javascript 語言撰寫主程式、Unity 製作排序遊戲。

(一) 背景故事

傳說中的藏寶圖聽說拆成兩份被藏在世界的各地，為了找出這傳說中 的藏寶圖，身為冒險家的你，決定出航冒險找藏寶圖。在航海的途中遇到 需要幫助的人，幫助他們並得到藏寶圖。

(二) 遊戲腳色

1. 美人魚：被困在氣泡理的美人魚，需要勇者使用氣泡排序法拯救。如 圖 3-5 所示。

2. 龍寶寶：守護龍珠的龍寶寶，需要勇者使用選擇排序啟動龍珠。如圖 3-6 所示。

圖 3-5 被困在氣泡中的美人魚

圖 3-6 守護龍珠的龍寶寶

(三) 遊戲流程

遊戲流程分別對應到學習目標，於遊戲開始，讓學習者自行選擇氣泡 排序或是選擇排序進行遊戲，動畫說明與引導部分，幫助學生理解氣泡排 序或選擇排序；於第二關至第五關的遊戲過程，檢驗學生是否能夠根據排 序步驟實際操作，並藉由實際的操作讓概念具體化，最後根據每個步驟解 釋程式的意義，讓學生對程式有更深的理解。學習流程圖如圖 3-7 所示，

遊戲流程圖如圖 3-8 所示。

圖 3-7 學習流程圖

1.根據規則完成二~四關 2.於時間內完成第五關

● 實際操作並熟悉排序法

1.觀看程式動畫說明 ● 理解排序的程式

與演算過程 1.觀看遊戲動畫說明

2.遊戲指引

● 理解各排序法

失敗

圖 3-9 遊戲世界地圖

圖 3-10 氣泡排序遊戲關卡選單

2. 遊戲目標：

玩家根據排序規則將一組數列由小到大排序。

3. 遊戲介面：

(1) 遊戲說明畫面：

利用文字和動畫介紹排序法。上方有文字說明，下方有相對應的 動畫呈現，如圖 3-11 所示。遊戲說明部分，玩家可根據自己的理解來 操作：重播、上一步或是下一步，如圖 3-12 所示。

圖 3-11 氣泡排序遊戲說明畫面（1）

圖 3-12 氣泡排序遊戲說明畫面（2）

(2) 遊戲指引畫面：

於遊戲畫面上方給予每個步驟操作提示，玩家根據操作提示完成 第一個關卡，如圖 3-13 所示。

圖 3-13 氣泡排序遊戲指引畫面

(3) 遊戲關卡畫面（圖 3-14）： 1. 需要排序的一組亂數數列。

2. 記錄每次數列的排序過程。

3. 目前得分。

4. 剩餘時間。

5. 遊戲說明。

6. 回遊戲主畫面。

圖 3-14 氣泡排序遊戲第三關畫面

(4) 程式說明畫面：

藉由遊戲過程，學生理解排序程序後，再以文字和動畫解釋程式 部分，及程式演算的過程，圖 3-15 為氣泡排序程式解說的一部份。同 遊戲說明部份一樣，玩家可根據自己的理解來操作重播、上一步或下 一步。

圖 3-15 氣泡排序程式說明

(五) 遊戲規則

給予一組隨機的數列，玩家需根據不同排序法的規則點選數列中的兩個數，

再判斷是否要交換，若需要交換則按「SWAP」鍵，反之則按「NEXT」鍵，重 複上述步驟完成排序。遊戲全部五個關卡。

1. 遊戲關卡

(1) 第一關：瞭解排序規則，藉由遊戲引導排序隨機的 4 個數。

(2) 第二關：由小到大排序隨機的 4 個數。

(3) 第三關：由小到大排序隨機的 5 個數。

(4) 第四關：由小到大排序隨機的 6 個數。

(5) 第五關：由小到大排序隨機的 6 個數，且需於一分鐘內完成。

2. 氣泡排序和選擇排序規則 (1) 氣泡排序：

給予一組隨機的數列，由小到大排序，解救被困在氣泡裡的美人魚，

遊戲規則模擬氣泡排序的演算步驟，從第一個數開始，由左至右依序點選 相鄰的數，兩兩做比較，詳細步驟如下：

Step 1：先點選第一個數和第二個數做比較，若左邊的數大於右邊的數 則交換按「SWAP」鍵，反之則按「NEXT」鍵。

Step 2：重複第一個步驟，點選第二個數和第三個數做比較，直到第 n-1 個數和第 n 個數比較，完成一個 Pass。

Step 3：每一個 Pass 可將未排序好中最大的數移到最右邊，使氣泡解除。

Step 4：依照 1~3 的步驟，直到所有氣泡解除，如圖 3-16。

圖 3-16 氣泡排序遊戲過關畫面

圖 3-17 氣泡排序遊戲失敗畫面

(2) 選擇排序：

給予一組隨機的數列，由小到大排序，啟動龍珠，遊戲規則模擬選擇 排序的演算步驟，從第 i 個數開始，分別與第 i+1，i+2…N 項比較，其中 i

= 1~N-1，詳細步驟如下：

Step 1：Pass1 固定選擇第 1 個數，分別與第 2，3，…N 個數比較，若第 1 個數較大，則交換按「SWAP」鍵，反之則按「NEXT」鍵，完成一個 Pass。

Step 2：每一個 Pass 可將未排序好中最小的數移到最左邊，啟動龍珠。

Step 3：重複上述步驟，如：Pass2 固定點選第 2 個數，分別與第 3，4，…N 個比較，直到第 n-1 個數和第 n 個數比較，啟動所有的龍珠，如圖 3-18。

圖 3-18 選擇排序過關畫面

(六) 遊戲音樂

背景音樂由國立台灣科技大學侯惠澤副教授創作提供的「出航」，音樂屬於 輕快，帶有冒險、海洋風格，並且有泡泡的音效。

(七) 遊戲視角

2D 平面遊戲，無法任意更換視角。