林沛聰 楊楷環(huán) 張火源 張國(guó)杰

摘要：過(guò)去，人們接收新鮮的訊息往往是通過(guò)文字或者長(zhǎng)視頻等形式，相比較這些需要花費(fèi)一定時(shí)間去看的內(nèi)容，短視頻的內(nèi)容要更加多元化且不受空間和時(shí)間的限制，同時(shí)用戶還擁有更多的自主選擇觀看權(quán)。為了讓更多的用戶花費(fèi)更少的時(shí)間，了解更多的資訊，設(shè)計(jì)了互聯(lián)網(wǎng)+移動(dòng)APP的短視頻系統(tǒng)——校瞳。該文章主要是通過(guò)介紹校瞳APP的開(kāi)發(fā)方法及實(shí)現(xiàn)的具體步驟。

關(guān)鍵詞：短視頻;用戶;校瞳;Java;Ionic3.x

中圖分類號(hào)：TP37 文獻(xiàn)標(biāo)識(shí)碼：A

文章編號(hào)：1009-3044（2019）32-0224-04

1背景

隨著互聯(lián)網(wǎng)市場(chǎng)高速的發(fā)展，人們娛樂(lè)的方式發(fā)生了翻天覆地的變化，基于移動(dòng)環(huán)境下的“短視頻”類的APP迅速崛起，成了信息交換與傳遞的主流方式之一，并且呈現(xiàn)出一定的傳播規(guī)律。

通過(guò)分析，發(fā)現(xiàn)缺少一個(gè)主要的面向大學(xué)生分享生活以及從中獲取自己需要的視頻應(yīng)用軟件，讓大學(xué)生能實(shí)時(shí)的分享自己的生活以及通過(guò)該應(yīng)用知道其他的大學(xué)生生活中有趣的事情之外，還能從中了解社團(tuán)以及學(xué)校發(fā)布的通知，同時(shí)周邊店家也能從中發(fā)布兼職信息以及學(xué)校招聘會(huì)企業(yè)發(fā)布招聘人才信息，減低商家招聘成本，實(shí)現(xiàn)人職相匹。與此相關(guān)，一個(gè)“校瞳”項(xiàng)目誕生了。

2總體設(shè)計(jì)

2.1“校瞳”的架構(gòu)設(shè)計(jì)

“校瞳”APP分別有“學(xué)生”“教師”“院系”“社團(tuán)”“企業(yè)”和“家長(zhǎng)”共六大角色構(gòu)建成。

對(duì)于學(xué)生：學(xué)生可以在線進(jìn)行課堂學(xué)習(xí)，分享娛樂(lè)性的文字和視頻，查看院系和社團(tuán)活動(dòng)、講座信息、選修課程介紹、周邊店鋪的兼職信息以及企業(yè)招聘信息。

對(duì)于教師：教師可以進(jìn)行課堂直播供學(xué)生在線學(xué)習(xí)，以及通過(guò)該軟件發(fā)布選課信息和進(jìn)行簡(jiǎn)單對(duì)選修課程的介紹;分享老師最新的研究成果等。

對(duì)于院系或社團(tuán)：院系可以進(jìn)行講座信息的通知和宣傳;社團(tuán)可以發(fā)布自己社團(tuán)活動(dòng)、展示社團(tuán)自身的魅力。

對(duì)于學(xué)校周邊的店鋪：學(xué)校周邊的店鋪發(fā)布兼職信息沒(méi)有一個(gè)完整的平臺(tái)，同時(shí)也給勤工助學(xué)的同學(xué)減少兼職困擾，通過(guò)該平臺(tái)店家可以高效找到兼職者，同時(shí)對(duì)自己店家活動(dòng)進(jìn)行宣傳。

對(duì)于企業(yè)：每年學(xué)校舉行的招聘會(huì)，企業(yè)都只能通過(guò)狹窄的校園擺攤或者是學(xué)生主動(dòng)咨詢的渠道提高企業(yè)的知名度，企業(yè)通過(guò)該平臺(tái)，可提高自身的曝光率，通過(guò)影視宣傳能更準(zhǔn)確并更快捷找到與崗位剛匹配的人才，同時(shí)學(xué)生也能根據(jù)自身的特點(diǎn)找到理想企業(yè)。

對(duì)于家長(zhǎng)：需要給家里上小學(xué)、中學(xué)的孩子找家教的家長(zhǎng)可以通過(guò)改平臺(tái)，發(fā)布家教相關(guān)信息，為家里的小孩找到合適的家教。

2.2“校瞳”的功能設(shè)計(jì)

“校瞳”系統(tǒng)有三大核心功能模塊，分別是：“用戶功能模塊”，“視頻功能模塊”，“評(píng)論功能模塊”。這三大核心功能模塊相對(duì)應(yīng)的作用如下。

2.2.1用戶管理模塊

1）注冊(cè)功能：用戶需要注冊(cè)，綁定手機(jī)號(hào)進(jìn)行短信驗(yàn)證可完成注冊(cè)操作。

2）登錄功能：用戶注冊(cè)成功后可進(jìn)行登錄操作，登錄成功即可進(jìn)入系統(tǒng)。

3）查詢?cè)撌謾C(jī)是否已存：注冊(cè)操作前可進(jìn)行手機(jī)號(hào)是否已被注冊(cè)驗(yàn)證。

4）獲取當(dāng)前用戶信息：登錄后可獲得當(dāng)前用戶的信息。

5）修改用戶普通信息：登錄后可修改當(dāng)前用戶的信息。

6）修改用戶頭像：登錄后可修改當(dāng)前用戶的頭像。

7）退出功能：注銷(xiāo)當(dāng)前賬號(hào)。

2.2.2視頻管理模塊

1）視頻發(fā)布功能：登錄后可上傳視頻供校友觀看。

2）視頻刪除功能：登錄后可刪除自己之前上傳的視頻。

3）視頻分享功能：登錄后可分享他人上傳的視頻。

4）視頻舉報(bào)功能：登錄后可舉報(bào)他人的違規(guī)視頻。

5）視頻查詢功能：登錄后可按條件查詢特定種類的視頻。

2.2.3評(píng)論管理模塊

1）評(píng)論發(fā)布功能：登錄后可評(píng)論他人的視頻。

2）評(píng)論刪除功能：登錄后可刪除曾經(jīng)評(píng)論他人的評(píng)論，被評(píng)論的用戶也可以及進(jìn)行刪除評(píng)論。

2.3數(shù)據(jù)庫(kù)概要設(shè)計(jì)

“校瞳”的數(shù)據(jù)庫(kù)概念設(shè)計(jì)主要針對(duì)三大功能模塊建立相關(guān)的數(shù)據(jù)表進(jìn)行“增刪改查”等操作。具體可以劃分為：

1）用戶功能模塊相關(guān)數(shù)據(jù)表;

2）視頻功能模塊相關(guān)數(shù)據(jù)表;

3）評(píng)論功能模塊相關(guān)數(shù)據(jù)表。

3設(shè)計(jì)與實(shí)現(xiàn)

3.1歡迎、登錄與注冊(cè)頁(yè)面的設(shè)計(jì)

在“校瞳“APP的歡迎頁(yè)面中，其背景顏色是從白色到灰色漸變，由“校瞳”的LOGO和感嘆號(hào)里面的Slogan組成，呈現(xiàn)出簡(jiǎn)潔的藝術(shù)感。無(wú)論是“校瞳“LOGO，又或是標(biāo)語(yǔ)“透過(guò)你的眼發(fā)現(xiàn)你”，都標(biāo)志著這是一個(gè)“短視頻類”軟件。其效果圖如圖1所示。

此外，在“校瞳”APP的注冊(cè)與登錄頁(yè)面中，由注冊(cè)與登陸的條件和注冊(cè)與登陸的角色兩部分組成。不同的注冊(cè)角色，需要填寫(xiě)的注冊(cè)條件各不相同。具體由“學(xué)生”“家長(zhǎng)”“教師”“社團(tuán)”“院系”“企業(yè)”這六大角色所組成。

當(dāng)角色為“學(xué)生”或者“家長(zhǎng)”時(shí)，需要填寫(xiě)學(xué)校、昵稱、手機(jī)號(hào)碼、驗(yàn)證碼、密碼這五大部分;當(dāng)角色為“教師”或者“社團(tuán)”又或者“院系”時(shí)，需要填寫(xiě)學(xué)校、用戶名、郵箱、密碼、相關(guān)證明材料等資料;當(dāng)角色為“企業(yè)”時(shí)，需要填寫(xiě)企業(yè)名稱、地址、郵箱、密碼、相關(guān)證明等資料。其效果圖如圖2所示。

當(dāng)用戶填寫(xiě)完成相對(duì)應(yīng)的注冊(cè)資料的時(shí)候，“注冊(cè)”按鈕才可被點(diǎn)擊，再跳到登錄頁(yè)面。其效果圖如圖3所示。

3.2首頁(yè)和視頻詳情頁(yè)的設(shè)計(jì)

在“校瞳”APP的首頁(yè)中，采用了簡(jiǎn)約的界面設(shè)計(jì)，讓用戶感受一種簡(jiǎn)約美，讓APP更耐看！其次，首頁(yè)主要分為“全國(guó)”和“本校”兩大部分，而這兩大部分中，又分別分為了“校園招聘”“社團(tuán)或院系活動(dòng)”“名家講堂”“文娛活動(dòng)”“選課導(dǎo)向”“家教兼職”“在線課堂”這七小部分，每一小部分都有由其相對(duì)應(yīng)的角色發(fā)布的短視頻，可供用戶觀看。然而，在“全國(guó)”和“本?！边@兩大部分的主要區(qū)別在于，“全國(guó)”是用戶可以看到除了本校園以外，其他學(xué)校用戶所發(fā)布的短視頻;而“本?！本褪怯脩舯拘@的用戶所發(fā)布的短視頻。其效果圖如圖4所示。

在“校瞳”APP的視頻詳情頁(yè)中，用戶除了可以觀看短視頻外，還可以對(duì)此短視頻進(jìn)行點(diǎn)贊，又或者進(jìn)行評(píng)論。其次，還可以對(duì)相對(duì)應(yīng)的評(píng)論進(jìn)行回復(fù)。

而且，當(dāng)用戶發(fā)現(xiàn)此短視頻有出現(xiàn)違規(guī)情況，也可進(jìn)行視頻的舉報(bào)。后端管理員會(huì)收到用戶所舉報(bào)的信息，做出相對(duì)應(yīng)的排查。其效果圖如圖5所示。

3.3具體功能實(shí)現(xiàn)

3.3.1前端的核心代碼

在“校瞳”APP中，前端的ionic 3.X默認(rèn)采用懶加載機(jī)制，什么是懶加載呢？當(dāng)?shù)谝淮芜M(jìn)入應(yīng)用，會(huì)加載app.module，如果沒(méi)有采用懶加載，那么app.module里的所有東西都會(huì)被加載，很顯然這是不太合適的，因?yàn)槔锩娴慕M件和服務(wù)在第一次進(jìn)入應(yīng)用時(shí)并沒(méi)有全部使用，可能只使用了很少的一部分，那么對(duì)于比較大型的應(yīng)用來(lái)說(shuō)，由于頁(yè)面和其他的服務(wù)，指令，管道比較多，就會(huì)造成比較用戶體驗(yàn)不好的影響。這個(gè)時(shí)候需要把應(yīng)用分為一個(gè)個(gè)module，各自引入自己用到的東西，不要管別的模塊。那么第一次進(jìn)入應(yīng)用，就只加載很少的app.module和root page對(duì)應(yīng)的module，當(dāng)進(jìn)入其他頁(yè)面的時(shí)候，才會(huì)去加載相應(yīng)的module。這樣的好處是項(xiàng)目代碼結(jié)構(gòu)清晰，易于維護(hù)，易于開(kāi)發(fā)，而且第一次加載速度比較快。當(dāng)使用ionic 3.X的CLI來(lái)新建頁(yè)面，默認(rèn)的會(huì)是懶加載的結(jié)構(gòu)，甚至不止頁(yè)面，所有的component，service，directive都默認(rèn)的是懶加載。

此外，在“校瞳”APP中，前端也使用了ionic 3.X的Storage本地緩存，可以很容易地存儲(chǔ)鍵值對(duì)和JSON對(duì)象。Storage在底層使用多種存儲(chǔ)引擎，根據(jù)運(yùn)行平臺(tái)選擇最佳的存儲(chǔ)方式。當(dāng)運(yùn)行在Native模式時(shí)，Storage將優(yōu)先使用SQLite。當(dāng)運(yùn)行在Web中或作為PWA應(yīng)用時(shí)，Storage將根據(jù)你確定的優(yōu)先級(jí)使用IndexedDB、WebSQL或localstorage。

當(dāng)用戶在“校瞳”APP對(duì)某個(gè)視頻進(jìn)行評(píng)論操作的時(shí)候，后臺(tái)先將被評(píng)論的視頻ID、評(píng)論者id、評(píng)論內(nèi)容、該條評(píng)論創(chuàng)建時(shí)間等數(shù)據(jù)一次通過(guò)控制層、業(yè)務(wù)邏輯層傳到數(shù)據(jù)庫(kù)交互層。其次，利用MyBatis框架進(jìn)行數(shù)據(jù)庫(kù)操作，將數(shù)據(jù)存儲(chǔ)到數(shù)據(jù)庫(kù)對(duì)應(yīng)的表中。

4結(jié)束語(yǔ)

“校瞳”是一個(gè)完整的視頻分享APP，在用戶模塊，視頻模塊，評(píng)論模塊三大模塊實(shí)現(xiàn)之后，已經(jīng)具備了一個(gè)手機(jī)APP所需的功能。其次，“校瞳”系統(tǒng)的角色架構(gòu)清晰明確，大體分為“學(xué)生”“家長(zhǎng)”“教師”“社團(tuán)”“院系”“企業(yè)”這六大角色。各個(gè)角色都有其相對(duì)應(yīng)的功能與操作準(zhǔn)則。

它使我們可以隨時(shí)隨地享受軟件樂(lè)趣，讓我們擺脫沉重的日常生活。該軟件的主界面力求美觀，令人愉悅，提升用戶對(duì)軟件的興趣。該軟件的控制模塊易于理解和操作，為用戶提供良好的軟件環(huán)境。它了解用戶的需求，了解工作流程以及可能出現(xiàn)的問(wèn)題。