虞嘉龍，高子卓，姚建華，李 攀，2*

（1.防災(zāi)科技學(xué)院 信息工程學(xué)院，河北 三河 065201；2.河北省地震災(zāi)害防御與風(fēng)險(xiǎn)評價(jià)重點(diǎn)實(shí)驗(yàn)室，河北 三河 065201）

隨著科技和互聯(lián)網(wǎng)的飛速發(fā)展，5G時(shí)代到來的今天，互聯(lián)網(wǎng)技術(shù)已成為人們?nèi)粘Ｉ钪胁豢苫蛉钡牟糠?。在線教育，網(wǎng)上辦公等等也應(yīng)運(yùn)而生，我們就開始設(shè)想是否防震減災(zāi)科普也可以通過互聯(lián)網(wǎng)的形式進(jìn)行展現(xiàn)呢。再加上目前人們對于災(zāi)害的認(rèn)知不足以及近幾年的自然災(zāi)害頻發(fā)，為了使人們能夠有效主動地去認(rèn)識災(zāi)害的危害，學(xué)習(xí)災(zāi)難來臨時(shí)的應(yīng)對措施，我們團(tuán)隊(duì)決定以Unity3D虛擬引擎技術(shù)為核心制作一款災(zāi)害科普平臺。通過該防震減災(zāi)虛擬仿真科普平臺讓人們可以隨時(shí)隨地獲取科學(xué)、準(zhǔn)確、權(quán)威的海量災(zāi)害科普知識。

防震減災(zāi)虛擬仿真科普平臺，在這個(gè)平臺中我們決定引入地震、臺風(fēng)、火災(zāi)、洪澇等災(zāi)害的相關(guān)知識，同時(shí)加入一些關(guān)于災(zāi)害科普活動的新聞，以及面對災(zāi)害我們應(yīng)該如何做的文章。我們計(jì)劃通過AR災(zāi)害體驗(yàn)的形式搭建三維模型來實(shí)現(xiàn)人機(jī)交互操作，強(qiáng)化用戶參與度的興趣體驗(yàn)、鼓勵(lì)用戶探索性的創(chuàng)新體驗(yàn)、給予用戶親密感的互動體驗(yàn)、提升用戶滿意度的情感體驗(yàn)。在內(nèi)容上參考了中國地震局的網(wǎng)站內(nèi)容和《地震避險(xiǎn)與自救互救案例與指南》等書本的內(nèi)容資料，在網(wǎng)站和APP中進(jìn)行地震自救互救、地震的原理、震級的分類、地震目錄等資料的展示與分享，旨在提升人們對于災(zāi)害的認(rèn)識與自救互救的意識。

1 技術(shù)介紹

防震減災(zāi)虛擬仿真科普平臺，包括網(wǎng)頁端、手機(jī)APP和基于安卓系統(tǒng)開發(fā)的AR災(zāi)害體驗(yàn)館3個(gè)模塊。手機(jī)APP以C#為基礎(chǔ)語言，基于Unity3D為開發(fā)平臺，以AR技術(shù)為拓展技術(shù)，利用Unity提供的Playerprefs進(jìn)行數(shù)據(jù)的保存和讀取，發(fā)布于安卓系統(tǒng)；AR災(zāi)害體驗(yàn)館，基于Unity3D和Vuforia進(jìn)行開發(fā)，以C#開發(fā)語言為核心，制作應(yīng)用于安卓平臺的地震、火災(zāi)和洪水場景的災(zāi)害體驗(yàn)游戲。

本項(xiàng)目使用了Unity3D游戲引擎和Vuforia AR制作平臺提供的插件。其中Unity3D是Unity Technologies公司制作的一個(gè)讓玩家輕松創(chuàng)建諸如三維視頻游戲、建筑可視化、實(shí)時(shí)三維動畫等類型互動內(nèi)容的多平臺的綜合型游戲開發(fā)工具。Vuforia是實(shí)現(xiàn)增強(qiáng)現(xiàn)實(shí)技術(shù)的平臺，開發(fā)者可以使用它提供的平面識別、空間識別、圖片識別等完成AR產(chǎn)品制作，本項(xiàng)目主要通過使用Vuforia為Unity3D專供的插件，完成了平面識別，圖片識別展示AR。網(wǎng)頁端則主要使用HTML+CSS+JavaScript進(jìn)行頁面制作與展示，同時(shí)使用Unity提供的webgl平臺進(jìn)行網(wǎng)頁上的地震科普游戲制作；手機(jī)端則主要使用Unity3D和C#語言進(jìn)行手機(jī)APP的邏輯處理，同時(shí)加入了AR災(zāi)害體驗(yàn)館的功能，讓用戶在體驗(yàn)圖文信息的同時(shí)，可以聲臨其境地感受災(zāi)害。

2 防震減災(zāi)虛擬仿真科普平臺總體設(shè)計(jì)

在防震減災(zāi)虛擬仿真科普平臺中，分別制作了便于使用電腦的用戶訪問的網(wǎng)頁端和方便安卓用戶使用的手機(jī)APP形式的科普平臺，在網(wǎng)頁端中增加了地震知識科普游戲，通過游戲的形式加深用戶對地震來臨時(shí)的處理辦法的印象，還普及了歷史上的自然災(zāi)害事件，以及自然災(zāi)害發(fā)生的原理等科普知識。在安卓手機(jī)APP中，加入了AR災(zāi)害模擬館，以強(qiáng)化用戶的操作體驗(yàn)和對災(zāi)害的真實(shí)認(rèn)知。

2.1 整體策劃

防震減災(zāi)虛擬仿真科普平臺，在最初的設(shè)計(jì)理念中，就是一個(gè)集網(wǎng)頁端、手機(jī)端、AR于一體的科普展示平臺，我們團(tuán)隊(duì)準(zhǔn)備在這個(gè)平臺中加入災(zāi)害科普知識展示、AR災(zāi)害體驗(yàn)館、，地震科普游戲、日常醫(yī)療視頻、地震科普知識、自然災(zāi)害新聞以及地震目錄各個(gè)功能點(diǎn)。

2.2 功能設(shè)計(jì)

防震減災(zāi)虛擬仿真科普平臺在網(wǎng)頁端使用了HTML+CSS+JavaScript的組合，在APP上使用了Unity3D、Microsfot Visual Studio Code、Vuforia、PhotoShop等軟件，也使用了NGUI和UGUI等插件。在APP端方面進(jìn)行的頁面設(shè)計(jì)和頁面跳轉(zhuǎn)邏輯，不同功能的實(shí)現(xiàn)，內(nèi)容的展示，以及AR災(zāi)害體驗(yàn)館，主要使用Unity3D中的UI部件和C#語言進(jìn)行邏輯實(shí)現(xiàn)和制作完成。其中使用Microsfot Visual Studio Code進(jìn)行C#代碼的編寫，通過Vuforia制作AR游戲的部分內(nèi)容，在科普平臺上出現(xiàn)的圖片則主要使用PhotoShop進(jìn)行處理加工。

2.3 算法實(shí)現(xiàn)

2.3.1 視頻播放器

視頻播放器實(shí)現(xiàn)邏輯如圖1所示。

圖1 視頻播放器實(shí)現(xiàn)邏輯

在Unity中利用Slider UI組件創(chuàng)建2個(gè)Slider，通過獲取用戶點(diǎn)擊到的Slider位置，在Unity中響應(yīng)Slider值的變化將視頻同步到對應(yīng)位置上進(jìn)行播放，同時(shí)在播放過程中實(shí)時(shí)同步Preview Slider的位置，讓用戶看到進(jìn)度條隨播放進(jìn)度移動的效果。

2.3.2 APP展示邏輯

APP頁面跳轉(zhuǎn)邏輯實(shí)現(xiàn)如圖2所示。

圖2 APP頁面跳轉(zhuǎn)邏輯實(shí)現(xiàn)

在Unity中通過檢測運(yùn)行平臺，和獲取用戶點(diǎn)擊return和home鍵的操作，通過相應(yīng)的展示界面跳轉(zhuǎn)實(shí)現(xiàn)展示類手機(jī)APP的返回退出功能，同時(shí)通過在訪問其他頁面時(shí)，復(fù)原當(dāng)前頁面Slider初值的方式，完成APP展示功能的實(shí)現(xiàn)。

2.3.3 AR圖像識別

ARCamera綁定手機(jī)陀螺儀移動如圖3所示。

圖3 ARCamera綁定手機(jī)陀螺儀移動

在AR游戲中通過獲取手機(jī)陀螺儀移動參數(shù)的方式，綁定ARCamera的移動陀螺儀可以對轉(zhuǎn)動、偏轉(zhuǎn)的動作做很好的測量，這樣就可以精確分析判斷出使用者的實(shí)際動作以實(shí)現(xiàn)在游戲中模擬真實(shí)人物的移動，以將虛擬現(xiàn)實(shí)中的物體同步于現(xiàn)實(shí)世界的坐標(biāo)中，方便玩家進(jìn)行不止固定于一處的AR模擬。

3 防震減災(zāi)虛擬仿真科普平臺詳細(xì)設(shè)計(jì)

3.1 防震減災(zāi)虛擬仿真科普平臺網(wǎng)頁端

科普平臺信息架構(gòu)圖如圖4所示。

圖4 科普平臺信息架構(gòu)圖

3.1.1 網(wǎng)頁內(nèi)容

防震減災(zāi)虛擬仿真科普平臺網(wǎng)頁端主要使用了SpringBoot框架和semantic-ui進(jìn)行布局設(shè)計(jì)，主要介紹地質(zhì)災(zāi)害、氣象災(zāi)害、海洋災(zāi)害的種類，危險(xiǎn)與避震措施。還介紹了歷史上幾次的重大災(zāi)害事件和近期的一些實(shí)事熱點(diǎn)。

3.1.2 地震科普游戲

在網(wǎng)頁端加入了一個(gè)用Unity進(jìn)行開發(fā)，以webgl3D繪圖協(xié)議為支撐的網(wǎng)頁游戲，玩家可以通過控制小人在洗漱間、客廳、臥室、學(xué)校4個(gè)場景進(jìn)行游覽，在場景中還設(shè)置了提示點(diǎn)，當(dāng)人物移動到對應(yīng)點(diǎn)位上時(shí)，會相應(yīng)地觸發(fā)對應(yīng)的災(zāi)害事件，通過查看這些事件帶來的提示可以知道在地震時(shí)哪些地方是安全可靠的，哪些地方是充滿危險(xiǎn)，需要遠(yuǎn)離的。當(dāng)玩家充分了解到這些防震自救知識后，就可以選擇進(jìn)入下一個(gè)場景繼續(xù)游玩。

3.2 防震減災(zāi)虛擬仿真科普平臺APP

防震減災(zāi)虛擬仿真科普平臺APP主要使用了藍(lán)白簡潔風(fēng)格的界面設(shè)計(jì)，它包括首頁的導(dǎo)航欄，新聞?wù)故緳?，和虛擬、主頁、個(gè)人賬號3個(gè)分區(qū)。每個(gè)區(qū)域都有自己的展示內(nèi)容和功能。

3.2.1 引導(dǎo)界面

打開APP后，首先會進(jìn)入一個(gè)引導(dǎo)界面，主要介紹各種自然災(zāi)害的概述，在用戶查看這些信息后可以點(diǎn)擊“點(diǎn)擊進(jìn)入”正式進(jìn)入APP首頁。

3.2.2 首頁界面

首頁主要包括一些關(guān)于自然災(zāi)害的實(shí)事新聞，地震的原理介紹以及一些關(guān)于自然災(zāi)害救援的相關(guān)知識。其中實(shí)事新聞中的內(nèi)容是由中國地震局和中國地震臺網(wǎng)上發(fā)布的最新消息。災(zāi)害科普相關(guān)則是本團(tuán)隊(duì)通過查詢?yōu)暮ο嚓P(guān)的各類資料進(jìn)行統(tǒng)籌整合，加入到首頁中進(jìn)行展示。首頁界面如圖5所示。

圖5 首頁界面

3.2.3 個(gè)人界面

個(gè)人界面是加強(qiáng)用戶體驗(yàn)的一環(huán)，用戶可以通過注冊產(chǎn)生自己的個(gè)人賬號，在登錄過后個(gè)人頁面會根據(jù)用戶的訪問習(xí)慣在個(gè)人主頁上推薦感興趣的分區(qū)。這個(gè)界面中的登錄注冊管理的腳本代碼都是通過C#語言在VSCode編輯器中進(jìn)行編寫的，其中用戶的個(gè)人信息通過Unity提供的PlayerPref進(jìn)行存儲和讀取，進(jìn)行用戶資料的管理。

3.2.4 科普界面

科普界面是平臺的主要展示內(nèi)容，通過收錄不同期刊、新聞、科普文章中的內(nèi)容進(jìn)行整理收錄，給用戶提供便捷的信息查看方式。在該板塊中還實(shí)現(xiàn)了一邊播放視頻一邊在下面的內(nèi)容中瀏覽視頻中介紹相關(guān)知識點(diǎn)的功能。大震目錄，通過將數(shù)據(jù)存放在txt文檔中，通過相對的讀取形式，將每一年的地震信息展示在表格和地圖上，用戶可以通過點(diǎn)按地圖上對應(yīng)的點(diǎn)位，查看在那個(gè)點(diǎn)發(fā)生的地震信息（如：震級、深度、地理位置等）。

3.2.5 AR災(zāi)害體驗(yàn)館

在科普平臺的虛擬界面分欄中，我們制作了AR災(zāi)害體驗(yàn)館和一個(gè)視頻播放器，分別以常見的自然災(zāi)害：火災(zāi)、地震以及洪水為主題，通過AR的形式來讓用戶真實(shí)地感受到自然災(zāi)害的危險(xiǎn)，來讓用戶學(xué)習(xí)正確的應(yīng)對災(zāi)害措施。在火災(zāi)、洪水小游戲中，玩家扮演施救者，抵御災(zāi)害并將npc從火災(zāi)、洪水中救出，游戲難度會隨著游戲時(shí)間的增加而加大；在地震游戲中，玩家扮演逃脫者，躲避重重障礙，順利逃離到安全地點(diǎn)。在視頻播放器中，主要展示日常醫(yī)療中的2種緊急救援法，來讓用戶學(xué)習(xí)到海姆利克急救法和CPR心肺復(fù)蘇術(shù)，希望用戶可以了解一些關(guān)于緊急情況下?lián)尵确ǖ倪\(yùn)用。

4 結(jié)束語

自然災(zāi)害自古以來就是困擾人們生存和發(fā)展的一大難題，但是普通人群對自然災(zāi)害的認(rèn)知普遍不足，對于災(zāi)害的危害與風(fēng)險(xiǎn)認(rèn)知還不到位，對于災(zāi)害的應(yīng)急處理方法還不夠了解。隨著現(xiàn)代科技水平的提高，災(zāi)害科普已經(jīng)可以不再局限于書本和百度上得來的內(nèi)容，而是可以通過多種多樣的形式給人們進(jìn)行全方位的科普引導(dǎo)。防震減災(zāi)科普平臺巧妙地將用戶與知識連接在一起，為人們提供了更快捷、更有效的學(xué)習(xí)途徑，傳播了防震減災(zāi)知識和應(yīng)急避災(zāi)自救的常識，更加全面地、多維地向用戶進(jìn)行防震減災(zāi)方面的知識介紹。在體驗(yàn)豐富內(nèi)容的同時(shí)，也可以激發(fā)用戶對自然災(zāi)害知識的學(xué)習(xí)興趣，掌握災(zāi)害發(fā)展的規(guī)律和對于災(zāi)害下的自救方法與手段。

本項(xiàng)目對科普平臺設(shè)計(jì)中的用戶體驗(yàn)要素及設(shè)計(jì)要點(diǎn)進(jìn)行了創(chuàng)新性的嘗試，提出了網(wǎng)頁端、Android端聯(lián)動的科普平臺設(shè)計(jì)框架，在科普教育中加入了游戲和AR體驗(yàn)的嘗試，對防震減災(zāi)科普平臺的設(shè)計(jì)提供了新的思路。