基于虚拟现实技术的商品展示平台研究

2010-08-16李广丽张红斌

华东交通大学学报 2010年6期

李广丽,张红斌

(华东交通大学 1.信息工程学院;2.软件学院,江西南昌 330013)

虚拟现实(Virtual Reality,也称VR)技术是融合了人工智能技术、多媒体技术、计算机图形学技术和计算机网络技术而发展起来的一种全新的计算机人机交互技术[1],用户可以体验由计算机生成的三维虚拟环境,并自然地与虚拟环境进行视觉、听觉甚至是触觉和味觉的实时交互,获取与真实世界相似或相仿的操作体验。

近年来,随着Web的普及,电子商务也得到了飞速的发展,人们足不出户就可以通过Web完成商品的浏览、选购、下订单等电子交易。文中的虚拟展示平台也是一个基于Web的电子商务系统,它融虚拟现实技术和电子商务技术于一体,在Web环境中为用户提供多感知、深度沉浸感的人机交互界面,突出了产品的展示效果,加深用户对产品的理性认识,为电子商务网站获取更大的销售回报创造基本条件。

1 相关技术介绍

1.1 3DMax介绍

虚拟展示平台设计的基础是三维模型的构建。由于Virtools没有建模功能,故需要采用第三方的建模软件来完成三维建模。3DMax是一款三维建模软件,它已经成为游戏开发、电影电视、动画制作等行业的必备工具软件[2]。本文采用它来制作系统所需的三维模型,并保存为.nmo格式,方便在Virtools中导入,构建虚拟展示平台的三维交互环境。

1.2 Virtools介绍

Virtools将三维建模工具创建的3D对象作为单独的组件,分配独立的制作任务[3]。在任务制作过程中,由于Virtools的架构十分开放,故它允许设计者使用BuildingBlocks(行为交互模块,简称BB)来设计用户与3D对象交互的行为脚本。设计者只要在图形化交互界面上将BB赋予到3D对象或虚拟角色上,并通过流程图方式决定BB中前后行为的处理顺序,实现交互脚本的设计[4]。基于虚拟现实的商品展示平台需借助Virtools来整合所有的三维模型,并完成最关键的行为交互设计。

2 系统设计

2.1 功能设计

基于虚拟现实的商品展示平台是一个以展示商品为核心的Web服务平台。Web用户根据自己的偏好,观察商品的三维模型外观,并了解商品的主要性能参数,若要进一步熟知商品的主要功能,还可通过更复杂的虚拟交互体验获取[5]。因此,商品的三维建模力求逼真,而虚拟交互体验则借助人的视觉或听觉提供趣味性极强的在线商品操作,如“翻转”、“打开”、“关闭”、“听音乐”、“观视频”等操作。消费者足不出户就可获取对商品的真实感官,从而激发对商品采购的热情。本系统以设计一个销售电脑的网上门店为例。

考虑到电脑采购者的电脑知识水平参差不齐,故在电脑三维模型展示时,既要提供直观、平民化的交互体验,还需提供专业的电脑性能参数供专业的电脑使用者体验。此外,要让用户充分地沉浸于虚拟现实场景中,并可自由漫游。故系统包括如下主要功能:

(1)设计一个虚拟的电脑销售门店。该门店销售的所有电脑都可通过虚拟环境进行展示,而用户可与之进行交互,获取与真实电脑销售门店相仿的漫游感官。

(2)设计电脑三维模型。它是虚拟电脑销售门店的核心元素。它的建模与贴图要求十分细致,且必须加入人机交互。因此,电脑的三维建模将更加灵活细腻,外观更加精细美观。此外,在人机交互中加入视频、声音、动画等感官刺激,为漫游者演示电脑的“视频播放”、“图像显示”、“声音播放”等功能,使漫游者可更加深入地认识电脑商品的性能。

(3)设计电脑销售门店中的其它虚拟物体。包括桌子、椅子、展示台等家具,丰富视觉感官和漫游体验的真实感。

(4)设计场景中的灯光。摄影机的布置及数量要合理,以贴近人的真实感觉。

基于虚拟现实的商品展示平台的总体架构如图1所示。

图1 三维虚拟展示平台的总体架构图

2.2 三维场景设计

系统需要进行建模的对象有虚拟门店的场景(包括墙、天花板、地面、展示台、桌椅柜等)和虚拟电脑商品(包括电脑,电脑配件等)。系统采用3DMax7作为三维模型设计的工具。三维模型创建的流程[6]如下:

第1步:3D模型的生成,主要利用3DMax进行建模;

第2步:在3DMax中对模型赋材质与贴图,需要利用PhotoShop修改和制作材质贴图;第3步:改进设计出来的虚拟场景。

2.2.1 虚拟模型的三维设计

一般采用两种方法来构建三维模型:基于模型的三维建模和基于图像绘制的三维建模。设计人员可灵活选择适合自己的建模方法[7]。以电脑商品中的“笔记本”为例,在建模时需要把它拆分成若干简洁的模块,然后分别建模每个模块,最后再将模块拼贴起来构成一个完整的笔记本三维模型。图2是3D Max中笔记本电脑的三维建模,其它电脑的建模同理,不再赘述。

图2 笔记本电脑的建模

图3 贴图后的笔记本电脑

2.2.2 材质与贴图

模型建立完成之后就为模型赋予材质和贴图[8]。材质的作用是形成物体的反射特性。一般使用3种颜色及对物体高光区的控制,就可构造出绝大部分的反射材质[9]。该材质简单,但效果非常好。不同的虚拟对象有不同的赋予材质的方案。贴图则是尽可能逼真地模拟物体表面的纹理,增加三维模型的复杂度,丰富其细节,使其能更加逼真、更加精细地再现实物。

本系统采用PhotoShop完成贴图工作。Virtools中使用65536色或24位色的贴图,且贴图大小必须是2的次方,如64*64、512*512等,但不能超过512*512。贴图最好是正方形,这样可加快3D实时处理的速度[5]。贴图使用的文件格式很多,如.jpg,.bmp等,但在同一个场景中最好使用同一种文件格式。可选择有较高压缩比的.jpg图像贴图。贴图后的笔记本电脑如图3所示。

3 人机交互控制脚本的设计

3.1 第一人称相机的设计

第一人称相机即从漫游者的角度来获取对虚拟场景的认识,它包括前进、后推、上移、下移、俯视、仰视、左转、右转、物体滑动等漫游体验。故需使用第一人称相机做控制,且加入碰撞属性,以增加交互的真实性,用户漫游时会具有很强的切身观察感。第一人称相机的Building Blocks模块设计如下:

(a)Set As Active Camera-Cameras/Montage/Set As Active Camera设置此相机为当前活动相机

(b)Switch On Key-Controllers/Keyboard/Switch On Key按键切换

(c)Translate-3D Transformations/Basic/Translate移动

(d)Rotate-3D Transformations/Basic/Rotate旋转

(e)Object Slider-Collisions/3D Entity/Object Slider物体滑动

第一人称相机的脚本图如图4。键盘控制相机移动,控制键分别为键盘上的↑、↓、←、→、Shift、Ctrl,它们的意义分别为镜头:前进、后退、左移、右移、上移、下移。每一次按键,移动单位为各个方向上的1单位距离,脚本实现如图5。键盘控制相机旋转,控制键分别为键盘上的G,V,C,B,F,H,它们的意义分别为镜头:俯视,仰视,左转,右转,左倾,右倾。每一次按键,移动单位为各个方向上的0.5弧度,脚本实现如图6。对象碰撞设计:设定Camera的碰撞属性Group Obstacles,Radius为碰撞半径。

图4 第一人称相机的整体脚本

图5 键盘控制相机镜头的移动

图6 键盘控制相机镜头的旋转

3.2 电脑商品的多方位展示设计

用户在漫游过程中,可通过单击电脑商品完成与电脑三维模型的交互。可对商品进行键盘的移动和旋转展示,达到每个角度都能展示的目的,当再次单击商品后,商品归回原位,等待下次被用户单击拾取。具体程序流程如图7所示。

图7 电脑商品的多方位展示控制流程

电脑商品的Building Blocks模块设计如下:

(a)Switch On Key-Controllers/Keyboard/Switch On Key按键切换

(b)Translate-3D Transformations/Basic/Translate移动

(c)Rotate-3D Transformations/Basic/Rotate旋转

(d)Wait Message-Logics/Message/Wait Message等待消息

(e)Deactivate Script-Narratives/Script Management/Deactivate Script禁用脚本

(f)Activate Script-Narratives/Script Management/Activate Script激活脚本

(g)Set Quaternion Orientation-3D Transformations/Basic/Set Quaternion Orientation设置朝向

(h)Set Position-3D Transformations/Basic/Position设置位置

其按键切换、移动、旋转等的脚本类似于第一人称相机脚本,不再赘述。仅给出等待鼠标左击恢复初始状态的实现:商品接受鼠标左键点击后,设置成它在三维场景里的初始坐标,同时设置它的四元参数朝向(初始朝向)。然后禁止移动和旋转的进行,进而触发脚本,返回初始处于等待被选取的状态。设置如图8所示。

图8 等待鼠标左击恢复初始状态脚本

3.3 部分交互功能体验

1)点击按钮播放声音。脚本描述:通过触发按钮或者三维实体播放一段音乐。Building Blocks如下,脚本如图9所示。

(a)Wave Player-Sounds/Basic/Wave Player声音播放器

(b)Wait Message-Logics/Message/Wait Message等待消息

2)点击按钮播放电影片段。脚本描述:通过触发按钮或者三维实体播放一电影。Building Blocks如下,脚本同图9,故省略。

(a)Move Player-Materials-Textures/Animation/Move Player影片播放器

(b)Wait Message-Logics/Message/Wait Message等待消息

3)笔记本电脑的翻开和闭合。脚本描述:单击笔记本屏幕部分的虚拟实体,让屏幕绕着中轴(参照物)转动一个特定的角度,即完成闭合。翻开只需绕负方向的轴转相同的角度即可。Building Blocks如下,脚本如图10所示。

(a)Rotate Around-3D Transformations/Basic/Rotate Around围绕旋转

(b)Wait Message-Logics/Message/Wait Message等待消息

图9 等待鼠标左击播放音乐

图10 笔记本电脑的盖子翻开与闭合的脚本

4 系统实现

4.1 在Virtools中导入三维模型

运用3DMax的Explorer软件将3DMax中构建的三维模型以.nmo的格式输出。.nmo文件是Virtools默认的用于存储漫游角色、三维场景以及三维模型等的文件格式,它可以被Virtools识别,以便文件导入。三维模型被默认导入到Virtools的资源库中,当.nmo文件被导入之后,即可添加实现交互的脚本。

4.2 进入场景及选中商品

用户成功登录之后即进入三维虚拟场景,IE中的3D播放插件自动加载三维场景,载入电脑销售门店的三维虚拟场景,如图11所示。作为实验,只在三维场景中放置了一台笔记本电脑的样品,若漫游用户单击该商品即选中该商品,如图12所示。接着,漫游用户就可以与该虚拟电脑完成多种不同的交互。

图11 电脑销售门店的虚拟场景主界

图12 单击选中一台笔记本电脑

4.3 操作交互体验

漫游用户可以选择从不同的角度或距离来观察该商品,获取对商品外观的感性认识,如图13所示。此外,漫游用户还可以尝试打开或关闭笔记本电脑,获取对商品的操作体验,如图14所示。漫游用户还可以选择欣赏播放视频、音乐等,获取对商品功能的更深层次的认识。

图13 任选角度和距离观察商品

图14 笔记本的闭合

4.4 系统发布及测试

借助Virtools把交互、特效、动画、灯光等设计完成后,即可将作品发布。Virtools有两种发布形式:Web网页格式和exe格式。考虑在Web环境上应用本系统,故选择将其打包成Web网页格式。具体发布过程:利用Virtools中的Create Web Page命令把.cmo文件(Virtools默认保存的工程文件)直接发布成HTML的网页格式并且附带生成.vmo格式的文件。发布之后,作为浏览器客户端还需要安装Virtools的Web Player插件,保证虚拟现实场景的正常浏览,该插件可从Web免费获取。

此外,对系统运行过程中的流畅性、运行时间进行了简单的测试,测试的环境分单机测试和内部100M局域网测试。单机测试时建议CPU采用AMD 3200+或以上CPU,内存128MB以上,显示器支持800*600或以上分辨率,16位高彩色,显卡则要求64MB以上的独立显卡,最好支持Direct 3D或OpenGL图形加速。表1是本系统在三台不同配置的PC机上的单机测试情况。测试表明,单机环境下系统能正常运转,系统加载速度基本可以接受,软件运行的效果良好。