一、简介

我们要做的是怎样一款游戏？

　　在前不久成都TGC2016展会上，我们开发了一款《火影忍者手游》的体感游戏，主要模拟手游章节《九尾袭来 》，用户化身四代，与九尾进行对决，吸引了大量玩家参与。 表面上看，这款游戏与其它体感体验无异，实际上，它一直运行于浏览器Chrome下，也就是说，我们只需要掌握前端相应技术，就可以开发基于Kinect的网页体感游戏。

 

二、实现原理

实现思路是什么？

　　使用H5开发基于Kinect的体感游戏，其实工作原理很简单，由Kinect采集到玩家及环境数据，比如人体骨骼，使用某种方式，使浏览器可以访问这些数据。


1、采集数据
　　Kinect有三个镜头，中间镜头类似普通摄像头，获取彩色图像。左右两边镜头则是通过红外线获取深度数据。我们使用微软提供的SDK去读取以下类型数据：

  • 色彩数据：彩色图像；

  • 深度数据：颜色尝试信息；

  • 人体骨骼数据：基于以上数据经计算，获取到人体骨骼数据。

 


2、使浏览器可访问到Kinect数据
我尝试和了解过的框架，基本上是以socket让浏览器进程与服务器进行通信 ，进行数据传输：

  • Kinect-HTML5 用C#搭建服务端，色彩数据、尝试数据、骨骼数据均有提供；

  • ZigFu 支持H5、U3D、Flash进行开发，API较为完整，貌似收费；

  • DepthJS  以浏览器插件形式提供数据访问；

  • Node-Kinect2 以Nodejs搭建服务器端，提供数据比较完整，实例较多。

我最终选用Node-Kinect2，虽然没有文档，但是实例较多，使用前端工程师熟悉的Nodejs，另外作者反馈比较快。