前言:
  记得上大学那会, 有位传说中的大牛, 写了一个网页闯关类的游戏. 当时我们玩得不亦乐乎, 也是第一次接触到这种形式的游戏. 不过当时纯玩家心态, 并没有想过去创造一个.
  最近想起这事, 突然想复制实现一个类似的网页闯关游戏. 说干就干, 抄起家伙, 就是一顿猛打, ^_^. 期间的坎坷曲折暂且不表, 甚至中途自觉江郎才尽差点放弃, 所幸最后终于完工, 愿意和大家一起分享该游戏.

展示:
  网页闯关游戏, 更多的被称为riddle, 是一种考验搜索, 推理, 分析能力的闯关模式游戏. 用户群往往面向IT工程师, 不过随着移动端的普及, 一些基于pc浏览器的分析手段没法在手机端得到施展. 因此最终转变了目标用户的设定, 更加大众化, 贴近移动端, 当然pc浏览器端体验依旧是最好的, ^_^.
  闯关游戏入口如下: http://magic.mmxfgame.com/magic_game/1001.
  • 传统模式
  闯关模式入口 
  • 挑关模式导航
  第一关: 藏在图中的秘钥
  第二关: 无处不在的植入广告 
  第三关: 大家一起来找茬 
  第四关: 倾听女神的故事 
  第五关: 勇敢的小方块 
  第六关: 拜访东方不败的故居 
  第七关: 明信片中的打油诗 
  第八关: 葫芦娃喜欢的歌 
  第九关: 女王大人的心扉 
  第十关: 神秘的表白答复 
  • 附加关(需要计算机专业背景)
  第十一关: 健忘的教授

游戏玩法:
  每一关都有出题背景, 提示线索,需要玩家去寻找秘钥. 当然囿于关卡的独立性, 游戏本身不会很难.
  以第六关--拜访东方不败的故居 为例, 可见其布局区域.
  
  蓝色区域为解关秘钥输入区紫色区域为谜题区域绿色区域为提示线索区域.
  这一关背后的技术点是刮刮卡, 背景故事和线索提示都是围绕这个来展开的.
  找到隐藏的谜底后,输入秘钥,即可进入下一关.

关卡举例:
  游戏分别考察了可玩性,推理和搜索能力.
  • 可玩性
  以第五关--勇敢的小方块 为例
  
  其复制之前流行的Flappy Bird,答案需要通过一定数量的管子,才能获取到,就是这么直接而简单.
  • 搜索
  以第四关--倾听女神的故事 为例
  
  表面上只是和女神聊聊天(大伙喜闻乐见的事), 如果沉迷其中就误入歧途了^_^. 其实本质是考察搜索能力,百度一搜答案就出来了.
  • 推理
  以第九关--女王大人的心扉 为例
  
  通过破解数字锁,来考察玩家的推理能力.

技术和思索:
  随着目标用户和主要平台的确定, 其和以往的Riddle游戏相比差异非常的明显.
  当然html5的使用,也是这次的重点,之前考虑到部分浏览器不支持,有些犹豫,现在全然放开了,html5是大势所趋.
  游戏的布局也更加倾向于移动端,不过鉴于技术的不成熟,现在仍旧显得简陋,不过说明潜力很大,^_^.
  通过写这十关,收获特别的大,无论是技术上的,还是产品意识上的.希望借这系列的机会,把各个关的技术点好好总结下.

总结:
  写此博客,就是希望大家能喜欢玩我的游戏,也希望听取大家的有益反馈. 我希望自己能够继续,后续再出几个系列,加点账号,多点排行榜,与君共勉.

公众号&游戏站点:
  个人微信公众号: 木目的H5游戏世界
  
  个人游戏作品集站点(尚在建设中...): www.mmxfgame.com,  也可直接ip访问http://120.26.221.54/.

网页闯关游戏(riddle webgame)--游戏玩法和整体介绍的更多相关文章

  1. 网页闯关游戏(riddle webgame)--H5刮刮卡的原理和实践

    前言: 之前编写了一个网页闯关游戏(类似Riddle Game), 除了希望大家能够体验一下我的游戏外. 也愿意分享编写这个网页游戏过程中, 学到的一些知识. 对于刮刮卡, 想必大家都很熟悉, 也很喜 ...

  2. 网页闯关游戏(riddle webgame)--SQL注入的潘多拉魔盒

    前言: 之前编写了一个网页闯关游戏(类似Riddle Game), 除了希望大家能够体验一下我的游戏外. 也愿意分享编写这个网页游戏过程中, 学到的一些知识. web开发初学者往往会忽视一些常见的漏洞 ...

  3. 网页闯关游戏(riddle webgame)--仿微信聊天的前端页面设计和难点

    前言: 之前编写了一个网页闯关游戏(类似Riddle Game), 除了希望大家能够体验一下我的游戏外. 也愿意分享编写这个网页游戏过程中, 学到的一些知识. 本文讲描述, 如何在网页端实现一个仿微信 ...

  4. Kinect+unity 实现体感格斗闯关小游戏

    文章目录 项目地址 1 项目概况 1.1 项目简介 1.2 项目目的 1.3 主要技术 2 设计 2.1 基本概念 2.2 框架 2.3 算法 2.4 模型 2.5 调查问卷 3 实现 3.1 技术难 ...

  5. XSS闯关游戏准备阶段及XSS构造方法

    请下载好XSS闯关文件后,解压后放在服务器的对应文件夹即可 在该闯关中,会在网页提示一个payload数值 payload,翻译过来是有效载荷 通常在传输数据时,为了使数据传输更可靠,要把原始数据分批 ...

  6. 分享:计算机图形学期末作业!!利用WebGL的第三方库three.js写一个简单的网页版“我的世界小游戏”

    这几天一直在忙着期末考试,所以一直没有更新我的博客,今天刚把我的期末作业完成了,心情澎湃,所以晚上不管怎么样,我也要写一篇博客纪念一下我上课都没有听,还是通过强大的度娘完成了我的作业的经历.(当然作业 ...

  7. 自制Unity小游戏TankHero-2D(3)开始玩起来

    自制Unity小游戏TankHero-2D(3)开始玩起来 我在做这样一个坦克游戏,是仿照(http://game.kid.qq.com/a/20140221/028931.htm)这个游戏制作的.仅 ...

  8. 某xss挑战赛闯关笔记

    0x0 前言 在sec-news发现先知上师傅monika发了一个xss挑战赛的闯关wp([巨人肩膀上的矮子]XSS挑战之旅---游戏通关攻略(更新至18关)https://xianzhi.aliyu ...

  9. 口红游戏 插口红游戏 h5页面开发

    目前火热的口红机游戏,需要在设备前参与,然后成功后即可赢得口红,作为平台运营者来说还是比较重资产的,目前我们将它搬到了线上.每个人都可以远程玩这样的口红机游戏了.直接在手机微信里试玩,成功后,后台即可 ...

随机推荐

  1. python_way ,day25 wmi

    pip install wmi  如果不能安装,就使用 安装 python3 -m pip install wmi 再安装pywin32这个包 使用: import platform import w ...

  2. 【转】linux命令详解:md5sum命令

    [转]linux命令详解:md5sum命令 转自:http://blog.itpub.net/29320885/viewspace-1710218/ 前言 在网络传输.设备之间转存.复制大文件等时,可 ...

  3. JQuery_进阶选择器

    在简单选择器外,还有一些进阶的选择器方便我们更精准的选择元素. 1.群组选择器 可以将相同的样式合并 <script type="text/javascript" src=& ...

  4. jQuery的环境配置

    目前最新的版本,是 1.10.1 和 2.0.2,如果你需要引用到你线上的项目,就必须使用压缩版,去掉了注释和空白,是容量最小. 从CDN中载入JQuery,如Google中载入JQuery: htt ...

  5. C学习笔记(八)字符输入输出和输入确认

    缓冲区 缓冲区分为两类:完全缓冲(fully buffered)I/O和行缓冲(line-buffered)I/O.完全缓冲在缓冲区满时被清空(内容被发送至目的地).这种类型常出现在文件输入中.缓冲区 ...

  6. 【转】Image Cyborg 一键下载存储网页所有图片

    下午仿照网上例子写了个抓取网页中图片并保存到本地的Python的例子,好奇就google了下是否有类似的在线抓取图片的外挂工具. 接着就找到了Pseric写的这篇文章 - Image Cyborg 一 ...

  7. ssh和putty

    SH(Secure Shell的缩写),由 IETF 的网络工作小组(Network Working Group)所制定:SSH 为建立在应用层和传输层基础上的安全协议.SSH 是目前较可靠,专为远程 ...

  8. c语言完成分块查找

    首先要把一系列数组均匀分成若干块(最后一个可以不均匀) 每块中元素任意排列,即块中数字无序,但是整个块之间要有序.因此也存在局限性. #include<stdio.h> //分块查找法 v ...

  9. linux修改密码的几种方法

    1.  启动电脑 ,进入grub模式.  也就是下面这个模式: 按下e键,进入下面这个画面.... 选第二个(kernel的那个):  然后按下e键之后进入 下面这个版面: 之后敲入  single ...

  10. MVC部署到iis

    程序域功能->打开或关闭->iis信息服务及.net framework下的两个要勾选 1. 发布程序,以文件系统file system 的形式,发布到一个文件夹里    自定义-> ...