HTML5体感游戏《守护拉普达》诞生记

2024-05-20 12:07:06

拉普达是什么？

《守护拉普达》是一款基于HTML5的体感塔防游戏,是腾讯编程马拉松的优胜作品。
拉普达（Laputa）是天空之城的意思。玩家以保护拉普达为目标，通过肢体运动控制准星杀死不断靠近总部的小怪。杀怪可以获取游戏积分，连杀或触发道具都能得到更多积分！分数最终会存入服务器，列入宇宙排名。

演示视频

实现原理

视频体感游戏的核心在于运动的捕获与识别，主要的问题是如何实现运动捕获算法。

关于运动捕方式有很多，于是就存在算法选型问题。我们先后实验过三种方式：色域跟踪、Mean shift、帧差。最终综合了一套方案。下面简单介绍下实现方案。

原理：分析连续关键帧间差异来确定运动区域。再通过运动特征系数加权，最终得到较为准确的坐标。
优点：环境干扰相对较小，且无需特征录入。

处理流程：

1.通过浏览器getUserMediaAPI启动摄像头并获取视频流

2.利用canvas转化图像数据格式

3.利用帧差原理获取运动区域(这里用到(grayscale公式)

灰度 = R*.299+G*.587+B*.114;

我们预先设定了一个亮度敏感度值 sen = 15;

当Math.abs（像素亮度1-像素亮度2）>sen 时，这个点将被纳入运动区域。

4、降噪

栅格化图像，判断每个栅格的运动点密度，排除低于设定值的栅格。这样就得到比较干净的运动区域。

5.运动区域平衡分析

上一步返回的是坐标点阵群，游戏需要的是唯一坐标。数据需要进一步处理。经过观察发现运动点阵分布在画面的区间与动作目的有一定关联性。也就是以画面中心点为基准，判断运动点阵距离中心点距离。以距离为加权因素，越靠边缘因素值越大。最终得出唯一坐标。

6. 每个图像算法最终都会遇到性能问题

这里我们用到了 worker。关于worker：THE BASICS OF WEB WORKERS

以上便是《守护拉普达》实现体感控制的基本原理。在比赛最后一刻我们还在不断优化算法，是一件很磨人的事情。不过结果还算令人满意，带走3个奖项 杰出项目、优秀创新、优秀技术。

PS:Demo代码正在整理，体验地址会稍后放出。

HTML5体感游戏《守护拉普达》诞生记相关推荐

有笔记本就能玩的体感游戏！TensorFlow.js实现体感格斗教程
晓查编译整理量子位出品 | 公众号 QbitAI 小时候的你在游戏中搓着手柄,在现实中是否也会模仿这<拳皇>的动作?用身体控制游戏角色的体感游戏很早就已出现,但需要体感手柄(Wii) ...
在线试玩，在体感游戏中打败泰森，这位小哥破解了任天堂「拳无虚发」
视学算法报道编辑:张倩.陈萍加入体感控制,这位小哥破解了原版任天堂的拳击格斗游戏「拳无虚发」. 在经典红白机上玩拳击游戏是很多人的童年回忆,其中就包括任天堂 1987 年发布的拳击格斗游戏--「P ...
[体感游戏]关于体感游戏的一些思考（三） --- 射击
终于来了...大家一直在期待的部分 --- 射击! 出于某种原因,人们总是被射击弹丸的能力,而引入暴力,则是爆炸的能力所吸引.抛开那些蹩脚的哲学,射击是hard core游戏体验必不可少的,所以让我们 ...
春节假期和幺儿一起玩xbox360的体感游戏
很多年前,我在商场就看到过体感游戏,大大电视,面前有几个小孩,玩得很熟练,看起来蛮有意思. 当时我在想,为什么个体商家愿意拿出设备摆摊,难道这里面有很丰厚的利润? 今年我终于有一个想法,在春节假期和幺 ...
AR体感游戏，体感互动游戏，AR大屏互动
体感游戏,用身体去感受的电子游戏.突破以往单纯以手柄按键输入的操作方式,体感游戏是一种通过肢体动作变化来进行(操作)的新型电子游戏. 通过互联网运营平台,进行人机互动,在线玩家在线互动.竞技运动,聚合 ...
Kinect结合Unity3D引擎开发体感游戏（二）
这篇接着<Kinect结合Unity3D引擎开发体感游戏(一)>,时隔3个月才出这篇,在此期间还有不少机油们,要求出续集,期间在公司那边事情太多,一直帮公司前人做的项目擦屁股,到目前为止, ...
[Kinect]Kinect结合Unity3D引擎开发体感游戏
最近公司项目需要做科技馆的体感游戏,以前也没接触过游戏,虽然以前自己也是想做游戏,我想大部分都是学编程出来来做游戏,哈哈(请允许我淫笑一下,终于可以做这方面).虽然以前没接触过体感游戏,看到的体验也是 ...
[体感游戏]关于体感游戏的一些思考（五） --- 导航
正如我在第二篇博文提到的:在3D虚拟世界中导航是一项充满挑战性的工作.导航模型的实现并不难,难的地方在于设计一个可以让人感觉比较舒服,不会造成玩家总是出现感知上的困难的3D水平.我们真的生活在3D世界 ...
[体感游戏]关于体感游戏的一些思考（一）--- 开篇和“随身”物件
开篇微软的Kinect非常成功地将全身体感游戏平台带给了公众.这套系统包含一个PrimeSense公司的3D传感解决方案,4个麦克风组成的超炫阵列,运行在XBOX上的语音识别算法和顶级计算机视觉算法 ...

最新文章

热门文章