地震數(shù)字科普館救援技術(shù)展項的設(shè)計與實現(xiàn)

常建軍 劉英華 劉偉男 譚陽

摘 要 信息技術(shù)的發(fā)展，為科普資源開發(fā)創(chuàng)造了條件。文章以救援技術(shù)展項的設(shè)計與開發(fā)為案例，通過從展項的內(nèi)容選取、視覺設(shè)計、內(nèi)容設(shè)計與實現(xiàn)等幾方面進行分析，總結(jié)設(shè)計經(jīng)驗，為信息時代的數(shù)字科普資源開發(fā)提供借鑒。

關(guān)鍵詞 科普；展項；設(shè)計；實現(xiàn)

中圖分類號 G2 文獻標(biāo)識碼 A 文章編號 1674-6708（2018）220-0176-04

我國地處歐亞大陸東南部，位于環(huán)太平洋地震帶和歐亞地震帶之間。受太平洋板塊、印度洋板塊和菲律賓板塊的擠壓作用，我國地質(zhì)構(gòu)造復(fù)雜，地震活動的范圍廣、強度大、頻率高。在全球大陸地區(qū)的大地震中，約有1/4至1/3發(fā)生在我國。

科學(xué)技術(shù)的發(fā)展，增強了人類抵御自然災(zāi)害的能力，但是我們也清醒的認識到，人類同自然災(zāi)害的抗?fàn)帉⑹怯篮愕?。?zāi)害事例表明，提高公眾防災(zāi)意識是抵御災(zāi)害風(fēng)險的有效途徑。

為讓更多的公眾了解災(zāi)害風(fēng)險的預(yù)防措施，充分發(fā)揮互聯(lián)網(wǎng)技術(shù)在科學(xué)傳播中的作用，北京市地震局于2017年成功開發(fā)了地震數(shù)字科普館，該館是基于互聯(lián)網(wǎng)的大型數(shù)字科普館，是“展示、教育、感受”地震的方方面面，為公眾提供教育資源展示、學(xué)習(xí)、共享、交流和體驗的數(shù)字化網(wǎng)絡(luò)平臺[ 1 ]。為豐富數(shù)字科普館內(nèi)容，完善防災(zāi)減災(zāi)救災(zāi)三大領(lǐng)域的展項設(shè)計，項目組在前期工作基礎(chǔ)上，組織策劃了地震救援技術(shù)科普資源的設(shè)計與開發(fā)。

1 救援技術(shù)科普展示內(nèi)容的選取

地震救援是指迅速搜索與營救由于地震造成的建筑物破壞而被壓埋人員的舉動。隨著科技的不斷發(fā)展，很多高科技在地震救援技術(shù)中得以應(yīng)用。本展項設(shè)計基于3D模型、2D動漫、Flash等技術(shù)，包含6個方面內(nèi)容：地震遙感技術(shù)、AR遠程醫(yī)療、救援儀器、救援機器人、無人機、網(wǎng)絡(luò)救援。救援技術(shù)展項內(nèi)容的選取主要考慮到以下幾方面因素。

首先，地震遙感指利用衛(wèi)星遙感技術(shù)應(yīng)用于地震科學(xué)研究的各個領(lǐng)域當(dāng)中，該技術(shù)并不僅僅應(yīng)用于震后救援，還用于預(yù)報和預(yù)警，是當(dāng)代科技發(fā)展的產(chǎn)物。

第二，AR技術(shù)也屬于高科技的一種，目前AR遠程醫(yī)療正在迅速發(fā)展，它必將在地震救援中發(fā)揮其獨特的作用。

第三，說到救援，救援儀器設(shè)備是實施救援的關(guān)鍵，熟練掌握地震救援儀器設(shè)備的作用和功能，才能讓救援行動更高效。

第四，救援機器人可以深入廢墟、危險化學(xué)品等惡劣環(huán)境實行救援，還可攜帶很多救援儀器對救援工作、救援人員提供幫助。

第五，隨著科技的發(fā)展，無人機等人工智能設(shè)備的應(yīng)用，在災(zāi)后救援行動中作用越來越突出。

第六，現(xiàn)在無所不能的網(wǎng)絡(luò)連通著世界各地，而震后第一時間通過網(wǎng)絡(luò)進行自救和互救也是符合震后救援的及時快速特性。

2 展項的視覺設(shè)計

2.1 設(shè)計思路

救援技術(shù)新興的應(yīng)用性科學(xué)技術(shù)，設(shè)計上應(yīng)該從科技感、高端技術(shù)的角度出發(fā)設(shè)計整體視覺風(fēng)格。

在界面的配色上，以藍、白、灰、黑色調(diào)為主，搭配金屬黃，冷色流光，織網(wǎng)線條，使得整個界面擁有高大上的感覺。通過硬氣的線條、簡潔的操作構(gòu)建整個結(jié)構(gòu)。分界面的動畫效果也本著科技感進行設(shè)計，與界面的原本風(fēng)格相符。

此外，在分項標(biāo)題上進行了統(tǒng)一的設(shè)計，根據(jù)所展現(xiàn)內(nèi)容的特點或用途對每一大分項進行命名：科技無限——地震遙感技術(shù)、醫(yī)&科互通——AR遠程醫(yī)療、救援保障官——救援儀器、鋼鐵衛(wèi)士——救援機器人、救援飛毛腿——無人機、互通全球——網(wǎng)絡(luò)救援。

2.2 分項設(shè)計及特點

首界面以黑色暗格紋為背景。上方標(biāo)題設(shè)計簡單的線條勾勒及關(guān)鍵字的簡單變色凸顯，簡約而不簡單。中心區(qū)域為懸浮半透分項選擇區(qū)域。每一個分項都進行了獨特的LOGO圖標(biāo)設(shè)計，半透蒙灰的設(shè)計給整個畫面以科技感，鼠標(biāo)滑過分項時，分項卡變色顯示，色彩上與標(biāo)題中的變色一致，使得畫面整齊素樸。

同時，在頁面的中心會出現(xiàn)該分支項的主要配圖，并伴有動畫。例如：鼠標(biāo)滑過無人機的時候，無人機半骨骼模型會出現(xiàn)在屏幕中間，懸浮條的下方，并設(shè)計相關(guān)動畫進行展現(xiàn)，比如自旋轉(zhuǎn)等效果。

2.2.1 科技無限——地震遙感技術(shù)

由于地震遙感技術(shù)基于衛(wèi)星技術(shù)而來，因此在設(shè)計上，整個背景以太空為主，中心為地球，下方為月球，右上方為火星，太空中一顆環(huán)繞地球的衛(wèi)星正將采集到的數(shù)據(jù)發(fā)回地球的接收中心，畫面中的小機器人，“地震科學(xué)家——吉寶”作為導(dǎo)航向?qū)?，站在月球上及太空中提示界面如何操作?img src="https://cimg.fx361.com/images/2018/10/22/qkimageskecbkecb201819kecb20181980-2-l.jpg"/>

該分項通過電子書的形式進行知識點講解，根據(jù)界面一體化的設(shè)計要求，書的封面為藍色系為主，另外一個內(nèi)嵌的地球與背景中地球拼湊成一個完整的地球，將書籍與背景融為一體，相得益彰。

2.2.2 醫(yī)&科互通——AR遠程醫(yī)療

當(dāng)醫(yī)學(xué)和科技融合必然會使其發(fā)揮更大的價值，這便是AR遠程醫(yī)療。不同于地震遙感技術(shù)，帶有一點點灰度的本白色調(diào)讓人很容易與醫(yī)學(xué)聯(lián)系起來。標(biāo)題背色并沒有脫離藍色，與整個界面的主色呼應(yīng)，標(biāo)題下方的世界地圖和織網(wǎng)線代表醫(yī)學(xué)在科技的助力下可實現(xiàn)遠程醫(yī)療。一個帶著聽診器的醫(yī)者舉起聽診器便可醫(yī)治四方。右側(cè)的分項按鈕設(shè)計不僅遵從科技感的總設(shè)計原則，以仿照聽診器的圓形，使得整個畫面統(tǒng)一，不凌亂。

其子項內(nèi)容展示頁設(shè)計為從左側(cè)拉出一個背板的形式，不禁讓人想起醫(yī)院里大夫看X光片用的背板。上方藍色區(qū)域為標(biāo)題，下方為內(nèi)容展示頁。

2.2.3 救援保障官——救援儀器

該分項界面背色以墨綠色為主，標(biāo)題做紅色光暈及遠景陰影效果處理，不對稱雙三角作為分項按鈕，交疊錯落擺放。倒三角按鈕為知識點圖文介紹，正三角按鈕為一互動游戲。

主色調(diào)墨綠色顯得沉穩(wěn)莊重，紅色作為配色在標(biāo)題上運用，貼合救援色彩，陰影效果使得標(biāo)題呈現(xiàn)立體感，與下方介紹性文字區(qū)別開來。不規(guī)則分項按鈕即可視為畫面結(jié)構(gòu)用圖又兼具按鈕功能，為整個畫面添加俏皮之感，使整個界面煥發(fā)生氣。

2.2.4 鋼鐵衛(wèi)士——救援機器人

該分項界面的設(shè)計以高科技為主，背景以沉穩(wěn)的漸變藍為主色調(diào)，在背景紋理上散布著各種機械零件，與分項主題相呼應(yīng)。整個界面按鈕及標(biāo)題的設(shè)計符合機械的硬線條風(fēng)格：標(biāo)題本白高光，鑲嵌在硬線條框體之內(nèi)；按鈕設(shè)計科技感十足，選中狀態(tài)的金屬黃使界面機械感更強；中心區(qū)域展陳圓盤上屹立著不同型號的救援機器人，通過左右撥動選擇其他機器人。整個界面設(shè)計立體感分明，讓人置身其中，信手拈來就可了解在震區(qū)中大放異彩的鋼鐵衛(wèi)士。

分知識點以彈窗的形式進行展示，彈窗的設(shè)計靈感來源于科技大片中平板資料顯示窗口，配以主色調(diào)的藍，邊角為同色系高亮顯色，使得彈窗懸浮凸出顯示。

2.2.5 救援飛毛腿——無人機

無人機的界面背景以黑色系為主，界面背景帶光感百葉窗效果，光線從菱格內(nèi)透入打在中心無人機模型上。中心無人機模型居中占據(jù)整個畫面絕大部分。當(dāng)進入該分項頁面時，無人機呈現(xiàn)為3D骨骼線條，隨著在機身上反復(fù)掃描后，無人機被蒙上外皮后靜止界面之上，此無人機為3D模型，可通過鼠標(biāo)對無人機進行旋轉(zhuǎn)操作。這個界面風(fēng)格簡約大氣，重點突出。

當(dāng)點擊無人機模型時，以彈窗的形式展現(xiàn)無人機相關(guān)知識內(nèi)容。仍舊以科技感為主設(shè)計原則，用簡單的細線條做明暗、斷裂設(shè)計，勾勒出一個無人機的視覺框，亦可作為無人機上攜帶儀器的對焦框，創(chuàng)意貼合主題，設(shè)計感強。

2.2.6 互通全球——網(wǎng)絡(luò)救援

本界面設(shè)計與其他界面略有不同，在該界面呈現(xiàn)之前，設(shè)有一小段動畫，作為開篇題引。動畫結(jié)束后，顯現(xiàn)出該分項界面。界面背景色以深藍色為主，用線條勾勒的地球淡淡浮現(xiàn)在背景之上，在其上面是交織的網(wǎng)絡(luò)線條，在線條的不同交織點上設(shè)有知識點按鈕。這些懸浮的網(wǎng)絡(luò)線在小幅度的自由擺動，點擊不同的按鈕會有拉拽的效果，表示網(wǎng)絡(luò)上信息流的傳輸。

當(dāng)點擊不同知識點后，以彈窗的形式進行知識點講述。該彈窗為不規(guī)格彈窗，同色系（藍色）明暗不同、深淺不一，搭配明黃色作為點綴的設(shè)計，下方藍色信息條塊閃動表示網(wǎng)絡(luò)無時不刻在傳輸著信息。

3 展項的內(nèi)容設(shè)計與實現(xiàn)

3.1 科技無限——地震遙感技術(shù)

地震遙感技術(shù)是基于衛(wèi)星遙感技術(shù)的應(yīng)用，在地震中它的應(yīng)用為救援提供了眾多便利。因此“科技無限——地震遙感技術(shù)”通過圖文及動畫相結(jié)合的方式，講述地震遙感技術(shù)3方面內(nèi)容。簡單來說就是地震遙感技術(shù)是什么、有什么和做什么。

在“地震遙感技術(shù)是什么”中，通過一段文字描述及一個簡短的動畫揭示地震遙感技術(shù)的本質(zhì)；在“地震遙感技術(shù)有什么”中，是以圖表的形式對地震遙感技術(shù)的分類及用途進行說明；在“地震遙感技術(shù)做什么”中，以圖文及動畫的形式講述地震遙感技術(shù)可用于地震監(jiān)測預(yù)報、地震災(zāi)害防御和應(yīng)急救援三方面。

3.2 醫(yī)&科互通——AR遠程醫(yī)療

災(zāi)情發(fā)生時，需要進行大量的施救，不過在道路受阻，專家醫(yī)生無法快速到達災(zāi)區(qū)時，遠程醫(yī)療便提供了快捷有效的救援援助。

“醫(yī)&科互通——AR遠程醫(yī)療”通過圖文的形式對三方面內(nèi)容進行講述，分別是：遠程電視醫(yī)療、AR+遠程醫(yī)療、QQ-AR。電視醫(yī)療是最早也是最常見的遠程醫(yī)療方式，但是隨著AR技術(shù)的日趨成熟，AR+遠程醫(yī)療可大大緩解因醫(yī)救不及時而造成的悲劇，而QQ-AR急救包則是為自救提供支持。

隨著AR技術(shù)的日趨成熟及其與醫(yī)療上的結(jié)合，相信在將來，災(zāi)區(qū)的自救、互救及醫(yī)生的遠程救護會為搶救生命貢獻更大的力量。

3.3 救援保障官——救援儀器

當(dāng)?shù)卣鸢l(fā)生無數(shù)生命被掩埋時，救援成為首要任務(wù)。除了可追溯到公元950年的搜救犬外，眾多救援儀器因各自功能不同，在搶救生命中各司其職，成為救援的保障官。

“救援保障官——救援儀器”通過圖文的方式對生命探測儀、工業(yè)內(nèi)窺鏡、AR頭盔、衛(wèi)星電話/亞星電話、呼吸防塵、可燃易爆氣體探測儀、切割鏈鋸、氧氣探測儀、液壓盤鋸、液壓破碎鎬、有毒氣體探測儀、照明設(shè)備，共12個救援儀器進行簡要的介紹。通過“救援儀器連連看”互動游戲加深對每個救援儀器的印象。

3.4 鋼鐵衛(wèi)士——救援機器人

由于地震發(fā)生后導(dǎo)致的建筑坍塌，救援人員不僅很難在廢墟中尋找受困群眾，甚至救援過程中自身也要面對危險。這時，我們就需要借助一些特別的救援機器人來進行搜救。

“鋼鐵衛(wèi)士——救援機器人”通過圖文及視頻的方式，介紹八種較為典型及先進的機器人的各自的功能及在地震中的用途，讓這些鋼鐵神兵呈現(xiàn)在受眾面前。其中不乏有我國“十一五”863計劃重點項目“救災(zāi)救援危險作業(yè)機器人技術(shù)”中脫穎而出的新秀，讓受眾感受到我國在救援能力上的重大進步。

這八種機器人分別是：廢墟搜救可變形機器人、旋翼無人機、火災(zāi)救援機器人、蛇形機器人、履帶式機器人、輪滑式機器人、呼吸探測機器人、無敵機器蟑螂。

3.5 救援飛毛腿——無人機

從2008年的汶川地震到如今各省市地區(qū)發(fā)生自然災(zāi)害的救災(zāi)現(xiàn)場中，我們發(fā)現(xiàn)了一個很重要的身影，它能比救援隊伍提前到達災(zāi)區(qū)中心，進行路線勘探、測繪，及時了解災(zāi)區(qū)情況，救援隊伍通過它拍攝的高精度測繪圖設(shè)計合理的救援路線，為救援隊伍爭取時間，挽救更多的生命。它就是：無人機！隨著技術(shù)的不斷完善，如今無人機可完成的任務(wù)越來越多，在地震救援中也越來越重要。

“救援飛毛腿——無人機”通過3D模型及互動動畫的形式進行展示。在分項界面上一個可操作的多旋翼無人機用以對無人機的外形進行了解。在互動動畫中則對無人機做了詳細的介紹。從默默無聞到不可或缺，無人機的分類及用途都在這里娓娓道來。在動畫中設(shè)有一個帶劇情的互動環(huán)節(jié)。在該互動環(huán)節(jié)中，模擬某區(qū)域發(fā)生地震，派遣無人機完成相關(guān)任務(wù)，通過一系類的指令和提示，加深受眾了解無人機在救援中能夠做哪些事情。比如：遙感測繪、險情偵察、路線規(guī)劃、通訊中繼、運輸投擲、災(zāi)后防疫、搜救人員。

3.6 互通全球——網(wǎng)絡(luò)救援

在信息時代，可以預(yù)見的是應(yīng)急響應(yīng)將因為互聯(lián)網(wǎng)而更加快速、靈活。在天災(zāi)面前，我們看到眾多App/網(wǎng)絡(luò)平臺釋放出的價值，它們在用自己的方式幫助人們脫離險境。

“互通全球——網(wǎng)絡(luò)救援”通過FLASH動畫開篇引題的方式，通過地震后網(wǎng)絡(luò)信號的傳輸表示隨著社會、科技的進步，作為生活必不可少的網(wǎng)絡(luò)，因其時效性及普及性的特點，在災(zāi)害救援中也開始貢獻力量。片頭動畫結(jié)束后，界面上出現(xiàn)懸浮按鈕，點擊不同的懸浮按鈕，通過圖文、動畫的形式講述相關(guān)知識點。這些知識點主要可分為四大類：搜索引擎類、網(wǎng)絡(luò)社交（微信、微博）類、電子地圖類和App類。講述人們?nèi)绾瓮ㄟ^這四大類網(wǎng)絡(luò)手段在地震中傳遞信息，實現(xiàn)救援的。

4 結(jié)論

救援技術(shù)科普數(shù)字資源的設(shè)計與實現(xiàn)，就是將現(xiàn)實高科技救援技術(shù)裝備通過3D等虛擬技術(shù)進行數(shù)字化展示，增強了數(shù)字科普資源的科技性、互動性和體驗感，豐富了展示內(nèi)容，提升了展示效果，為數(shù)字科普資源開發(fā)做出了積極的探索實踐。

參考文獻

[1]劉英華，等.地震數(shù)字科普館的構(gòu)建與實現(xiàn)[J].產(chǎn)業(yè)與科技論壇，2017，16（13）：49-51.