今年元宵节的时候，我玩的小游戏里面有限时任务，可以解锁节日限定物品，于是那几天我玩的很欢乐很积极。端午节到来之前，我想玩一下身份转换，从玩家转换到游戏策划。一个有趣的想法在脑海中逐渐清晰。
假如我是游戏策划，首先会对自己灵魂三连问：活动内容什么？活动怎么玩？活动奖励是什么？
现有大体的想法，然后再拆分到各个细节中去。
因为游戏中的一些场景搭配、日常活动名称、称号等借鉴了我最近沉迷的游戏《美人传》，所以这次的游戏仅供学习练习，不做任何商业用途。
站在产品的角度思考活动设计，我的产品视角是这样的：
一入夏，就盼着假期，过了五一很快就会到端午，一想到端午就不由自主的想到美味的粽子。所以端午的活动就来了，包粽子。众所周知，包粽子需要糯米、粽叶等必备材料，而粽子的内馅有很多种，本次活动中需要的是红枣。所以包粽子的材料就选定了糯米、粽叶、红枣三种。（活动内容是什么）
游戏中有日常收集任务，每个收集任务掉落的材料都是固定的。活动期间一般会增加活动材料限时掉落，所以在活动期间，日常收集时会掉落包粽子需要的材料，不同收集任务掉落不同材料。（活动怎么玩）
粽子积累到一定数量就可以兑换节日限定物品。一般游戏中的节日限定物品都是精心设计的，但是由于时间和精力有限，我这次活动设计的比较简单，不同数量的粽子可以兑换不同的称号，最高称号为“荣宠万千”。（活动奖励是什么）
(＾Ｕ＾)ノ~ＹＯ，一切准备就绪，开始干活。
大致画了一下设计草图，帮助理清楚布局思路。（第一次画，还有待提高。）
内容
主要包括用户信息、任务入口、活动入口等展示。
称号规则
称号和糯米粽子数量对应如下：
功能实现
首页页面
样式
头像组件
头像组件主要包括头像图片、称号、花朵点缀三个部分。
花丛组件
这个是参考的网站是的，参考地址我放到了文章末尾。
最终UI
设计为古代的室内，参考的《美人传》小游戏中的UI设计，包括木质的墙壁、门和地板。除此之外还加了一些动画效果增加趣味性：
- 称号上面加了一个花朵做装饰；
- 任务和活动入口上加了光效闪动的效果；
- 地板上的猫咪耳朵和肚子随着呼吸而动；
日常任务收集规则
- 每天0点开始进行资源生产，每个小时生产1万资源，不足1个小时的时候不产生，满足1个小时的时候产生；
- 可以进行资源收集，每次收集完成，对应的资源值进行叠加；
- 不同资源收集时，随机掉落不同的活动材料。对应如下：
功能实现
日常页面
返回组件
每个二级、三级页面都会放返回按钮，所以我封装成了组件。
花朵组件
有些页面需要花朵装饰，所以我把花朵封装成了组件。
开满花的树组件
这个是参考的网站是的，参考地址我放到了文章末尾。
公共方法
有些基础的功能、或者出现频率较高的功能，可以提炼成公共方法。
最终UI
活动规则
活动时间
1.2022-5-31 至 2022-6-5，提前预热3天。
2.页面上设置活动倒计时
- 活动结束前，展示距离活动结束还剩多长时间，时间格式为DD天 hh:mm:ss；
- 活动结束后，展示内容为”活动已结束”;
兑换规则
食材兑换比例
食材兑换规则
- 通过页面按钮进行兑换，当食材数量不足时，按钮不可点击，当食材数量充足时可以进行点击。
- 点击兑换按钮唤起兑换弹窗，可以通过加减号进行兑换数量的修改，当达到最大可兑换值时，加号不可点击。
- 确定兑换之后，粽子数量增加，食材数量对应减少。
功能实现
活动页面
最终UI
活动展示
兑换弹窗展示
本次收获还是挺多的。
- CSS用的别以前熟练了很多，这次的游戏里除了头像图片、一颗树、一簇花，其他的都是我用CSS写出来的，没有用图片素材，实现过程不断收获新的创意。说起来多亏这段时间码上掘金活动，我才能使用CSS实现功能做的如此之快，ღ( ´･ᴗ･` )；
- 游戏设计，体验了一把产品/策划的感觉，站在不同的角度去思考需要实现的功能，锻炼逻辑思维，很有收获；
- 核心功能的实现，包括内务收集的计算、食材的随机掉落计算、粽子兑换的计算等多个计算功能，虽然方法可能不是最优，但是在遇到类似的功能实现算是有经验了；
还差一个github的地址，等有时间我把所有代码上传后，补充一下github地址。
- 花丛和开满花的树参考
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容，请联系我们，一经查实，本站将立刻删除。
如需转载请保留出处：https://51itzy.com/kjqy/199245.html