2012年12月10日 星期一

HTML5 : PK 大賽自訂題庫(2012.12.12更新)

《特別提醒》2012.12.12 以前的版本有 bugs ,造成數學題庫無法載入題目,已修正,請記得重新下載最新版本。另外,最新版現在支援圖片的題幹或選項。

以 LimeJS + HTML5 設計的 PK 大賽第一版因為是測試,只提供了九九乘法的題庫,經過多日的修改,它已可以自己按格式新增題庫,甚至提供了一個「後門」給會寫 Javscript 的人餵題庫給 PK。以下就來簡單的說明一下如何自訂 PK 大賽的題庫。


sample-4.js : 二欄式題庫裡包含了可顯示的資料語法

目前 PK 大賽下載回去的 html5_pk.zip 中,解壓縮以後,有一個名為「samples」的資料,裡面提供了幾個範例題庫,主要可以分為三大類:
html5_pk.zip 解壓縮後檔案結構
以記事本來開啟 samples 內的題庫範例
因為我們在出選擇題時會有「題幹」、「答案」和「錯誤的選項」三種資料,所謂的「三欄式題庫」中的三欄指的就是以「半形分號」來當分隔符號,把這三種不同的資料放在同一行字串中。
目前的 PK 大賽支援選擇題中的單選題,因此,第一欄放題幹的文字述敘,第二欄放答案的文字,第三欄錯誤選項的部份可能要很多個。我們可以利用「半形逗號」當分隔符號,再把多個錯誤的選項分隔開來。
sample-1.js 三欄式題庫

而「二欄式題庫」比三欄式少了什麼?它少了「錯誤的選項」,因為我們可以利用程式拿別題的答案來當作某一題的「錯誤的選項」,所以只需要「題幹」和「答案」兩欄資料。
sample-2-3.js 兩欄式題庫

「語文高手格式的題庫」則是之前用來玩「形近字」、「同音字」和「多音字」的小學具所用的格式,它較複雜,比較建議使用我寫的「語文高手出題機」來產生加注音的語法,然後再貼入複製好的範例檔中。


新增自訂題庫的方法

簡單整理一下新增自訂題的步驟
  1. 決定想要出的題庫類型。
  2. 由 「samples 資料夾」中複製相關類型的題庫設定檔。
  3. 以類似 Windows 記事本或是 Notepad++ 的純文字編輯器開啟複製好的題庫設定檔。
  4. 修改、新增設定檔內的題庫,每一行依序填入「題幹」、「答案」和「錯誤的選項」。特別注意使用「半形分號」來分隔各欄位。
    如果是三欄式題型,可以利用「半型逗號」來分隔多個「錯誤選項」。
  5. 儲存題庫設定檔。
  6. 以文字編輯軟體開啟選單設定檔「pk_menu_set.js」 ,並在裡面新增一行選單設定。
  7. 儲存選單設定檔。
  8. 以文字編輯軟體開啟快取檔案清單設定檔「cache.appcache」,在面面新增一行題庫設定檔的路路,並修改「Updated on:」後的時間。
  9. 儲存快取檔案清單設定檔。
目前,以上的方法也適用於 HTML5 版的「籃投高手」、「王牌投手」、「Ghost 捉鬼特攻隊」「搶救公主」,基本上,有時間會慢慢把其它 HTML5 的程式用同樣的模式來出題,這樣,類似的題庫可以依需求共用,增加應用上的彈性。

此外,因為最近教到數學分數的單元,為了讓班上孩子可以 PK 分數的題目,特別加上了表示分數的格式,這部份可以參考 sample-2-3.js 來出數學中帶有分數的題目。

檔案下載
  • PK大賽:html5_pk.zip
  • 王牌投手:html5_baseball.zip
  • 籃球高手:html5_basketball.zip
  • 搶救公主:html5_shark.zip
試玩及下載請到以下的網站:


相關文章




4 則留言:

  1. 雄哥好:

    很久沒有問候雄哥了,不好意思!

    Erin最近開始讓學生們玩玩這PK遊戲,謝謝雄哥!:D

    Erin覺得這個遊戲介面和遊戲方式很適合海外學生練習識字!但是這個遊戲和雄哥過去的遊戲不同的是,完全沒有音效,對嗎?音效可以增強競爭答題和勝出的刺激感。Erin想 請求 雄哥有些空閒時間時,幫忙加上音效。嘻,Erin是來麻煩雄哥的!:P 不過,希望不要給雄哥壓力,等到暑假期間也可以;雄哥完全沒有興趣做也沒有關西唷!~在Erin的華語教學上,雄哥的遊戲是多年來一直不可少的重要資源,感謝!^^

    回覆刪除
  2. 上個留言錯字更正: 沒有關西→沒有關係。

    回覆刪除
  3. Erin 您好:
    這個 PK 是用 HTML5 開發的,其實它有音效, 只是之前測試過, 如果使用音效, loading 會太重而影響動畫的部份而關閉不用。

    回覆刪除

 
© 2009. Design by Pocket