基于网络的产品交互虚拟实验室建设与发布

阎汉生, 肖正涛, 龙宇辉, 张翠婷, 龙 瑶

(1. 广东工贸职业技术学院 机械工程系, 广东 广州 510510；2. 华南理工大学 机械与汽车工程学院, 广东 广州 510640)

基于网络的产品交互虚拟实验室建设与发布

阎汉生1,2, 肖正涛1, 龙宇辉1, 张翠婷1, 龙 瑶1

(1. 广东工贸职业技术学院 机械工程系, 广东 广州 510510；2. 华南理工大学 机械与汽车工程学院, 广东 广州 510640)

利用Unity3D和互联网技术开发了一个用于产品虚拟展示的网上三维交互平台。使用Creo、Rhino等主流三维建模软件构建了若干个典型产品模型,用C#语言编写动作脚本，实现了交互操作,合理配置IIS7.0服务器并实现内网穿透功能,在B/S结构下建设了平台发布网站。该平台作为学习平台,可供用户自由浏览和拆装产品三维结构模型,学习产品结构和工艺知识,也可作为广告平台为企业和商家宣传产品服务。

虚拟实验室； 产品虚拟展示； Unity3D

随着我国经济、社会的迅速发展和高等教育改革的深入,不少高校和职业院校开设了机械设计、产品设计等专业的产品结构认知、机械零件拆装等实验项目,但往往出现产品模型无法满足教学需求的情况[1]。进入21世纪以来,虚拟现实技术得以快速发展,利用虚拟现实技术进行产品展示甚至交互操作,已成为目前的技术热点之一。

虚拟现实(virtual reality,VR)技术是计算机仿真技术的一个重要分支,它依靠计算机软件创建一种虚拟环境,以动态三维视听场景显示要表达对象的多种信息。用户可以获得交互操作的体验,具有浸沉感、交互性和构想性[2]。目前流行的实现虚拟交互的技术之一是Unity3D,国内外已有多家高校和企业开发了基于Unity3D的交互实现方案。例如在国家“863”计划项目中,北京理工大学开发了基于Unity3D的增强现实光学实验平台[3]；临矿集团研究人员进行了船舶液压方面的仿真[4]；腾讯更是采用Unity3D做出了《天天飞车》这样经典的游戏[5]。笔者针对机械设计类认知实验设备缺乏的问题,对展示机械结构和日用产品的交互平台及其在互联网上发布问题进行了研究。

1 三维交互平台的整体结构和开发流程

该展示机械结构和日用产品的交互平台被命名为广东工贸虚拟实验室,最终在互联网上发布。它是以B/S形式运行的一个网站。该实验室的主要内容包括实验室简介、产品展示、新闻资讯、登录、友情链接等模块。产品展示模块是实验室最主要的模块,其下分为家电产品结构认知和机械产品结构认知两个部分。图1是平台的整体结构。

图1 平台整体结构图

平台的开发流程主要是：筛选合适的实物模型—进行拆解测绘—整理产品信息资料—在Rhino或Creo中进行零件建模和整体装配—通过3ds MAX软件进行预处理—生成FBX中间文件—导入Unity3D环境编辑交互脚本和窗口界面—生成可执行的交互文件—嵌入到已完成的产品展示网页—形成完整的交互平台网站[6]。开发流程如图2所示：

图2 平台开发流程图

虚拟交互平台开发的核心技术是在Unity3D编辑器中生成三维交互文件。

2 Unity3D交互文件的制作

2.1 Unity3D模块制作流程

在Unity3D环境下,制作交互文件的基本流程如图3所示。不论具体产品模型是什么,其交互文件的制作流程是基本相同的。本研究已制作了挂烫机、榨汁机、加湿器、减速器、注塑模等多个产品模型。

图3 交互文件制作流程图

2.2 导入模型并搭建场景

Rhino是工业设计专业学生常用的建模软件；Creo是机械设计与制造专业学生常用的建模软件。本文所建平台主要面向这两个专业使用。经测试,Rhino和Creo生成的三维模型均可在Unity3D里使用,但方向不易控制,所以需要先在3ds MAX软件中调整好Z轴方向后存为fbx格式文件,再导入Unity3D才方便使用。

在Unity3D中启用项目面板,找到Assets目录,创建模型文件夹,然后将guatangji.fbx文件加入其中。同样，可以继续创建其他资源文件夹,放入和本模型交互过程有关的多媒体文件,包括声音、音效、贴图、图片等。创建场景的方法是点击在文件选单下的NewScene命令，然后找到模型文件夹里的模型文件,用鼠标拖放到当前场景窗口中即可。这时在Unity3D界面下的game窗口可以实时观察模型,并可做简单的旋转、缩放、平移操作,在层级面板里可以管理所有当前场景中的模型。

2.3 界面设计

目前主要的方法是采用NGUI插件来创建界面和按钮。NGUI是一款基于C#编写的免费Unity3D插件,含有丰富、易用的控件,简化了编码工作量[8]。使用NGUI的基本方法是在NGUI下选择2D UI创建UI根目录,在此根目录下包含其他界面元素分支,例如按钮、界面等。在UIROOT中可以设置和缩放界面的尺寸；在UIPANEL脚本里,可以调整界面的透明度、深度等参数。

以“蒸汽挂烫机虚拟装配”界面的按钮设计为例,在场景→创建→子图形命令下创建按钮图片,命名为Button_yanshi。在检测面板中,可选择自定义图片替换默认图片,使按钮外表更美观。为该按钮的创建→标签→子对象命令添加文本,可更改按钮显示文字为“演示”。依次创建其他界面元素,所得界面如图4所示。

图4 挂烫机虚拟拆装UI设计

点击按钮后的动作功能,要通过编写C#脚本实现不同的场景切换，具体是通过调用OnClick()函数对鼠标点击动作进行监控。Application.LoadLevel()和Application.Quit()函数可分别实现加载某场景和退出当前场景的功能。使脚本和按钮关联也很简单,只需用鼠标把脚本文件拖放到当前场景摄像机上即可。

2.4 视角控制

在拆解和详解场景中都有对产品模型的交互操作,此时观察视角要能旋转、缩放、平移,用户才能有较好的操作感和视觉体验[9]。对于学习产品结构知识来说,通过视角的自由变换才能更细致地观察产品的结构细节；对于商品展示而言,用户通过自由观察才能全面获得该产品的信息。Unity3D自带的第一人称和第三人称脚本,能实现对摄像机视角的控制,适合作为游戏视野,但由于是模拟人眼的观察视角,并不太适合本平台的视角控制要求,故在此不采用。

具体方法是：创建CameraControl脚本,将脚本拖放至摄像机对象加载脚本。在场景空白处按下鼠标右键并移动即可旋转视角；按下鼠标中键并移动可平移视角；滚动鼠标中键可实现缩放的功能。以旋转视角为例,部分核心代码如下：

if(Input.GetMouseButton(1) ){ //检测鼠标右键按下以及鼠标位移坐标 xDeg += Input.GetAxis(″Mouse X″) * xSpeed * 0.02f; yDeg -= Input.GetAxis(″Mouse Y″) * ySpeed * 0.02f; yDeg = ClampAngle(yDeg,yMinLimit,yMaxLimit); //计算鼠标移动的夹角 desiredRotation = Quaternion.Euler(yDeg,xDeg,0); //设置摄像机视角跟随鼠标移动 currentRotation = transform.rotation; rotation=Quaternion.Lerp(currentRotation,desiredRotation,Time.deltaTime*zoomDampening); transform.rotation = rotation;}

2.5 其他操作

在实际操作中,交互类型还有许多,还包括单击帧动画、拖曳动作、零件高亮显示、各种提示信息板等。图5所示为挂烫机虚拟拆卸前后的效果。

图5 挂烫机拆卸过程截图

2.6 生成交互文件

Unity3D之所以发展如此迅速,其广泛的平台适应性功不可没。在File→BuildSettings里可选择与交互文件相适应的平台,包括WebPlayer、PC，Mac & Linux Standalone、IOS、Android等[10]。本文选择WebPlayer发布网页交互文件,进一步勾选“离线部署”(offline deployment)后生成离线文件。在Scenes In Build中加入所有场景文件,点击“编译”(Build)打包发布网页交互文件。将这些网页文件嵌入已做好的产品交互平台网页中,即可在浏览器中访问和操作。图6为交互平台网站——广东工贸虚拟实验室的运行截图。为满足在移动端浏览网站的需求,笔者另外制作了适应手机界面的轻量化网页[11]。

图6 网络三维交互平台截图

3 交互平台网站的配置与发布

3.1 网站的配置

虚拟交互的特点之一是脱离本地限制,能在互联网上运行,供广大网络客户自由浏览。三维产品交互虚拟实验平台不能仅在本地电脑上打开html文件运行,还需要进行网络配置,发布在互联网上。网站采用B/S模式,使用微软的IIS7.0配置服务器。

需要自行配置服务器,而不能采用一般的教学论坛或免费空间服务器的主要原因,在于绝大多数高校的网络教学平台是委托第三方公司开发的、功能已经固化的系统。例如笔者所在单位的得实平台[12],它允许建立的教学网站都是模板化的,能上传的文件类型和访问链接关系也都是固定的,而Unity3D中后缀为js的文件，Unity3D是不允许上传的,也不能自定义访问路径。免费空间服务器可以通过ftp协议上传完整的网站文件,但通常服务器端主机的MIME没有特别修改时,对Unity3D格式文件的是无法识别的,也无法响应。所以必须自行配置服务器,实现以局域网网站的形式正常访问。以笔者使用的Win7+IIS7.0为例,具体操作如下：

(1) 执行Windows的“控制面板—程序和功能—打开或关闭Windows功能—添加IIS信息服务”,把IIS里面的小项都打上“√”。

(2) 在“控制面板—管理工具”里,打开IIS管理器。点击左侧的“网站—default web site”,在其右侧的各种属性中,可以配置其IP、端口(例如80、1234等)、首页路径、网站名称等信息，把整个Unity3D相关的网站文件都复制到“首页路径wwwroot”文件夹内。此处也可以把首页路径和整个网站文件都设置到非系统盘的分区。

(3) 点击左侧最高层的“主机名称”,在其中部的IIS,“MIME类型”中添加“unity3d”和“application/octet-stream”。

(4) 在“Windows防火墙”的“高级设置”中,点击“入站规则”,右侧可“新建规则”,按提示操作,新增名称为“unity3d”、端口为“1234(比较特殊、安全)”的允许访问规则。此时,防火墙为正常开启状态，可以访问http://localhost:1234或者http://192.168.0.110:1234网页,其中的IP为本机IP。到此，实现了局域网的B/S访问,可在页面内正常操作Unity3D交互文件。

3.2 发布在互联网上

要将设在个人电脑上的IIS服务器发布到互联网上,需要把本机端口和广域网域名进行绑定。这里面临两个问题：一是广域网域名通常不是免费的,二是个人电脑的IP地址不是固定的[13]。笔者经过反复研究,找到一个可行的解决方案。

首先在“花生壳”网站注册账号,可获得一个免费域名。笔者注册了一个自定义的二级域名“gdgmvrlab.imwork.net”,然后在网上下载一个“花生壳内网穿透免费版”(HskDDNS_3.2.0.12190.exe),其使用是免费的,但需要少量的首次认证费。在这个内网穿透软件的管理中,新建映射,把免费域名和IIS服务器所在的主机端口映射起来即可。这样,通过免费域名即可访问前文所示的局域网IP和端口。

本方案的优点是可以免费通过广域网网址访问虚拟交互平台,并可正常操作Unity3D文件；缺点是作为服务器的个人电脑要开机才能访问该网站。另外，内网穿透免费版的单月流量目前限制在1 GB,致使网站只能试用,暂不能大规模推广应用。最终解决方法还是要靠单位网络中心积极配合,开放一定的服务器配置权限,以解决开机时间和访问流量的限制。

4 结语

以Unity3D交互编程为核心,综合了零件测绘、三维建模、网站制作与发布等先进技术,开发了一个可在互联网上浏览并交互操作的平台。随着继续增加产品实例,该平台在进行高校机械产品结构认知虚拟实验和企业新产品展示方面可以起到良好的作用,具有较好的社会意义和经济价值,也为相关虚拟交互实验的开发探索了一条有益的途径。

References)

[1] 聂学俊,杜敏杰.机械工程控制基础虚拟实验平台开发[J].中国现代教育装备,2016(8):4-6.

[2] 王佳婧.虚拟实验开发与运用研究[J].软件导刊,2013(8):190-192.

[3] 陈泽婵,陈靖,严雷,等.基于Unity3D的移动增强现实光学实验平台[J].计算机应用,2015(12):194-199.

[4] 吕文梅,宋代广.基于Unity3D与3Dmax的虚拟船舶液压系统三维模型展示[J].软件导刊,2014(6):74-76.

[5] 作者不详.腾讯游戏分享汇：天天飞车六大研发经验[EB/OL].(2014-08-20)[2016-10-18].http://tieba.baidu.com/p/3242901328.

[6] 褚晶莹.基于Unity3D技术的VR展台的设计与实现[D].长春：吉林大学,2016：22-25.

[7] Mohov S. Practical Game Design with Unity and Playmaker[M].Birmingham：Packt Publishing,2013.

[8] 相茂英,马纯永,韩勇,等.基于Unity3D的化工设备虚拟培训系统研究[J].计算机技术与发展,2014(7):196-200.

[9] 刘杨,钱稷,管志翰,等.基于Unity3D的三维虚拟桃树整形修剪系统的应用研究[J].数字技术与应用,2015(7):80.

[10] 张典华,陈一民,李磊.基于Unity3D的多平台三维空战游戏的开发[J].计算机技术与发展,2014(1):192-195.

[11] 怀志和.Android移动网站开发详解[M].北京：清华大学出版社,2013.

[12] 杨香花,谭艳薇,郑许冰.基于得实网络教学平台的《旅游电子商务》网络课程建设与实践[J].吉林广播电视大学学报,2013(8):20-22.

[13] 陈学平,熊伟.中小型网站建设与管理[M].3版.北京：电子工业出版社,2014.

Building and publishing virtual laboratory for products interaction based on network

Yan Hansheng1,2, Xiao Zhengtao1, Long Yuhui1, Zhang Cuiting1, Long Yao1

(1. Department of Mechanical Engineering, Guangdong College of Industry and Commerce,Guangzhou 510510, China；2. School of Mechanical and Automotive Engineering,South China University of Technology,Guangzhou 510640, China)

Aiming at the lack of physical product model in colleges and enterprises,an Internet 3D interactive platform for virtual exhibition of product is developed by using Unity3D and network technology. Several typical product models are built by mainstream 3D modeling software,such as Creo and Rhino. Combining C# to build movement script for interactive function,the Web site is published under B/S structure on IIS7.0 server and has the network transmission function. The users can use the learning platform to freely browse,repeatedly disassemble product 3D structure model, and grasp the process knowledge.This platform can be used as an advertising platform to promote products for enterprises and businesses.

virtual laboratory; product virtual exhibition; Unity3D

10.16791/j.cnki.sjg.2017.04.037

2016-10-24 修改日期：2016-12-08

广东省高职教育教学改革项目(GDJG2015026)；2014年广东省高职教育大学生创新创业训练计划项目(粤教高函[2015]24号)；广东工贸职业技术学院科研项目(2014-Z-06)

阎汉生(1978—),男,湖北宜昌,硕士,讲师,主要研究方向为数字化设计与制造、工业设计.

E-mail：yhs7812@163.com

TP391.9

A

1002-4956(2017)4-0147-05