地震数字科普馆救援技术展项的设计与实现

常建军 刘英华 刘伟男 谭阳

摘 要 信息技术的发展，为科普资源开发创造了條件。文章以救援技术展项的设计与开发为案例，通过从展项的内容选取、视觉设计、内容设计与实现等几方面进行分析，总结设计经验，为信息时代的数字科普资源开发提供借鉴。

关键词 科普；展项；设计；实现

中图分类号 G2 文献标识码 A 文章编号 1674-6708（2018）220-0176-04

我国地处欧亚大陆东南部，位于环太平洋地震带和欧亚地震带之间。受太平洋板块、印度洋板块和菲律宾板块的挤压作用，我国地质构造复杂，地震活动的范围广、强度大、频率高。在全球大陆地区的大地震中，约有1/4至1/3发生在我国。

科学技术的发展，增强了人类抵御自然灾害的能力，但是我们也清醒的认识到，人类同自然灾害的抗争将是永恒的。灾害事例表明，提高公众防灾意识是抵御灾害风险的有效途径。

为让更多的公众了解灾害风险的预防措施，充分发挥互联网技术在科学传播中的作用，北京市地震局于2017年成功开发了地震数字科普馆，该馆是基于互联网的大型数字科普馆，是“展示、教育、感受”地震的方方面面，为公众提供教育资源展示、学习、共享、交流和体验的数字化网络平台[ 1 ]。为丰富数字科普馆内容，完善防灾减灾救灾三大领域的展项设计，项目组在前期工作基础上，组织策划了地震救援技术科普资源的设计与开发。

1 救援技术科普展示内容的选取

地震救援是指迅速搜索与营救由于地震造成的建筑物破坏而被压埋人员的举动。随着科技的不断发展，很多高科技在地震救援技术中得以应用。本展项设计基于3D模型、2D动漫、Flash等技术，包含6个方面内容：地震遥感技术、AR远程医疗、救援仪器、救援机器人、无人机、网络救援。救援技术展项内容的选取主要考虑到以下几方面因素。

首先，地震遥感指利用卫星遥感技术应用于地震科学研究的各个领域当中，该技术并不仅仅应用于震后救援，还用于预报和预警，是当代科技发展的产物。

第二，AR技术也属于高科技的一种，目前AR远程医疗正在迅速发展，它必将在地震救援中发挥其独特的作用。

第三，说到救援，救援仪器设备是实施救援的关键，熟练掌握地震救援仪器设备的作用和功能，才能让救援行动更高效。

第四，救援机器人可以深入废墟、危险化学品等恶劣环境实行救援，还可携带很多救援仪器对救援工作、救援人员提供帮助。

第五，随着科技的发展，无人机等人工智能设备的应用，在灾后救援行动中作用越来越突出。

第六，现在无所不能的网络连通着世界各地，而震后第一时间通过网络进行自救和互救也是符合震后救援的及时快速特性。

2 展项的视觉设计

2.1 设计思路

救援技术新兴的应用性科学技术，设计上应该从科技感、高端技术的角度出发设计整体视觉风格。

在界面的配色上，以蓝、白、灰、黑色调为主，搭配金属黄，冷色流光，织网线条，使得整个界面拥有高大上的感觉。通过硬气的线条、简洁的操作构建整个结构。分界面的动画效果也本着科技感进行设计，与界面的原本风格相符。

此外，在分项标题上进行了统一的设计，根据所展现内容的特点或用途对每一大分项进行命名：科技无限——地震遥感技术、医&科互通——AR远程医疗、救援保障官——救援仪器、钢铁卫士——救援机器人、救援飞毛腿——无人机、互通全球——网络救援。

2.2 分项设计及特点

首界面以黑色暗格纹为背景。上方标题设计简单的线条勾勒及关键字的简单变色凸显，简约而不简单。中心区域为悬浮半透分项选择区域。每一个分项都进行了独特的LOGO图标设计，半透蒙灰的设计给整个画面以科技感，鼠标滑过分项时，分项卡变色显示，色彩上与标题中的变色一致，使得画面整齐素朴。

同时，在页面的中心会出现该分支项的主要配图，并伴有动画。例如：鼠标滑过无人机的时候，无人机半骨骼模型会出现在屏幕中间，悬浮条的下方，并设计相关动画进行展现，比如自旋转等效果。

2.2.1 科技无限——地震遥感技术

由于地震遥感技术基于卫星技术而来，因此在设计上，整个背景以太空为主，中心为地球，下方为月球，右上方为火星，太空中一颗环绕地球的卫星正将采集到的数据发回地球的接收中心，画面中的小机器人，“地震科学家——吉宝”作为导航向导，站在月球上及太空中提示界面如何操作。

该分项通过电子书的形式进行知识点讲解，根据界面一体化的设计要求，书的封面为蓝色系为主，另外一个内嵌的地球与背景中地球拼凑成一个完整的地球，将书籍与背景融为一体，相得益彰。

2.2.2 医&科互通——AR远程医疗

当医学和科技融合必然会使其发挥更大的价值，这便是AR远程医疗。不同于地震遥感技术，带有一点点灰度的本白色调让人很容易与医学联系起来。标题背色并没有脱离蓝色，与整个界面的主色呼应，标题下方的世界地图和织网线代表医学在科技的助力下可实现远程医疗。一个带着听诊器的医者举起听诊器便可医治四方。右侧的分项按钮设计不仅遵从科技感的总设计原则，以仿照听诊器的圆形，使得整个画面统一，不凌乱。

其子项内容展示页设计为从左侧拉出一个背板的形式，不禁让人想起医院里大夫看X光片用的背板。上方蓝色区域为标题，下方为内容展示页。

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

该分项界面背色以墨绿色为主，标题做红色光晕及远景阴影效果处理，不对称双三角作为分项按钮，交叠错落摆放。倒三角按钮为知识点图文介绍，正三角按钮为一互动游戏。

主色调墨绿色显得沉稳庄重，红色作为配色在标题上运用，贴合救援色彩，阴影效果使得标题呈现立体感，与下方介绍性文字区别开来。不规则分项按钮即可视为画面结构用图又兼具按钮功能，为整个画面添加俏皮之感，使整个界面焕发生气。

2.2.4 钢铁卫士——救援机器人

该分项界面的设计以高科技为主，背景以沉稳的渐变蓝为主色调，在背景纹理上散布着各种机械零件，与分项主题相呼应。整个界面按钮及标题的设计符合机械的硬线条风格：标题本白高光，镶嵌在硬线条框体之内；按钮设计科技感十足，选中状态的金属黄使界面机械感更强；中心区域展陈圆盘上屹立着不同型号的救援机器人，通过左右拨动选择其他机器人。整个界面设计立体感分明，让人置身其中，信手拈来就可了解在震区中大放异彩的钢铁卫士。

分知识点以弹窗的形式进行展示，弹窗的设计灵感来源于科技大片中平板资料显示窗口，配以主色调的蓝，边角为同色系高亮显色，使得弹窗悬浮凸出显示。

2.2.5 救援飞毛腿——无人机

无人机的界面背景以黑色系为主，界面背景带光感百叶窗效果，光线从菱格内透入打在中心无人机模型上。中心无人机模型居中占据整个画面绝大部分。当进入该分项页面时，无人机呈现为3D骨骼线条，随着在机身上反复扫描后，无人机被蒙上外皮后静止界面之上，此无人机为3D模型，可通过鼠标对无人机进行旋转操作。这个界面风格简约大气，重点突出。

当点击无人机模型时，以弹窗的形式展现无人机相关知识内容。仍旧以科技感为主设计原则，用简单的细线条做明暗、断裂设计，勾勒出一个无人机的视觉框，亦可作为无人机上携带仪器的对焦框，创意贴合主题，设计感强。

2.2.6 互通全球——网络救援

本界面设计与其他界面略有不同，在该界面呈现之前，设有一小段动画，作为开篇题引。动画结束后，显现出该分项界面。界面背景色以深蓝色为主，用线条勾勒的地球淡淡浮现在背景之上，在其上面是交织的网络线条，在线条的不同交织点上设有知识点按钮。这些悬浮的网络线在小幅度的自由摆动，点击不同的按钮会有拉拽的效果，表示网络上信息流的传输。

当点击不同知识点后，以弹窗的形式进行知识点讲述。该弹窗为不规格弹窗，同色系（蓝色）明暗不同、深浅不一，搭配明黄色作为点缀的设计，下方蓝色信息条块闪动表示网络无时不刻在传输着信息。

3 展项的内容设计与实现

3.1 科技无限——地震遥感技术

地震遥感技术是基于卫星遥感技术的应用，在地震中它的应用为救援提供了众多便利。因此“科技无限——地震遥感技术”通过图文及动画相结合的方式，讲述地震遥感技术3方面内容。简单来说就是地震遥感技术是什么、有什么和做什么。

在“地震遥感技术是什么”中，通过一段文字描述及一个简短的动画揭示地震遥感技术的本质；在“地震遥感技术有什么”中，是以图表的形式对地震遥感技术的分类及用途进行说明；在“地震遥感技术做什么”中，以图文及动画的形式讲述地震遥感技术可用于地震监测预报、地震灾害防御和应急救援三方面。

3.2 医&科互通——AR远程医疗

灾情发生时，需要进行大量的施救，不过在道路受阻，专家医生无法快速到达灾区时，远程医疗便提供了快捷有效的救援援助。

“医&科互通——AR远程医疗”通过图文的形式对三方面内容进行讲述，分别是：远程电视医疗、AR+远程医疗、QQ-AR。电视医疗是最早也是最常见的远程医疗方式，但是随着AR技术的日趋成熟，AR+远程医疗可大大缓解因医救不及时而造成的悲剧，而QQ-AR急救包则是为自救提供支持。

随着AR技术的日趋成熟及其与医疗上的结合，相信在将来，灾区的自救、互救及医生的远程救护会为抢救生命贡献更大的力量。

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

当地震发生无数生命被掩埋时，救援成为首要任务。除了可追溯到公元950年的搜救犬外，众多救援仪器因各自功能不同，在抢救生命中各司其职，成为救援的保障官。

“救援保障官——救援仪器”通过图文的方式对生命探测仪、工业内窥镜、AR头盔、卫星电话/亚星电话、呼吸防尘、可燃易爆气体探测仪、切割链锯、氧气探测仪、液压盘锯、液压破碎镐、有毒气体探测仪、照明设备，共12个救援仪器进行简要的介绍。通过“救援仪器连连看”互动游戏加深对每个救援仪器的印象。

3.4 钢铁卫士——救援机器人

由于地震发生后导致的建筑坍塌，救援人员不仅很难在废墟中寻找受困群众，甚至救援过程中自身也要面对危险。这时，我们就需要借助一些特别的救援机器人来进行搜救。

“钢铁卫士——救援机器人”通过图文及视频的方式，介绍八种较为典型及先进的机器人的各自的功能及在地震中的用途，让这些钢铁神兵呈现在受众面前。其中不乏有我国“十一五”863计划重点项目“救灾救援危险作业机器人技术”中脱颖而出的新秀，让受众感受到我国在救援能力上的重大进步。

这八种机器人分别是：废墟搜救可变形机器人、旋翼无人机、火灾救援机器人、蛇形机器人、履带式机器人、轮滑式机器人、呼吸探测机器人、无敌机器蟑螂。

3.5 救援飞毛腿——无人机

从2008年的汶川地震到如今各省市地区发生自然灾害的救灾现场中，我们发现了一个很重要的身影，它能比救援队伍提前到达灾区中心，进行路线勘探、测绘，及时了解灾区情况，救援队伍通过它拍摄的高精度测绘图设计合理的救援路线，为救援队伍争取时间，挽救更多的生命。它就是：无人机！随着技术的不断完善，如今无人机可完成的任务越来越多，在地震救援中也越来越重要。

“救援飞毛腿——无人机”通过3D模型及互动动画的形式进行展示。在分项界面上一个可操作的多旋翼无人机用以对无人机的外形进行了解。在互动动画中则对无人机做了详细的介绍。从默默无闻到不可或缺，无人机的分类及用途都在这里娓娓道来。在动画中设有一个带剧情的互动环节。在该互动环节中，模拟某区域发生地震，派遣无人机完成相关任务，通过一系类的指令和提示，加深受众了解无人机在救援中能够做哪些事情。比如：遥感测绘、险情侦察、路线规划、通讯中继、运输投掷、灾后防疫、搜救人員。

3.6 互通全球——网络救援

在信息时代，可以预见的是应急响应将因为互联网而更加快速、灵活。在天灾面前，我们看到众多App/网络平台释放出的价值，它们在用自己的方式帮助人们脱离险境。

“互通全球——网络救援”通过FLASH动画开篇引题的方式，通过地震后网络信号的传输表示随着社会、科技的进步，作为生活必不可少的网络，因其时效性及普及性的特点，在灾害救援中也开始贡献力量。片头动画结束后，界面上出现悬浮按钮，点击不同的悬浮按钮，通过图文、动画的形式讲述相关知识点。这些知识点主要可分为四大类：搜索引擎类、网络社交（微信、微博）类、电子地图类和App类。讲述人们如何通过这四大类网络手段在地震中传递信息，实现救援的。

4 结论

救援技术科普数字资源的设计与实现，就是将现实高科技救援技术装备通过3D等虚拟技术进行数字化展示，增强了数字科普资源的科技性、互动性和体验感，丰富了展示内容，提升了展示效果，为数字科普资源开发做出了积极的探索实践。

参考文献

[1]刘英华，等.地震数字科普馆的构建与实现[J].产业与科技论坛，2017，16（13）：49-51.