基于微信小程序的“庠序”課程表的設計與實現

李辰芳 劉小華 高怡欣 宋嘉雯

（西京學院 土木工程學院，陜西 西安710123）

智能終端的普及，預示著一個新的移動互聯網正在崛起，微信類移動通訊軟件脫穎而出，成為移動互聯網行業最具代表性的產品。“庠序”課程表是基于微信小程序，便于大學生了解課程信息，服務于大學生校園生活的一款小程序。

1 系統設計

1.1 功能設計

在“庠序”課程表小程序的功能設計上，登錄個人賬號進行使用，主要包括四種功能，即課程表的查詢，學術報告會查詢，公選課查詢，校園活動，在此基礎上實現云儲存和實時更新等。

（1）課程表查詢，登錄賬號，查詢自己的課程表，包括上課時間、上課地點、課任教師。可下載在此課程表，在此課程表上自行進行添加自己感興趣的課程和修改自己退選的課程。可根據用戶需要為上課時間做出提醒。

（2）學術報告會查詢。登錄賬號，按學院分類，土木工程學院，會計學院等，可根據用戶需要進行選擇，查詢學術報告會時間地址。

（3）公選課查詢。登錄賬號，按模塊分類，

（4）校園活動。分為校園院線影片放映，校園演出，校際分享會，社會公益活動，校園兼職。

1.2 業務流程設計

在系統的業務流程設計上，主要是根據課程表的查詢，學術報告會查詢，公選課查詢，校園活動四個業務功能實現的流程設計，其中，這四種業務功能具有獨立性、又具有相關性。統一于云端儲存和實時更新上。

2 系統實現

在系統實現上，主要包括前端界面和后臺數據處理。

2.1 前端界面

在前端界面的編寫上借助微信小程序開發技術，學習處理支撐小程序運行的四種文件--“.json”后綴的JSON 配置文件，“.wxml”后綴的WXML 模板文件，“.wxss”后綴的WXSS 樣式文件以及“.js”后綴的JS 腳本邏輯文件——的編寫方式。

2.1.1 JSON 配置文件

JSON 并非編程語言，而是在小程序運行中扮演著靜態配置角色的一種數據格式。首先學習了解編寫JSON 文件的邏輯語法，以及相關注意事項。

（1）JSON 文件都是被包裹在一個大括號中 {}，通過key-value 的方式來表達數據。

（2）JSON 的Key 必須包裹在一個雙引號中。

（3）相關數據格式：①數字，包含浮點數和整數；②字符串，需要包裹在雙引號中；③Bool 值，true 或者false；④數組，需要包裹在方括號中[]；⑤對象，需要包裹在大括號中{}；⑥Null。

2.1.1.1 app.json 文件。在這一項目的根目錄中可以看到有一個app.json 文件，這是用來對小程序進行全局配置，并且通過編寫邏輯語言來實現對頁面文件路徑的設置、窗口表現的設置、網絡超時時間的設置、多tab 的設置。

借助《微信官方文檔·小程序部分》，可以查詢到如圖1 所示的包含部分常用配置選項的app.json 文件樣式，以此為基礎研究“庠序”課程表在app.json 部分的編寫。

圖1 常用配置選項app.json 文件樣式

其中pages 為頁面路徑列表，Window 為全局的默認窗口表現，tabBar 為底部tab 欄的表現，NetworkTimeout 為網絡超時時間，debug 為是否開啟debug 模式，圖1。

2.1.1.2 page.json 頁面配置文件。page.json 是用來表示pages/logs 目錄下的logs.json 這類和小程序頁面相關的配置。

以頁面顏色為例，如果準備將“庠序”課程表小程序的整個風格設計為淡藍色調，那么只需要app.json 里編入即可。但面對不同人群的審美需要，設計“庠序”課程表小程序風格的實際情況自然不可能為單一色調，且為了方便用戶區分不同功能分區，我們還應當設計多種色彩，這里就需要用到page.json，獨立定義每個頁面的一些屬性，包括色調與是否允許下拉刷新等。這一部分的編寫格式如圖2 所示。

圖2 頁面配置文件編寫格式

其中，navigationBarBackgroundColor 為導航欄背景顏色，編撰格式為“#000000”，navigationBarTextStyle 為導航欄標題顏色，圖2 所示即為黑色導航欄標題，navigationBarTitleText 為導航欄標題文字內容，backgroundColo 為窗口的背景色，編撰格式為“#000000”，backgroundTextStyle 為下拉loading 的樣式，圖2 所示即為“light”樣式。

2.1.2 WXML 模板文件

WXML 由標簽、屬性等構成，相當于是網頁編程采用的HTML，用來描述當前頁面的結構。如圖3 所示，打開pages/index/index.wxml，會呈現以下內容。

圖3 WXML 模板文件頁面結構

在WXML 寫入對應的組件標簽名字就可以把該組件顯示在界面上，如圖3 所示的圖像覆蓋，獲取昵稱等功能。

2.1.3 WXSS 樣式文件

WXSS 相當于網頁編程中的CSS，并且具備了CSS 大部分的特性，json 文件中區分app，page 的概念相同，可以寫一個app.wxss 作為“庠序”課程表的全局樣式——作用于“庠序”課程表的所有頁面，或者選擇局部頁面樣式page.wxss 對“庠序”課程表地某一個頁面進行設置。

2.1.4 JS 腳本邏輯文件

JS 腳本是專門適用于互聯網交互特性的部分，讓“庠序”課程表可以與用戶做交互，響應用戶的點擊而非單純展示信息。

首先設置一個交互按鍵button 按鈕，如圖4 所示。

圖4 交互按鈕

2.2 后臺數據處理

2.2.1 訪問數量

通過查看最近訪問數量，并進行橫向對比，我們可以得出用戶對“庠序”課程表的訪問是有一定規律的。通過對其的分析，即可把握住“庠序”課程表的發展方向，為其良好存活與發展奠定基礎。

2.2.2 推廣效果

若說訪問數量的時間分布說明了推廣的最佳時期，那么如何推廣，這是后臺數據分析需要關注的另一個方面。

增長的用戶是否是因為我們的推廣而選擇使用“庠序”課程表，這是需要關注的問題。

無論是小程序碼，還是分享到群，或者在大V 的公眾號中做了公關。假如用戶快速增加，我們首先要做的是通過“來源分析”分析以上的推廣方法，哪一種是最好的，不僅節約經濟成本，同時還提高了效用率，做到最高效的推廣。

2.2.3 用戶粘性

這是“庠序”課程表能否長久存活的最關鍵數據，若是“庠序”課程表的用戶粘性不強，那么用戶增長再快再多那也只是鏡中花。

在這一方面，主要通過以下幾個方面進行分析，新增留存，訪問時長以及訪問頁面。

2.2.3.1 新增留存。新增留存：表征了用戶訪問小程序以后的再次訪問的概率。這個指標最能直觀表現小程序對用戶的吸引力，通過新增留存我們可以分析出“庠序”課程表是否真正吸引到了用戶群體，是否在同行競爭中具有優勢。

2.2.3.2 訪問時長。代表了用戶對“庠序”課程表的喜愛程度，停留時間越長，表示“庠序”課程表對用戶得吸引力越大。

2.2.3.3 訪問頁面。訪問頁面數據是指小程序各個頁面的訪問人數，這個指標中給出的數據包含的信息量非常大，通過分析能夠更加直觀感受到產生用戶粘性的是哪一個板塊，有針對性的對板塊進行更新優化，有利于保持用戶粘性，并且可以以此為宣傳，發展新用戶。

3 結論

當前，高校課程表并未完全實現現代化、信息化，“庠序”課程表的構建有助于彌補這一空白區。該應用從實際出發，切實了解大學生及大學教師對課程表的需求，以課程查詢、學術報告會查詢、公選課查詢、校園活動查詢為四大基礎模塊，公益活動、校園社區、兼職信息等為待補充模塊，涵蓋師生對校園信息的日常需要。同時，“庠序”課程表緊扣“好的大學沒有圍墻”的理念，充分利用高校課程資源，搭建信息庫，將信息進行有效傳遞，讓班級之間、專業之間、學院之間、學校之間再無信息屏障。