学习如何使用axure8.0自己动手设计制作经典推箱子小游戏

2017年5月22日 阅读:202

推箱子小游戏是一款老游戏了,曾记得在读初高中时流行的英语学习机中基本都有内置这一款小游戏,当时玩的很是沉迷。这是一款益智游戏,需要对地图和箱子位置的充分了解,才能正确地将所有箱子推至目的地。这一款小游戏同样也能使用axure8.0来制作,这一章就教大家如何使用axure8.0来设计制作经典推箱子小游戏。

一、游戏效果图

二、游戏链接

http://weidublog.com/wp-content/case/prototyping2/201705222027/

三、玩法介绍

通过键盘的前后左右方向键移动人物来推动箱子,人物一次最多只能推动一个箱子,当所有箱子都推至目的地时,即算游戏过关。

四、整体设计

这个的整体流程设计很简单,每一个关卡都用一个页面完成,开始、继续和结束也都各自用一个页面完成,全部页面都没有复用。

五、素材准备

一共九张方形图片即可,路、墙、树、箱子、人(上)、人(右)、人(左)、人(下)和目的点。

六、元件拖拉摆放

首先,先摆好地图,其中包括周围、目的地、墙和目的地

然后,放入人和箱子,其中人是一个拥有4面板状态的动态面板,分别放人(上)、人(右)、人(左)、人(下)四种状态。

最后,为人和箱子都分别绑定隐形人和隐形箱子。

七、初始化全局变量

首先初始化3个全局变量,一个是箱子的x坐标、一个是箱子的y坐标,还有一个人物的方向。

八、交互用例设计

1、为页面添加页面按键松开时用例,即当页面检测到有按键松开时,设置全局变量相对应的值,然后移动隐形人,最后触发隐形人的鼠标单击时用例。

2、为隐形人添加鼠标单击时用例

该交互用例分3种情况,(1)当隐形人与墙接触的时候,(2)当隐形人与箱子接触的时候,(3)当隐形人不与任何东西接触的时候

3、为隐形箱子添加鼠标单击时用例

该交互用例分2种情况,(1)当隐形箱子与墙接触的时候,(2)当隐形箱子与路或者目的地接触的时候。

4、为目的地添加鼠标时用例

当目的地与全部箱子接触的时候,跳转至继续页面。

九、其他

维度君这阵子会持续更新axure游戏设计的教程,希望大家可以持续关注维度君的博客:http://weidublog.com,你们的关注就是维度君坚持的动力,谢谢~~

更多axure游戏设计教程:http://weidublog.com/index.php/2017/05/16/154/

作者:维度

转载请注明:http://weidublog.com/index.php/2017/05/22/782/

2条评论

  • 慧行产品说 2017年5月23日在下午3:51

    厉害了我的哥,这也可以。

    • 维度 2017年5月23日在下午5:15

      一切皆有可能,哈哈哈~~~