基于全景摄影的网页设计研究

楼晓燕 谢文骏 谢志远

摘 要：本文设计了一个酒店内部外部环境的全景网页，首先用单反相机开始全景拍摄，然后对图像用photoshop，photomatix pro和PtGui等软件，将照片进行处理和拼接，最后用Pano2VR软件制作网页，整个网页真实立体，没有拼接瑕疵。用户可以真正体验到信息时代在足不出户的情况下给我们带来的非凡的乐趣与享受。

【关键词】全景网页 虚拟现实技术 互联网

随着互联网技术的进步发展，我国的网络营销也越来越普及，企业的竞争与生存空间正逐步从传统市场转向网络市场，营销方式也从传统的市场营销转向网络营销。虚拟现实技术从兴起至今已经有二十多年了，发展迅速，已经渗透到了各个产业和领域。旅游信息互联网化渐渐成为了一种趋势，目前虚拟旅游仅处于起步阶段，但其发展潜力却极其巨大。本设计研究的是一个基于静态图像的虚拟现实技术，它可以简单地在电脑网络上实现，主要通过视觉接口使人沉浸在虚拟情境中。

1 设计理念

为了体现出全景网站的核心功能，让用户身临其境的观看酒店的环境，我们的做法是直接把全景展示放大到全屏，让客户一经登陆就可以直接直观的看到全景展示。所有操作按钮采用居中布局，并且在不需要的时候自动缩小并半透明化。在功能按钮的选择上，只保留了最基础的功能，比如上下左右键以及放大缩小键还有全屏键，目的就是在保证使用性的前提下，秉持着简既是繁的原则，让用户在浏览时可以完全沉浸在全景的虚拟现实效果中不受干扰。整个网页的设计理念就是让用户拥有沉浸式的浏览体验，顺畅的浏览效果是网站的前提，所以我们选择了比较新颖的html5技术来对全景图片进行球形模拟，html5技术对移动端的支持也更好，用户用手机浏览时也可以流畅体验。

2 全景拍摄工艺

对于全景拍摄的工具考虑到成本、效率等多方面的因素，我们主要采用的是单反相机、鱼眼镜头、云台设施和三角支架，虽然说普通的傻瓜相机也可以进行全景图的拍摄，但是因为图片的实际拍摄效果如清晰度等相对来说无法满足质量上的要求，鱼眼镜头是广角镜头，焦距短，能观察得画面相对较大，三角架主要是用来固定支撑镜头的位置，保证拍摄时所有设备的牢固，为了防止出现较大的视差，要确保相片的曝光率和焦距参数的一致等，因为无法在单层图片上同时表现全景图的亮部及暗部细节，所以在拍摄时应该对同一方向进行多个曝光度的拍摄，后期需要用到photomatix pro等软件对图像进行高动态处理（HDR）。

另外，在斜拍补地工艺上进行了创新，加大了斜拍补地的角度，将原有的45度斜拍增加到60度，因为在实践中发现，虽然45度斜拍时可以包括进更多的补地内容，但是在最后ptgui优化器的视点校正中，通过算法还原原有的视点位置难度更大，也就更容易出现拼接接缝。然而用60度的角度补地这个问题就可以很好的解决。利用创新的60度斜拍补地法，可以很好的将三脚架以及倒影等不应该出现在画面中的信息去除，以达到完全纯粹的还原拍摄地的真实场景的目的。

3 全景图片的网页设计转化

通过装有15mm鱼眼镜头的全画幅相机使用十张工艺拍摄60张一组的平面图片 其中包含jpg格式以及nef格式。jpg格式用于预览，nef格式用于实际拼接。采集样品图如图1所示。然后，使用capture nx2对60张每组的图片中的nef格式进行初步微调以及转化成jpg格式，首先使用高光以及阴影选项进行高光及阴影部分的细节还原，接着使用色温以及色调选项使场景色温还原真实色温，最后输出jpg格式保存，并且使用批处理器将设置套用到其他图片上最后得到30张通过初步调试的紧迫感、格式图片。将这30张图片呢导入到ptgui软件中首先使用自动拼接功能得到一张初步拼接的全景图，然后通过水平校准器校准图像的水平和校准控制点，加入斜拍补地的照片，同样通过寻找控制点的方法与另外两张垂直补地的照片进行匹配后，通过视点校正功能还原斜拍补地照片原来的三维位置，最后用蒙版功能将多余的部分擦去，最后输出图片得到一张准确曝光的全景图。接着用相同的方法再得到一张欠曝图像以及过曝图像。将3张不同曝光度的全景图导入photomatix pro软件中进行高动态处理，使用色调映射选项先将三张图像进行初步合并，调节对比度，颜色饱和度以及白点黑点等得到一张同时拥有高光细节以及阴影细节的高动态全景图，重复以上的方法制作多张不同场景的全景图，并导入pano2vr中，修改显示参数，初始显示角度和缩放角度等，最后将获得的虚拟文件放到网络服务器的网页页面中，得到的网页效果如图2所示。

4 结束语

全景真正要达到专业标准的水平要下很多的功夫，会因为天气、仪器设备、拍摄技巧、软件的处理能力种种因素导致全景网站的设计美中不足。本设计以极简风格为主导，设计了一个让用户身临其境的观看酒店的环境，给用户提供了一种新的场景展示形式。

参考文献

[1]刘海娜.基于HTML5的全景漫游技术研究[D].郑州：郑州大学，2013.

[2]朱学芳，苏勇，史学海，汪民林.基于Internet的3D虚拟场景制作及在DL中的应用[J].现代图书情报技术，2006，1（4）： 77-80.

作者简介

楼晓燕（1989-），女，浙江省杭州市人。现为浙江大学城市学院实验中心教师，从事计算机技术的教学和研究。

作者单位

浙江大学城市学院信电分院实验中心 浙江省杭州市 310015