“互聯(lián)網(wǎng)+支教”平臺(tái)的設(shè)計(jì)與實(shí)現(xiàn)

王志飛 梁曉琳 張宇奇

摘? 要：國家一向重視教育公平，注重教育資源均衡分配的問題。國外致力于發(fā)展支教的組織和志愿者，支教活動(dòng)主要開展于亞非拉等欠發(fā)達(dá)的國家。許多國際組織都會(huì)吸納包括大學(xué)生在內(nèi)的志愿者參與支教活動(dòng)。大范圍支教活動(dòng)的有序開展，離不開支教平臺(tái)的助力。為此，文章設(shè)計(jì)開發(fā)一款“互聯(lián)網(wǎng)+支教”平臺(tái)，將大學(xué)生作為支教主力軍。大學(xué)生支教平臺(tái)不僅為大學(xué)生提供社會(huì)實(shí)踐的機(jī)會(huì)，還能夠彌補(bǔ)城鄉(xiāng)教育資源分配不均的劣勢(shì)。

關(guān)鍵詞：互聯(lián)網(wǎng)+;大學(xué)生支教;平臺(tái)設(shè)計(jì)

中圖分類號(hào)：TP311? ? ? ? 文獻(xiàn)標(biāo)識(shí)碼：A文章編號(hào)：2096-4706（2022）03-0009-06

Design and Implementation of “Internet + Volunteer Education” Platform

WANG Zhifei， LIANG Xiaolin， ZHANG Yuqi

（Shandong Huayu University of Technology， Dezhou? 253034， China）

Abstract： The state has always attached importance to education equity and the balanced distribution of education resources. Foreign countries are committed to developing education support organizations and volunteers， education support activities are mainly carried out in less developed countries such as Asia， Africa and Latin America. Many international organizations will attract volunteers， including college students， to participate in education support activities. The orderly development of large-scale education support activities is inseparable from the help of the education support platform. Therefore， this paper designs and develops an “Internet + volunteer education” platform， and takes college students as the main force of supporting teaching. The college students support teaching platform not only provides opportunities of social practice for college students， but also can make up for the disadvantage of uneven distribution of educational resources between urban and rural areas.

Keywords： Internet+; college students support teaching; platform design

0? 引? 言

隨著互聯(lián)網(wǎng)技術(shù)的不斷發(fā)展，新媒體的應(yīng)用越來越廣泛，互聯(lián)網(wǎng)+支教具有靈活性的優(yōu)點(diǎn)，通過引入線上支教來推動(dòng)支教學(xué)質(zhì)量的提高，不但給大學(xué)生的社會(huì)實(shí)踐提供了新視角，更是符合新時(shí)代的支教需求。在“互聯(lián)網(wǎng)+”背景下，計(jì)算機(jī)技術(shù)應(yīng)該與支教方式高度融合，一改傳統(tǒng)的支教模式，打破支教活動(dòng)受時(shí)空限制的弊端。本文從網(wǎng)站建設(shè)的角度闡述基于支教平臺(tái)的功能設(shè)計(jì)、交互設(shè)計(jì)、界面設(shè)計(jì)，整合優(yōu)質(zhì)教育資源，實(shí)現(xiàn)大學(xué)生高效支教，提高支教質(zhì)量，彌補(bǔ)傳統(tǒng)支教的不足。

1? 支教現(xiàn)狀

目前國內(nèi)支教的發(fā)展情況并不理想，傳統(tǒng)支教模式存在許多弊端。支教活動(dòng)常發(fā)生在偏遠(yuǎn)地區(qū)，這些地區(qū)路途遙遠(yuǎn)、地形復(fù)雜、交通不便、自然災(zāi)害頻繁等，傳統(tǒng)方式的支教非常耗費(fèi)人力財(cái)力，支教成本較高。在支教人員監(jiān)管方面，許多支教組織管理松散，沒有明確的規(guī)章制度去挑選和約束支教人員，導(dǎo)致支教隊(duì)伍的流動(dòng)性大、教育能力差，建立健全的管理制度迫在眉睫。在支教活動(dòng)組織方面，缺乏規(guī)范性的支教活動(dòng)計(jì)劃，活動(dòng)過程中遇到的突發(fā)問題難以及時(shí)得到妥善解決，一定程度上影響了支教效果。在支教區(qū)資源方面，由于支教區(qū)經(jīng)濟(jì)落后，存在電力不足等客觀條件，無法使用一些現(xiàn)代化的教育設(shè)備如電腦、多媒體等。很多授課想法都無法實(shí)現(xiàn)，學(xué)生也不能更好地理解和掌握復(fù)雜的知識(shí)點(diǎn)，限制了知識(shí)的傳播與共享。

2? “互聯(lián)網(wǎng)+支教”平臺(tái)的設(shè)計(jì)

2.1? 平臺(tái)簡(jiǎn)介

支教平臺(tái)是一個(gè)針對(duì)大學(xué)生到偏遠(yuǎn)地區(qū)支教的平臺(tái)，旨在提高支教質(zhì)量，促進(jìn)教育資源的合理配置。支教平臺(tái)采取按需選擇、就近分配的原則，平臺(tái)會(huì)根據(jù)距離遠(yuǎn)近，對(duì)提交申請(qǐng)的大學(xué)生與學(xué)校相匹配后進(jìn)行優(yōu)先推送。對(duì)于路程較遠(yuǎn)而難以到達(dá)的支教區(qū)，我們采用線上授課的方式進(jìn)行支教。支教平臺(tái)作為連接支教大學(xué)生與支教區(qū)學(xué)校的橋梁，在平臺(tái)上，大學(xué)生與學(xué)?？梢灾苯勇?lián)系。支教區(qū)的學(xué)校也可以直接篩選學(xué)生的簡(jiǎn)歷，挑選優(yōu)秀的學(xué)生，與學(xué)生進(jìn)行直接對(duì)話。大學(xué)生通過支教平臺(tái)進(jìn)行信息注冊(cè)登錄、提交支教申請(qǐng);高校審查驗(yàn)證申請(qǐng)者身份和詳細(xì)信息;政府相關(guān)部門對(duì)支教大學(xué)生和支教區(qū)學(xué)校進(jìn)行復(fù)查和審批，審查通過后，方可進(jìn)行支教。支教平臺(tái)上還設(shè)立專門的公益板塊——希望小屋，可以幫助支教區(qū)的學(xué)生獲取慈善贊助，為他們爭(zhēng)取學(xué)習(xí)教材和相關(guān)資料以及優(yōu)質(zhì)的教學(xué)環(huán)境。85B84264-B065-4501-B6D1-16683D056D0B

2.2? 平臺(tái)框架及流程設(shè)計(jì)

2.2.1? 功能框架

大學(xué)生支教平臺(tái)的功能包括系統(tǒng)相關(guān)、總覽時(shí)訊、功能板塊、希望小屋四個(gè)模塊。在系統(tǒng)相關(guān)模塊中，用戶可選擇以學(xué)校身份或?qū)W生身份登入，進(jìn)行學(xué)校身份或?qū)W生身份的注冊(cè)和信息錄入，點(diǎn)擊頁面中的四個(gè)不同選項(xiàng)，可進(jìn)入對(duì)應(yīng)的功能模塊。在總覽時(shí)訊模塊中，左右滑動(dòng)可以查看主題，點(diǎn)擊主題，進(jìn)入對(duì)應(yīng)頁面，上下滑動(dòng)可查看內(nèi)容。在時(shí)訊資訊內(nèi)容結(jié)束的位置，可左右滑動(dòng)查看其他主題。在功能板塊模塊中，幫助用戶解決相關(guān)疑問，有助于用戶獲得更好的使用體驗(yàn)，同時(shí)也能看到國內(nèi)以及國際支教組織的實(shí)時(shí)資訊。在希望小屋模塊中，平臺(tái)計(jì)劃與社會(huì)愛心人士聯(lián)手，旨在給支教地區(qū)的孩子們提供幫助，鑄造學(xué)子們的成長(zhǎng)之路。大學(xué)生支教平臺(tái)功能清單如圖1所示。

2.2.2? 界面設(shè)計(jì)

在支教平臺(tái)界面色彩設(shè)計(jì)上，通過對(duì)支教服務(wù)圖標(biāo)的引用分析，采用以農(nóng)村支教區(qū)特色為主的界面背景設(shè)計(jì)。通過對(duì)支教區(qū)特色的再創(chuàng)作，基于現(xiàn)代的審美和扁平化的設(shè)計(jì)追求，實(shí)現(xiàn)了現(xiàn)代風(fēng)格的界面背景設(shè)計(jì)。將個(gè)性突出的界面背景展現(xiàn)給用戶，是支教文化的另一種體現(xiàn)。界面背景設(shè)計(jì)主要使用淺色調(diào)，使得界面整體效果較清新活躍，同時(shí)搭配較深顏色的字體，增加顏色深淺對(duì)比，有利于用戶在室外強(qiáng)光條件下的使用與閱讀，也便于引起用戶在色彩上的共鳴，從而提高用戶的使用體驗(yàn)。支教平臺(tái)界面設(shè)計(jì)的字體部分以黑體、宋體為主，在視覺感受上更清晰，更易于閱讀，如圖2、圖3、圖4所示。

2.2.3? 首頁設(shè)計(jì)

首頁主要是對(duì)本平臺(tái)的系統(tǒng)介紹和分類，包含logo、導(dǎo)航設(shè)計(jì)、banner設(shè)計(jì)、內(nèi)容設(shè)計(jì)和底部信息版權(quán)設(shè)計(jì)。其中l(wèi)ogo主要通過Photoshop軟件完成png格式的圖片，導(dǎo)航設(shè)計(jì)主要通過HTML的ul和li實(shí)現(xiàn)，并添加二級(jí)菜單，方便網(wǎng)站的SEO優(yōu)化，另外可通過flex實(shí)現(xiàn)橫向并排布局。導(dǎo)航的內(nèi)容全部添加超級(jí)鏈接并鏈接到相應(yīng)的網(wǎng)頁文件，另外，為方便用戶使用，我們通過使用div和submit定義創(chuàng)建登錄和注冊(cè)按鈕，并通過CSS進(jìn)行優(yōu)化。核心代碼如圖5所示。

頁面banner效果主要用來表達(dá)支教地區(qū)的各項(xiàng)活動(dòng)，使支教者能夠更好地了解支教地區(qū)的自然環(huán)境和區(qū)域建設(shè)。我們?cè)谥黜摰腷anner部分插入輪播效果，主要效果是底部點(diǎn)擊切換和左右兩側(cè)點(diǎn)擊輪換，亦可實(shí)現(xiàn)鼠標(biāo)經(jīng)過自動(dòng)播放。本模塊主要通過bootstrap框架來完成，可以下載bootstrap并安裝相關(guān)的運(yùn)行環(huán)境，通過外部調(diào)用JavaScript程序獨(dú)立完成CSS部分和HTML部分，代碼為：

<！--輪播 -->

頁面內(nèi)容主要包含系統(tǒng)相關(guān)、總覽時(shí)訊、功能板塊、希望小屋，其中頁面布局主要通過div和bootstrap框架來完成，通過CSS中的flex彈性盒子來實(shí)現(xiàn)模塊布局?？紤]到首頁內(nèi)容過長(zhǎng)用戶在瀏覽時(shí)不方便，我們通過div盒子創(chuàng)建快速導(dǎo)航欄，并通過position定位屬性將其固定在右下方，當(dāng)用戶想要瀏覽其中的一個(gè)內(nèi)容時(shí)，可以通過快速導(dǎo)航欄快速定位到想要瀏覽的地方。為了美化頁面，我們?cè)诩t玫瑰計(jì)劃中為圖片添加動(dòng)畫效果，通過改變div的位置、overflow：hidden溢出隱藏和a：hover相互配合，實(shí)現(xiàn)當(dāng)鼠標(biāo)經(jīng)過時(shí)有文字提示，其中HTML部分代碼和CSS部分代碼為：

HTML部分代碼