基于微信小程序的“闖關游戲式”學習平臺的研究與設計

陳宏揚 龍雨妃

摘要：基于微信小程序的輕應用開發正在成為新的互聯網風口，特別是類似“跳一跳”這類的闖關輕游戲得到了廣大網民的喜愛。如果融入游戲化學習思維，把學習平臺打造成一個闖關類的微信小程序游戲，使學習者的學習過程變成通關打游戲，一方面能夠提升在線學習的樂趣，激發學生學習動機，增強在線學習平臺的黏性，另一方面利用微信的流量優勢，能夠幫助學習平臺裂變更多的學習者。文章提出了基于微信小程序的“闖關游戲式”學習平臺的研究與設計，并探討其總體設計以及平臺子模塊設計。

關鍵詞：微信教學；微信小程序；游戲化學習；在線學習平臺；教育游戲

根據《2017微信用戶&生態研究報告》顯示，微信用戶的活躍用戶已經達到8.89億，2016年日均使用微信時長在4小時以上的用戶較2015年增加了一倍，微信已經成為人們重要的社交活動之一，而基于微信小程序的輕應用開發正在成為新的互聯網風口。2017年12月28日，小程序游戲“跳一跳”上線，不到1個月累計用戶數量已經達到3.1億，究其原因主要是微信龐大的用戶群加上人們習慣利用碎片化的時間進行放松，減輕壓力的行為。隨著互聯網教育的快速發展，教育游戲越來越熱，游戲化學習思維也越來越得到社會認可，如果能夠利用人們愛玩游戲的心理，融入游戲化學習思維，基于微信小程序開發把類似MOOC的學習平臺打造成一個闖關類輕游戲小程序，把平臺內的課程學習過程設計成一個個好玩的角色扮演（Role-Playing Game，RPG）通關游戲任務，讓用戶在學習的過程中得到積分、徽章獎勵，并利用排行榜等元素來激發學生的挑戰心，一方面能夠迎合學習者的喜好，提升學習者的學習樂趣，激發學生的學習動機，增強學習平臺的用戶粘性，另一方面微信自帶流量屬性，能夠讓學習平臺更快地在用戶間傳播，快速裂變新的學習者。綜上所述，本文提出了基于微信小程序的“闖關游戲式”學習平臺的開發。

1 基于微信小程序的游戲化學習平臺的優勢及意義

2017年1月9日，微信小程序正式上線，它基于微信開發，不需要安裝，用戶掃描二維碼或者直接搜索到便可使用。微信小程序采用DCloud流應用模式進行開發，并使用JS實現業務邏輯，WXML和WXSS來共同實現表現層功能，WXML是一種微信定義的模板語言，WXSS類似CSS，屬于國內首創[1]，該技術的開發屬于國內領先水平，使用該技術來開發游戲化學習平臺，既有利于推廣輕應用開發新技術，而且可以創新國內教育軟件及游戲化學習平臺，推動游戲化學習平臺的發展。其中基于微信小程序來開發游戲化學習平臺的優勢及意義主要體現在以下6個方面。

1.1 即用即走

現在市面上很多的移動學習平臺，比如超星學習通，都是需要用戶安裝APP，用戶不使用的時候也會占用手機的存儲空間，而微信小程序不需要安裝到手機上，它是微信內的云端應用，像微信公眾號一樣活在你的微信里，要用的時候打開，不用就關掉，方便了用戶。

1.2 用戶紅利

微信擁有8億多的用戶，而且黏性很高，讓各大學習平臺費盡心思的流量問題輕松解決。微信小程序依附于微信，繼承了微信的用戶群，在微信里開發產品更容易觸達用戶，而且如何掃碼、分享、參與活動不需要再教育，其優勢是其他學習平臺無法比擬的。

1.3 多終端適配

支持多種智能手機和平板，支持Android，iOS，Windows，Symbian等智能系統，騰訊公司對小程序專門做了優化，配合自己定義的開發語言標準，提升了小程序的性能，增強了平臺的穩定性，只要能安裝微信的終端，都能享受到基于小程序的游戲化學習平臺的優勢。

1.4 免注冊，易推廣

微信小程序依附于微信這個航母應用，在微信中的“發現”菜單有單獨的入口，還可以通過搜索、掃一掃等方式直達學習內容，同時學習者不需要再注冊新的學習賬號，只需給微信賬號授權即可登錄。微信在2017年6月上線了小程序的關鍵詞推廣，增強了小程序的曝光率；通過附近的小程序等流量入口，對于挖掘學習平臺的新用戶有舉足輕重的作用；結合微信公眾號的軟文推廣以及搭建小程序和公眾號之間的聯系，加大學習平臺的宣傳；分享到群，分享到好友的親民功能加強了學習平臺的傳播。

1.5 前景明朗

微信的主要思想是去中心化，未來的主推產品可能就是小程序，而小程序最有前景的應用筆者認為是輕游戲，基于微信小程序的游戲化學習平臺的開發正是以此為契機，一方面迎合市場的需求，另一方面加強游戲化學習思維的推廣。

1.6 教育資源共享

高校的精品資源對于圍墻外的人來說是可望而不可即的，微信小程序可以幫助高校把現有的優質微課、課件和題庫等教學資源傳播出去，讓高校有更多的受眾[2]。

2 游戲化學習平臺的開發與設計

2.1 平臺總體架構設計

平臺的總體架構和學習流程引入游戲化的學習思維，并結合“碎片化資源，結構化課程”的指導思想，在微信小程序開發平臺上進行開發。把學習平臺內的每一門課程的學習過程打造成一個個好玩的RPG闖關游戲任務。用微信登錄學習平臺后，學習者可以作為騎士進行學習闖關或者成為守關BOSS角色接收學習者挑戰[3]，并獲得對應的積分，最終刷新排名榜。

系統采用MINA技術框架進行開發，整個框架分為3層：視圖層、邏輯層和系統層，如圖1所示。該框架可以對微信提供的文件系統、網絡通信、任務管理、數據安全等基礎功能進行封裝，對上層提供一整套JavaScript API，調用微信提供的各種基礎功能與能力，能夠幫助我們快速地搭建游戲化學習平臺。

2.1.1 頁面視圖層（View）

WXML是MINA提供的一套類似HTML標簽的語言以及一系列基礎組件，結合開發WXSS文件來控制頁面的展現樣式，平臺中所有的學習交互流程和功能模塊均可在該層次上面實現，如RPG角色界面、游戲學習任務闖關界面、學習排行榜等。

2.1.2 邏輯層（App Service）

邏輯層為MINA框架提供服務，使用JavaScript編寫，采用基于微信的異步線程單獨加載運行，處理學習平臺的頁面渲染、頁面交互，例如學習平臺的學習筆記數據、學習者闖關數據、學習者交流等數據。它區別于HTML5，不能使用JavaScript中的DOM操作。

2.1.3 系統層（Navtive）

系統層包括微信能力、文件存儲、網絡請求等，其中微信能力包括微信用戶信息、微信公眾號、二維碼、掃一掃、微信支付等基礎功能，開發學習平臺時可以通過邏輯層進行調用，文件存儲包括學習平臺的頁面臨時數據、本地緩存、網絡存儲或調用等數據，學習平臺開發時，需要開通騰訊云，并與學習平臺小程序關聯，用于存儲用戶的學習數據、排名數據以及課程等數據。

2.2 平臺子模塊設計

依照“闖關游戲式”的學習模式，教師在平臺上建設課程的時候，對課程資源進行組織，在每個學習任務的知識點導入微課、教學課件、闖關秘籍（課程導學、重點難點指導）、習題庫等教學資源，并對學習任務進行相關的屬性設置，如完成時間、生命值加權計算（分數加權計算）等。平臺課程學習主要有兩個階段，分別是自主學習階段和闖關測驗階段，每個學習階段設計對應的功能子模塊，子模塊功能通過接口相互調用，既可以獨立使用，也可以結合其他模塊使用。

2.2.1 自主學習階段

設計自主學習系統，該系統主要由有選課模塊、角色扮演RPG系統模塊、生命值模塊、學習任務模塊、教學互動模塊、在線筆記模塊所組成。學習時，學習者用微信登錄學習平臺后，RPG系統會自動把第一次登錄的學習者識別為騎士角色，并讓學習者選擇自己的形象照。學生通過在當前知識點觀看授課視頻、參與學習討論、回答教師問題、完成作業、記錄課堂筆記等學習活動并結合完成時間來獲得騎士的生命值，學習者必須完成當前知識點任務的學習后，才能進入到后一個知識點的學習。生命值系統由教師管理，在后臺可以進行生命值加權計算設置，生命值占比案例設置如圖2所示。學習者自主學習階段的生命值由每個知識點獲得的生命值累計得出，當學習者完成整個課程知識任務的學習，并獲得60分以上的生命值時，即可獲得進行闖關測驗階段的資格，當學習者確認進行闖關測驗挑戰時，系統將自動將學習者當前的生命值提交到學習排行榜。

2.2.2 闖關測驗階段

設計闖關測驗系統，主要包括闖關測驗模塊、RPG角色模塊、計時模塊、闖關經驗值等子模塊，由老師在課程建設試題庫，試題類型主要包括客觀題和主觀題，分難、中、易3種維度將題目導入平臺，利用測驗系統的組卷功能，可以隨機組成不同的測試卷，形成課程闖關測驗任務，闖關測驗任務有30道選擇題，共計60經驗值；10道判斷題，共計20經驗值，以及l道問答題，共計20經驗值，累計100經驗值。主觀題經驗值由系統打分直接得出，主觀題經驗值由老師后臺評出。闖關測驗系統針對難、中、易關卡設計3個守關BOSS角色進行守關，每一個關卡通關成功并且獲得最高經驗值的學習者自動被系統識別為關卡守關BOSS，時刻迎接學習者挑戰。闖關前，學習者甲先閱讀闖關秘籍，并選擇測驗難度關卡以及預估完成時間，闖關任務右側會出現該關卡經驗值最高的學習乙進行守關，并顯示學生乙的闖關時間和闖關經驗值，如圖3所示。闖關時，學習者甲如果在自己設定的時間內完成測驗，并獲得60以上經驗值，則闖關成功，經驗值將和前階段的生命值累加，提交到學習排名榜。如果學習者在相同難度的測驗上，所花的時間更點，經驗值更高，那么學生甲的騎士就會走下來，把學習乙的守關BOSS殺掉，并獲得該關卡的附加經驗值，擊殺過程設計一些場景動畫提升娛樂性，如BOSS躺倒、求饒等效果讓學生者獲得游戲快感，增強娛樂性[3]。

3 結語

微信小程序作為輕型應用很有可能會是未來移動互聯網應用的主要形式，其良好的用戶體驗以及基于微信強大的傳播能力必然能為MOOC等學習平臺的建設帶來更為廣闊的前景。同時，游戲化學習思維也越來越得到認可，筆者將二者結合，希望能為同行開發在線學習平臺提供借鑒。

[參考文獻]

[1]劉琦，丁萍莉.基于微信小程序的互聯網+教育學習平臺的研究與設計[J].內江科技，2016 （12）：45-46

[2]王娟.微信小程序在高校教學中的應用與推廣[J]電腦知識與技術，2017（ 27）：147-148

[3]陳宏揚.基于HTML5的“闖關游戲式”移動學習平臺的開發和設計[J]廣東輕工職業技術學院學報，2017 （3）：8-12.