高雄市高英高級工商職業學校 Kao Ying Industrial Commercial Vocational High School 專題製作報告 校園課業及生活輔導遊戲軟體設計 指導教授 : 高志中 博士 指導老師 : 王美金 老師 科別班級 : 資料處理 科 3 年 2 班 座 號 : 13 05 08 姓 名 : 陳萱柔 侯宣如 洪綵憶 中華民國 104 年 03 月
目錄 壹 前言... 1 一 研究背景及動機... 1 二 研究目的... 1 三 研究方法... 1 四 研究流程... 5 貳 文獻探討... 7 一 數位遊戲式學習... 7 二 C# 程式語言... 7 参 系統設計成果及遊戲說明... 8 一 軟丙排球賽遊戲實作... 8 二 網丙採礦樂遊戲實作... 10 三 救火防災大考驗遊戲實作... 12 四 防災小英雄遊戲實作... 14 五 儀態大驗收遊戲實作... 15 六 英單大會考遊戲實作... 17 肆 結論與建議... 18 一 結論... 18 二 建議... 18
圖表索引 圖 1 遊戲架構圖... 2 圖 2 軟丙排球賽流程圖... 3 圖 3 網丙採礦樂流程圖... 3 圖 4 防災救火大考驗流程圖... 4 圖 5 防災小英雄流程圖... 4 圖 6 儀態大驗收流程圖... 5 圖 7 英單大會考流程圖... 5 圖 8 研究流程圖... 6 圖 9 軟丙排球賽遊戲主畫面... 8 圖 10 軟丙排球賽遊戲說明... 8 圖 11 軟丙排球賽遊戲進行畫面... 8 圖 12 軟丙排球賽遊戲回答問題... 9 圖 13 軟丙排球賽回答正確... 9 圖 14 軟丙排球賽回答錯誤... 9 圖 15 網丙採礦樂遊戲主畫面... 10 圖 16 網丙採礦樂遊戲說明... 10 圖 17 網丙採礦樂遊戲進行畫面... 11 圖 18 網丙採礦樂遊戲回答問題... 11 圖 19 防災救火大考驗遊戲主畫面... 12 圖 20 防災救火大考驗遊戲難易度... 12 圖 21 防災救火大考驗遊戲說明... 12 圖 22 防災救火大考驗遊戲進行畫面... 13 圖 23 防災救火大考驗遊戲回答問題... 13 圖 24 防災救火大考驗過關畫面... 13 圖 25 防災救火大考驗視窗畫面... 13 圖 26 防災小英雄主畫面遊戲主畫面... 14 圖 27 防災小英雄主畫面遊戲說明... 14 圖 28 防災小英雄主畫面遊戲進行畫面... 14 圖 29 防災小英雄主畫面失敗視窗... 14 圖 30 防災小英雄主畫面過關視窗... 14 圖 31 儀態大驗收遊戲主畫面... 15 圖 32 儀態大驗收遊戲說明... 15 圖 33 儀態大驗收遊戲進行畫面 1... 16 圖 34 儀態大驗收遊戲進行畫面 2... 16 圖 35 英單大會考遊戲主畫面... 17 圖 36 英單大會考遊戲說明... 17 圖 37 英單大會考遊戲進行畫面... 17
校園課業及生活輔導遊戲軟體設計 摘要 隨著時代的變遷 科技的進步, 電腦 手機 平板等各種 3C 產品早已成為人們生活中不可缺少的一部分, 有了網路與各種電子產品的結合, 不管是玩遊戲 聊天交友或是查詢各類的資料都變得非常的方便, 但也因為科技帶來的便利, 使現今的社會出現越來越多在家打電腦的宅男宅女或是低頭族, 而現在的學生也越來越沉迷於網路遊戲或是手機遊戲而荒廢了學業 而近年來數位遊戲式學習受到了許多關注, 此學習模式能提升學習者的學習動機及專注力, 因此本小組決定以 C# 來設計一些小遊戲, 讓學生們能透過遊戲來學習 關鍵詞 : 數位學習 遊戲式學習 C# 程式語言 壹 前言 一 研究背景及動機德國詩人席勒說 : 只有當人充分是人的時候, 他才遊戲 ; 只有當人遊戲的時候, 他才完全是人 由此可知, 遊戲對人有多麼的重要, 透過遊戲人們才可以毫無壓力地充分發揮自己的無限潛能, 在這科技發達的時代, 電腦等各種電子產品早已成為人們的休閒娛樂之一, 因此近年來數位遊戲式學習受到了許多關注, 此學習模式能提升學習者的學習動機及專注力, 因此本小組決定以 C# 來設計一些能幫助學生邊玩邊學習的小遊戲, 讓學生們不用在那麼枯燥乏味又死板的念書, 這樣不僅能有效的利用 3c 產品, 還能讓自己獲得更多的知識 二 研究目的依據上述的動機, 本專題把研究目的列為下列三項 : ( 一 ) 我們希望能夠讓學生能在好玩的遊戲中學習, 為原先單調乏味的學習增進色彩, 並且幫助學生藉由好玩的遊戲考取證照, 提升學生學習的動力 ( 二 ) 讓學生透過我們製作的遊戲, 來更加了解有關災難來時的防災知識以及我們學校的特色 ( 三 ) 許多人用電腦 平板等電子產品, 都只是為了玩遊戲或跟朋友聊天, 我們希望透過這款遊戲, 讓這些電子產品也能夠變成學生學習的好工具 三 研究方法 ( 一 ) 需求分析本小組以實作法來進行專題研究, 而軟體開發所需的開發工具如下 : 1 畫面製圖工具: 小畫家 PhotoImpact 10 製作遊戲角色 遊戲場景及遊戲物件 1
2 遊戲人物製作: 人物製造機來製作我們的遊戲人物 3 程式開發工具: 我們採用 Visual c# 2013 設計遊戲的視窗及介面, 在軟體中寫入遊戲的程式碼 ( 二 ) 系統分析與設計 1 遊戲架構圖 圖 1 遊戲架構圖 2 遊戲流程圖 (1) 軟丙排球賽 : 透過排球遊戲讓學生練習軟丙學科, 遊戲中只點擊到球就可回答問題, 比賽為 15 分過關 2
圖 2 軟丙排球賽流程圖 (2) 網丙採礦樂 : 透過採礦遊戲讓學生練習網丙學科, 遊戲中撿到卷軸即可回答 問題, 答對 15 題為過關 圖 3 網丙採礦樂流程圖 (3) 防災救火大考驗 : 遊戲中只要消滅火點即可回答問題, 遊戲設計問題為火災 相關知識 3
圖 4 防災救火大考驗流程圖 (4) 防災小英雄 : 遊戲中會隨機出現物件, 在 60 秒內按得分物件達到 100 分即 可過關 圖 5 防災小英雄流程圖 (5) 儀態大驗收 : 遊戲中要在五秒內完成教官發出的指令, 回答指令的時間會越 來越少, 答對 20 個指令即可過關 4
圖 6 儀態大驗收流程圖 (6) 英單大會考 : 遊戲中會隨機出現英文單字, 成功接到正確答案,15 分為闖 關成功 圖 7 英單大會考流程圖 四 研究流程 我們依據系統開發流程, 將系統開發活動劃分成需求分析 系統分析 系統設計 5
系統實作 系統測試及專題製作 此次研究首先針對同學 教職員訪談可能的需求, 接著分析系統的操作流程, 設計出遊戲系統的功能模組架構 在系統實體建構方面, 我們用 Photo Impact 等修圖軟體設計出我們遊戲中需要的角色 場景及物件, 並下載了微軟的 Visual C# 2013 來設計我們的遊戲視窗, 最後經過同學們的測試後, 修改系統並完成此次研究 圖 8 研究流程圖 6
貳 文獻探討 一 數位遊戲式學習數位遊戲式學習 (Digital game based learning), 是指學習者利用數位遊戲平台系統來進行學習, 遊戲中的互動性與娛樂性可以激起學習者的好奇心與興趣, 透過遊戲系統反覆的操作, 將教學內容進入學習者的記憶中, 能重複的解決問題 不斷的克服挑戰, 使學習者在遊戲中獲得的成就感 數位遊戲式學習可應用於各種不同的教學題材上, 透過此種學習方式不僅能讓學習者對所學的科目有更加的了解, 還同時滿足了學習者玩遊戲的娛樂性, 提高了學習者的學習動機, 因此數位遊戲式學習應同時兼顧遊戲性與教育性, 達到寓教於樂的目的 二 C# 程式語言 Microsoft Visual Studio 是美國微軟公司的開發工具套件系列產品, 它包含基於元件的開發工具 ( 如 Visual C# Visual J# Visual Basic 和 Visual C++), 包含功能完整的程式碼編輯器 編譯器 專案範本 設計工具 程式碼精靈 功能強大且易於使用的偵錯工具 C# 是微軟為了.NET Framework 設計的高階程式語言,C# 由 C 語言和 C++ 衍生而來, 繼承了其強大的效能, 同時又以.NET 框架類別庫作為基礎, 擁有類似 Visual Basic 的快速開發能力, 是簡單 強大 類型安全且以物件為導向的語言 7
参 系統設計成果及遊戲說明 一 軟丙排球賽遊戲實作學校提倡學生考取證照, 希望學生能在畢業後能夠有許多的證照, 也讓自己更加專業, 而我們為了幫助學生考取證照, 所以我們設計了這款 軟丙排球樂 來幫助學生藉由遊戲來練習軟體應用丙級學科的題目 這不只讓學生把原先覺得困難且枯燥乏味的學習變成一種樂趣, 也為學習添加色彩, 讓學生可以藉由遊戲來學習, 也讓學生在家中能個開心的複習學校的課業, 且讓遊戲也能成為學生學習的好工具 軟丙排球賽主畫面, 共有兩個按鈕, 分別 為遊戲說明與遊戲開始, 即可點擊進行選 擇 圖 9 軟丙排球賽遊戲主畫面 按下遊戲說明按鈕, 會跳到圖 10 視窗講解 遊戲規則, 按返回鈕即可回到主畫面 圖 10 軟丙排球賽遊戲說明 按下遊戲開始鈕, 點擊球即可直接進行遊 戲回答問題, 右上方有分數版計算分數 圖 11 軟丙排球賽遊戲進行畫面 8
回答問題畫面因為搭配學科題目, 我們並沒有設計時間倒數的設計, 讓學生可清 楚看完題目後再作答, 也在作答後出現教練來給予學生嘉勉, 讓學生答對題目或答錯題 目時, 都能夠感覺到學習的快樂 點擊排球後出現軟體應用丙級題目, 可直 接點選答案回答, 確認答案後按送出鈕即 可 圖 12 軟丙排球賽遊戲回答問題 若回答正確會出現圖 13 畫面給予鼓勵, 點 擊畫面即可繼續進行遊戲 圖 13 軟丙排球賽回答正確 若回答錯誤會出現圖 14 畫面給予嘉勉, 點 擊畫面即可繼續進行遊戲 圖 14 軟丙排球賽回答錯誤 9
二 網丙採礦樂遊戲實作學校提倡學生考取證照, 希望學生能在畢業後能夠有許多的證照, 也讓自己更加專業, 而我們為了幫助學生考取證照, 所以我們設計了這款 網丙採礦樂 來幫助學生藉由遊戲來練習網頁設計丙級學科的題目 這不只讓學生把原先覺得困難且枯燥乏味的學習變成一種樂趣, 也為學習添加色彩, 讓學生可以藉由遊戲來學習, 也讓學生在家中能個開心的複習學校的課業, 且讓遊戲也能成為學生學習的好工具 網丙採礦樂主畫面, 共有兩個按鈕, 分別 為遊戲說明與 START, 即可點擊進行選擇 圖 15 網丙採礦樂遊戲主畫面 按下遊戲說明鈕, 會跳到圖 16 畫面進行遊 戲說明, 按返回鈕回到主畫面 圖 16 網丙採礦樂遊戲說明 10
回答問題畫面因為搭配學科題目, 我們並沒有設計時間倒數的設計, 讓學生可清 楚看完題目後再作答, 作答完畢後則繼續返回遊戲畫面, 使遊戲繼續執行 按下 START 鈕, 就會開始進行遊戲, 遊戲 進行中若在可選取路線前, 尚未選擇行進 方向, 礦車將會直行前進 圖 17 網丙採礦樂遊戲進行畫面 若吃到卷軸就可回答網頁丙級問題, 可直 接點選答案回答問題, 確認答案後要按送 出鈕 圖 18 網丙採礦樂遊戲回答問題 11
三 救火防災大考驗遊戲實作遊戲中我們在回答問題的畫面中設計了秒數的倒數, 為了讓學生快速的反應災難來時所需要知道的知識, 在生活中我們不知道什麼時候會發生災難, 也因此我們讓學生可以在遊戲中學習 防災救火大考驗, 共有三個按鈕, 分別為 遊戲難易度 遊戲說明與遊戲開始, 即可 點擊進行選擇 圖 19 防災救火大考驗遊戲主畫面 按下遊戲難易度鈕, 會跳到圖 20 畫面選擇 要答對的過關題數後, 按返回鈕後即可回 到主畫面 圖 20 防災救火大考驗遊戲難易度 按下遊戲說明鈕, 會跳到圖 21 進行遊戲說 明, 按返回鈕回到主畫面 圖 21 防災救火大考驗遊戲說明 12
按下遊戲開始鈕, 即可進行遊戲, 人物會 隨著點擊火點的位子移動到火點下方, 點 擊火點即可回答問題 圖 22 防災救火大考驗遊戲進行畫面 點擊火點會跑出有關防災知識的題目, 可 直接點選答案進行作答, 右下角時鐘為 10 秒倒數計時, 確認答案案送出鈕 圖 23 防災救火大考驗遊戲回答問題 在生命值尚未歸零之前, 回答完過關題數, 將會出現的過關畫面 圖 24 防災救火大考驗過關畫面 在生命值歸零之後, 尚未回答完過關題數, 將會出現的失敗畫面 圖 25 防災救火大考驗視窗畫面 13
四 防災小英雄遊戲實作 此遊戲出現的物件是我們生活中常見的物品, 我們藉由遊戲訓練學生的反應力 防災小英雄主畫面, 共有兩個按鈕, 分別 為遊戲說明與遊戲開始, 即可點擊進行選 擇 圖 26 防災小英雄主畫面遊戲主畫面 按下遊戲說明鈕, 會跳到圖 27 進行遊戲說 明, 按返回鈕回到主畫面 圖 27 防災小英雄主畫面遊戲說明 按下遊戲開始即可進行遊戲, 右上方有倒 數計時器與分數計算, 人物點擊物件即可 瞬間移動到物件位置進行加扣分 圖 28 防災小英雄主畫面遊戲進行畫面 在時間歸零之前, 尚未達到一百分時, 將 會出現的失敗視窗 圖 29 防災小英雄主畫面失敗視窗 在時間尚未歸零之前, 已達到一百分所出 現的過關視窗 圖 30 防災小英雄主畫面過關視窗 14
五 儀態大驗收遊戲實作本遊戲搭配了學校特色, 由於我們學校新生入校時都會有一個月的儀態訓練, 所以我們設計了這套 儀態大驗收 的遊戲, 讓學生可以在遊戲中了解我們學校的特色, 且能夠讓學生在玩遊戲時感覺到新生入學時的情景 ; 也可以讓我們學校技藝學程班的國中更認識我們學校, 加深學生對我們學校的映象 儀態大驗收主畫面, 共有兩個按鈕, 分別 為遊戲說明與遊戲開始, 即可點擊進行選 擇 圖 31 儀態大驗收遊戲主畫面 按下遊戲說明鈕, 會跳到圖 32 進行遊戲說 明, 按返回鈕回到主畫面 圖 32 儀態大驗收遊戲說明 15
按下遊戲開始鈕即可進行遊戲, 需在教官指令出現時點選方向鈕, 在按鈕尚未選擇前會呈現黃色狀態, 左下方為答對題數的計算, 右下方為生命值 圖 33 儀態大驗收遊戲進行畫面 1 依照教官的指令按下方向鈕後, 人物會隨著回答的方向進行動作, 點擊方向按鈕後, 被點擊的按鈕會呈現紅色表示點擊, 未點擊的按鈕則會呈現灰色以示區隔 圖 34 儀態大驗收遊戲進行畫面 2 16
六 英單大會考遊戲實作本校在每週二 四都會有英文廣播教學, 以及每學期都會有英文單字的認證, 為此我們設計此遊戲, 讓學生能夠在平時就能練習英文單字, 讓學生能夠學習更多的英文單字, 也讓學生能夠在英文單字認證之前充實自己的單字量 英單大會考主畫面, 共有兩個按鈕, 分別 為遊戲說明與遊戲開始, 即可點擊進行選 擇 圖 35 英單大會考遊戲主畫面 按下遊戲說明鈕, 會跳到圖 36 進行遊戲說 明, 按返回鈕回到主畫面 圖 36 英單大會考遊戲說明 按下遊戲開始鈕即可開始進行遊戲, 左上方會呈現分數的計算, 右上方會呈現接到的中文字讓操作者可方便記住已接到的文字, 人物下方為秒數倒數計時 圖 37 英單大會考遊戲進行畫面 17
肆 結論與建議 一 結論我們遊戲的介面生動活潑, 操作說明也是淺顯易懂, 讓使用者能夠很輕鬆的上手, 而我們的遊戲內容主要搭配軟體應用丙級 網頁應用丙級 英文單字 防災知識以及學校的儀態訓練, 每個遊戲都有獨立的特色與精緻的畫面和動畫效果, 我們也在遊戲中分難易等級, 增加使用者對遊戲的興趣, 也讓遊戲有分數的高低比較及加 扣分, 讓使用者去爭取心目中想要得到的分數, 讓使用者更有挑戰感 本系統能讓學生從好玩的遊戲中夠得到知識從中學習, 未來希望能將遊戲放在網路平台, 讓我們學校的學生或是技藝班的國中生下載來玩, 讓學生們能夠從遊戲中學習或是更認識本校 二 建議 ( 一 ) 本遊戲設計目前只適用於電腦及平板, 希望未來能開發成手機遊戲 ( 二 ) 遊戲中的畫面主要偏靜態, 希望能多加些動態的人物或物件 ( 三 ) 本遊戲中出現的題目都是用 C# 程式逐筆貼上的, 希望未來能結合資料庫讓題目更方便修改 18