基于VR虚拟漫游技术的交互设计应用研究

姬喆

摘  要： 虚拟现实技术是指利用计算机多媒体技术从人的嗅觉、视觉、触觉和听觉等多方面来全方位模拟环境，让人们在计算机构筑的虚拟环境中有身处其中之感，借助于人机交互可以获得各种信息。文中首先对系统的设计目标和功能结构设计展开分析，然后在Web上利用VR技术来完成相应虚拟校园系统的开发。在此过程中对虚拟现实技术进行概述，并结合校园导向标识系统设计所需提出借助于VR实现该导向系统的可行性方案;最后给出虚拟校园系统的整体框架、所需技术与实现策略，同时还对该系统的交互与建模方法进行了论述。

关键词： 虚拟现实技术; 校园漫游系统; 交互设计; 三维模型; 虚拟系统开发; 人机交互

中图分类号： TN919.85?34                      文献标识码： A                         文章编号： 1004?373X（2019）15?0086?05

Applied research on interaction design based on VR virtual roaming technology

JI Zhe

（ Xiamen University of Technology， Xiamen 361024， China）

Abstract： The virtual reality （VR） technology can make people seem to be in the virtual environment built by the computer have a sense of being in it， and obtain all kinds of information by means of the help of human?computer interaction. The design objectives and functional structure of the system are analyzed in this study. The development of the corresponding virtual campus system is completed with VR technology on Web2.0. In this process， the VR technology is summarized， and then the feasible scheme of realizing the guidance system with the help of VR technology is proposed according to the design requirements of the campus guidance sign system. The overall framework， required technology and implementation strategy of the virtual campus system are given. The interaction and modeling methods of the system are discussed.

Keywords： virtual reality technology; campus roaming system; interaction design; 3D model; virtual system development; man?machine interaction

0  引  言

随着科学技术的不断发展，计算机、平板、手机等智能设备的日渐普及，网络迅猛飞速的发展，传统图片与文字等相关交互模式已经很难满足民众的多元化需求，沉浸式或者多元化的交互模式无疑会成为今后重要的发展趋势。虚拟现实（VR）技术也由此受到极大关注与发展。该技术就是将计算机、多媒体、仿真等技术进行融合，构筑一个仿真的虚拟三维环境，可以让民众产生一种身临其境的真实感，对激发人们的创新思维与想象力有着颇为重要的作用。当前虚拟视景系统开始得到广泛应用，其价值也日益凸显，本文就对该系统所涉及的关键技术进行分析，其目的就是构筑一个融合易用、实用于一体化的虚拟视景系统平台，该平台的技术关键就是构筑近乎真实的虚拟环境。本文对该平台进行开发，并对其中所涉及的关键技术进行重点讨论。这种技术不仅能够给用户带来更好的真实感，同时还能很好地满足人们多元化的交互需求，可以让人们沉浸于逼真的虚拟环境中，进而产生一种身处其中的感觉。

1  系统的设计目标和功能结构设计

1.1  虚拟校园漫游系统设计流程

虚拟校园漫游系统应该表现出虚拟环境中的地形、花草树木、校内建筑等对象的三维模型，在形态、光照、质感等方面都十分逼真，使参考者能在构筑的栩栩如生的虚拟校园中漫游，并实现和系统之间的交互功能。在虚拟漫游系统的开发过程中，首先要对虚拟场景进行一个整体的规划与设计，虚拟校园漫游系统设计的一般流程如下：

1） 实地考察，测量场景的外观、结构数据，利用照相机、摄像机等工具拍摄真实的场景图片，收集场景的设计图纸等资料。

2） 利用图像处理软件对事先收集的图片进行预处理，留作几何建模后作为纹理贴图。

3） 設计系统的总体结构。

4） 根据收集的数据及要建立的虚拟场景特点确定开发的技术路线及开发平台。

5） 利用建模软件建立场景环境及实体模型。

6） 利用仿真软件把建好的模型整合在一起，然后通过仿真软件或编程实现漫游控制，完成场景漫游系统的开发。

图1为场景漫游系统设计的流程图。

图1  虚拟漫游系统设计的主要流程

1.2  虚拟校园漫游系统设计目标

在构筑虚拟校园系统时必须要创建相应的三维模型库，这样才能使得系统更具有真实性，并能为师生提供更為丰富的交互模式。虚拟校园漫游系统设计要求：

1） 交互窗体需要做到最大限度的简单化，可以使得不同层次用户都能在界面上对系统功能进行清晰了解，同时还能对系统展开操作，进而实现漫游。

2） 该系统需要结合校园实景完成虚拟环境构筑，可以真实展现出校园的景观，使得人们产生身临其境之感。

3） 为了促使该系统中的三维图像更为逼真，就需要注重纹理的细节，使得相应纹理影射变得更为详细。

4） 在构筑虚拟物体模型时需要使用更为真实的材质，并引入明暗效应。

5） 该系统可以支持多角度的对校园的景观进行浏览，这样才能使得漫游功能变得更为优秀。

6） 系统需要有良好的碰撞检测功能，防范存在穿墙功能。

7） 系统要有良好的跨平台与可扩展属性。

1.3  虚拟校园漫游系统结构功能

由于场景之中的诸多对象是借助于空间相对关系完成相应的组织，所以还需要构筑相应的对象，并以此作为基准对对象位置进行明确。道路是虚拟校园系统中的关键对象，可以产生相应的基线功能，对应的建模流程为：

1） 构筑校园主干道模型，利用该道路将校园细分成诸多模块，然后对每一块的主要建筑景点加以明确。

2） 对相关区域内的关键建筑进行相应的三维建模。其中，楼梯建模可以细分成空心与实心建筑模型，前者仅仅完成框架的构筑，譬如教学楼与宿舍楼;后者的楼体则涵盖了相应的内部细节，主要涉及的楼体包括图书馆与多媒体教学楼等。在楼体建模环节，首先要完成相应实心楼体模型设计，然后再对公共特征楼体进行设计，在这些楼体之中，要遴选那些具有代表性的楼体进行建模，而针对其他楼体则可以利用简单性的变化即可。

3） 对不同区块的相关景观构成进行建模，譬如草地、路灯以及各种类型的景观树等。

4） 对诸多模型进行优化、整合，进而成功构筑一个总体的场景模型。

虚拟校园漫游子系统的具体框架如图2所示。

图2  虚拟校园系统架构图

2  基于VR虚拟校园漫游设计与实现

2.1  数据采集

在采集数据时，必须要到现场进行测绘与分析，然后才能更好地对其进行相应的建模。其中，考察的内容包括校园的建筑分布、道路的走向、不同的建筑风格等，而且在考察之时需要选择一个晴朗的天气环境，要保证有着充足的光照度，然后拍摄相关关键性物体，比如楼体、道路等。此外，还需要采集一些小型纹理性图片，譬如门窗、砖纹、草地等，然后将其用作贴图，使得相关建模对象更具有真实感。

2.2  系统建模

1） 天空和地面等背景模型的建模

为了让虚拟环境更具有真实性，需要为其添置真实的蓝天、绿地等，这样就能够使得这个虚拟环境立足于真实的场景。在VR技术中，VRML提供一个背景节点对象，也就是所谓的Background，这样就能够通过它完成相关参数的设置，进而完成虚拟校园系统的背景建模。

图3  大地与天空的背景

通常大地需要配置为浅绿色，其原因主要有以下几点：在真实环境之中，颜色具有非确定性;若是将大地颜色配置成土地的颜色，那么道路的颜色就难以确定;由于构筑的是虚拟环境，所以可以借鉴某些必要的想象内容，而绿地对于民众而言是一种美好的想象之一，而且它本身与路面也颇为相近，十分契合人们对校园的感观。

2） 树、路灯等辅助性模型的建模

在本次系统开发过程中选用的工具为VRML，结合该语言的独特优势，进一步提出相应的递归分形算法，具体思路为：将strArr[[n]]与某棵树信息进行对应，而strArr[[n-1]]对应的则是树枝，后者通过方式[T]（）进行组合便能构成前者，而这些树枝则是进一步由更为简单的树枝所构成，亦即strArr[[n]-2]，而对应的构成方式亦为[T]（），于是就形成了相应的递归，使得由最为简单的树枝strArr[0]、枝干与树叶完成整棵树的建模。在该VRML语言之中可以将这些细节进行很好的展现，具体的递归算法可以表示为：

算法的主要步骤为：

① 借助于Indexed Face Set节点能够完成形态各异、颜色不同树叶的集合构造，这样就能够借助于该基础性的元素进行不断的递归算法，完成相应枝干集合的构造。

② 在树叶集合之中可以结合所需节点加以复制与重用，针对所需的枝干节点也可以在相应的集合中进行遴选，最后再借助于translation与rotate域将枝干与树叶进行旋转与平移操作，由此便能构成一个更为简单的树枝。

③ 将树枝节点用作分形元，并对其进行复制，然后使用上述两域与scale域对这些节点进行旋转、缩放与平移等操作，也就是过[T]（）处理使得这些树枝转变成更为复杂的树枝节点。

④ 对上述三个步骤进行重复，便能构成更为复杂的分形树。譬如将第一个叶状分支进行缩小，然后对其进行旋转平移处理，便能得到三个副本，随后再为其配制树状分枝，于是就变成了图4b），接着再利用复制、旋转等处理，便能得到图4c）。

图4  分形技术下的树模型构筑过程演示图

3） 楼群等建筑物的建模

在具体校园中楼群无疑是极为重要的建筑主体对象，而且整体数量也颇多，想要高效真实地完成该主体的建模工作，就需要根据具体情形进行建模。在此过程中可以使用VRML中所涉及的几何与外观节点来实现。通过这两个节点完成楼群三维模型构筑，接着利用相应的纹理图像等技术使之得到贴图，具体流程为：

① 按照校园地形分布情况，借助于Canoma这款三维软件完成相关的建筑模型图片遴选，为后续的分块拼合提供基础。

② 因为建筑模型存在差异性纹理，为此需要对该模型诸多分块的相关面进行选择，然后对关键点与控制点进行选择，并将模型相关面加以渲染，于是便能使得模型更加契合真实环境。

③ 为了使得系统在较多模型之下不会对系统实时性能带来影响，因此需要将相关建筑模型作为一个整体进行单独输出，亦即是Export，而[*.WRL]则是其导出格式。

2.3  碰撞检测

在VR技术中，需要使用者能够按照十分真实的方式与虚拟环境中诸多模型进行交互，也就是说，这些对象需要有真实环境的物理属性。为此在VR技术中提供物体之间的碰撞检测功能，其中包括“动?静”物与“动?动”物之间的碰撞检测。以视线为基础的向前线段探测无疑是较为常用的检测之法，具体过程包括：

1） 明确视点[V]，在具体虚拟环境中即为使用者的头部区域;

2） 基于视线沿着运动向的距离用[d]表示，选择其中的一个点用[M]表示;

3） 将[V]与[M]进行对接，形成线段;

4） 计算和[VM]有着相交关系的对象，若没有，则当前没有碰撞;若存在多个相交对象，则选择与[V]最近的交点即[C]作为碰撞监测点，此时[VC]即为碰撞距离。

在此碰撞算法中，不同实体模型的构成为多边形，相应线段与物体之间存在着求交运算，此时需要从两点进行考量：线段和长方体之间的对接;线段和多边形之间的对接。然而，若视点与对象距离远超过线段长度，那么只需要判断它们难以相交即可，无需计算出交点。所以，该虚拟系统只需要计算出视点与物体包围范围之内是否有相交即可。

2.4  虚拟场景交互

本文系统的最大优势就是交互具有良好的实时性，该VRML语言有着极强的交互性能，可以分成两类：第一，交互节点构成视场、感应器与插值节点等;第二，编程节点可以借助于程序设计来形成。在前者交互环节，系统形成的事件被交互节点所捕获，然后加以处理。随后借助于Route/To传递至场景，使得后者形成改变。若是交互操作复杂还能借助于Java来完成，这样该VRML交互功能就能得到更大的拓展。此外，虚拟校园系统中的交互与动画都是事件在经过相应阶段之后构成，具体流程如图5所示。

图5  以交互事件路径为基础的流程

2.5  系统优化

对于三维场景而言，实际上就是将浏览器用作默认视点，进而对相关场景描述文件进行解释，若是鼠标或者相关箭头被触发，或者是在场景中进行走动，那么视点就会动态改变。由于复杂场景渲染所需资源極大，为了确保实时性，对系统进行优化就十分重要。

1） 对可视距离进行明确。此时每次渲染只需要对该距离之内场景进行渲染，因为人们在虚拟环境中也只能看到局部，很难对整个场景进行浏览。

2） 利用层次细节模型亦即LOD进行优化。这种方式对远处不重要对象采用较少多边形进行建模，而近处则使用更多的多边形进行建模，这样也能够通过动态调整节约系统资源。

3） 将一个复杂的三维场景进行切分使之形成较小的场景，然后再进行分阶段下载与装入，这样就能明显提升执行效率。

3  系统发布

为了使得该系统有着更高的体验度与真实感，将VRML开发的相关模型置入相应的网页之中。这样就能够与HTML，JavaScript进行融合，通过网页使用该三维虚拟漫游系统。图6中给出相应的全景图，同时，图6b）还给出了相应的计算机学院内部细节图。

图6  系统效果图

4  结  论

将CAD与3D Max等软件系统进行融合，可以更好地构筑真实的三维模型，然后借助于VRML代码使得这些模型对象与人们在VR系统中进行交互。VR与网络技术的融合，可以构筑一个更为方便使用的融合影像、声音等诸多多媒体元素为一体的3D虚拟环境，它不仅对立体模型进行复制，同时还能在其中进行漫游，产生身临其境之感。

参考文献

[1] 李丽，谢丁龙.基于VR的建筑与城市虚拟实验平台设计研究[J].电化教育研究，2012（6）：79?82.

LI Li， XIE Dinglong. Design and research of virtual experimental platform for architecture and city based on VR [J]. Research on audio?visual education， 2012（6）： 79?82.

[2] HUANG Y C， BACKMAN K F， BACKMAN S J， et al. Explo?ring the implications of virtual reality technology in tourism marketing： an integrated research framework [J]. International journal of tourism research， 2016， 18（2）： 116?128.

[3] BUHALIS D， LAW R. Progress in information technology and tourism management： 20 years on and 10 years after the Internet—the state of e?tourism research [J]. Tourism management， 2008， 29（4）： 609?623.

[4] SCHUEMIE M J， VAN DER STRAATEN P， KRIJN M， et al. Research on presence in virtual reality： a survey [J]. Cyberpsychology & behavior， 2001， 4（2）： 183?201.

[5] 吕屏，杨鹏飞，李旭.基于VR技术的虚拟博物馆交互设计[J].包装工程，2017（24）：137?141.

LU Ping， YANG Pengfei， LI Xu. Virtual museum interactive design based on VR technology [J].  Packaging engineering， 2017（24）： 137?141.

[6] MCCABE S， SHARPLES M， FOSTER C. Stakeholder engagement in the design of scenarios of technology?enhanced tourism services [J]. Tourism management perspectives， 2012（4）： 36?44.

[7] YOVCHEVA Z， BUHALIS D， GATZIDIS C. Smartphone augmented reality applications for tourism [J]. E?review of tourism research （ERTR）， 2012， 10（2）： 63?66.

[8] 陈立伟，罗云，李晓燕，等.基于VEGA的旅游景点漫游系统设计[J].计算机工程与设计，2005，26（3）：617?618.

CHEN Liwei， LUO Yun， LI Xiaoyan， et al. Design of tourist attractions roaming system based on VEGA [J]. Computer engineering and design， 2005， 26（3）： 617?618.

[9] BERG L P， VANCE J M. Industry use of virtual reality in pro?duct design and manufacturing： a survey [J]. Virtual reality， 2017， 21（1）： 1?17.

[10] SHERMAN W R， CRAIG A B. Understanding virtual reality： interface， application and design [M]. [[S. l.]：] Morgan Kaufmann， 2018.

[11] THIRUVENGADA H， DERBY P， FOSLIEN W， et al. The influence of virtual world interactions toward driving real world behaviors[C]// International conference on virtual and mixed reality?systems and applications. Orlando： Lecture notes in computer science， 2011： 100?109.

[12] YANG X Y， ZHAN Q C， WANG W W. Research and application for virtual exhibition room of product design based on multimedia network technology [C]// IEEE International Conference on Computer?aided Industrial Design & Conceptual Design. Wenzhou： IEEE， 2010： 111?116.

[13] LI X， CHEN D， WANG L， et al. Research and development of distributed VR driving system based on virtools [C]// Proceedings of the 10th International Conference on CSCW in Design， CSCWD 2006. Southeast University， Nanjing， China： IEEE， 2006： 15?18.

[14] MARTINEZ D， LAWSON J Y L， MOLINA J P， et al. A framework to develop VR interaction techniques based on OpenInterface and AFreeCA [C]// IFIP TC 13 International Confe?rence on Human?computer Interaction. Lisbon： Springer?Verlag， 2011： 101?104.

[15] RADEMACHER M H， SCHNEIDER M， DABS C. Design and evaluation of a VR?user?interface based on a common tablet?PC [C]// Proceedings of the 26th Annual BCS Interaction Specialist Group Conference on People and Computers. Birmingham： BCS Learning & Development Ltd.， 2012： 369?373.

[16] 张小萍，薛骏蜂，王君泽，等.基于VR的建筑物仿真与交互技术[J].测绘科学，2011，36（5）：162?165.

ZHANG Xiaoping， XUE Junfeng， WANG Junze， et al. Buil?ding simulation and interaction technology based on VR [J]. Surveying and mapping science， 2011， 36（5）： 162?165.