# TkC2wqIxJiz21Tk9kLxcrL0unZc Source: https://dianchukeji.feishu.cn/wiki/TkC2wqIxJiz21Tk9kLxcrL0unZc # 1.工作内容概述 # 2.进度 ## 2.1 基础功能线——功能:点击感叹号,展示物品/生成器的具体信息 - 《浪漫餐厅》效果 - 实现思路拆解——文本提示框的具体信息界面 - 一 底部文本提示框上有1个感叹号按钮,一个多功能区按钮,一个标题区,一个信息区 其中:点击后感叹号按钮,跳出弹窗,是介绍物品/生成器/宝箱的具体信息界面 - 二 具体信息界面 - a 通用规则 - 零 整个具体信息界面由2个核心的UI组件组成,一个是格子分页,一个是格子。一个格子分页包含多个格子,并且格子分页都会有名称。 - 零一 目前的格子分页有4种,一种是等级,所选中的物品/生成器/宝箱,是几级,那么格子分页的名称则是几级,这种格子分页会直接列出所有等级的物品,每个物品一个格子; - 一种是“产自:”,一般是所选中的物品的生成器来源,一般会列出1到2个格子,因为一共物品可能有多个生成器的来源; - 一种是“可生成”,一般是选中某个生成器,列出这个生成器可以产出的物品。 - 一种是”升级后可额外生成“,表明生成器生成到最顶级后,可以新增的生成物品 - 一 所选中的物品/生成器/宝箱,有几级,那么就展示多少个的物品/生成器/宝箱 - 二 格子应该有多少个的问题:目前竞品中,格子每行最多有4个,最少有1个,但是有多少行,则是需要根据所选中的物品不同以及对应的格子分页下属的格子数量不同来决定的。例如,如果有一个格子分页有7个格子,则需要2行来容纳。也就是说,格子的列数是动态变化的,UI也是随之动态变化的,因为格子行数多了,整个弹窗的高度就要增加。 - b 如果选中的是物品:则有2个格子分页,等级格子分页和”产自:“格子分页,分别说明这个物品所属物品链的各个等级物品以及这个物品对应的生成器 - c 如果选中的是生成器:一共有3个格子分页,等级格子分页、“可生成”格子分页、”升级后可额外生成“格子分页 - d 如果选中的是宝箱(暂不考虑),因为目前宝箱还没做 - 目前效果 - 目前问题还比较多,后续需要进行进一步优化 ## 2.2 美术线——优化购买体力弹窗的美术资源,熟悉了cocos中调整UI的操作 - 之前效果问题 - 文字集中在一段,溢出了弹窗 ![图片](../feishu-images/TkC2wqIxJiz21Tk9kLxcrL0unZc_YCRQb2QEKovY.png) - 2个实体按钮上,没有内容 ![图片](../feishu-images/TkC2wqIxJiz21Tk9kLxcrL0unZc_TXosb4AY2oFY.png) - Cocos UI的操作 - 解决文字溢出的问题 - 修改cc.Label中的overflow溢出处理选项 - 一共有3个选项 - clamp:自动截断溢出的文字 - shrink:会把文字约束在边框内,但是会使其缩小 - resize:会根据文本内容的高度,增加文本高度。如果有换行,则会展示换行 ![图片](../feishu-images/TkC2wqIxJiz21Tk9kLxcrL0unZc_K4v4b9zXIo7Y.png) - 解决按钮上没内容的问题 - 新增ActionButton节点,把要挂载的图片资源都默认挂载在ActionButton节点下 ![图片](../feishu-images/TkC2wqIxJiz21Tk9kLxcrL0unZc_VRyPbd9aJoeF.png) ![图片](../feishu-images/TkC2wqIxJiz21Tk9kLxcrL0unZc_AnLEbbuGhoYQ.png) - 目前效果 ## 2.3 美术线——生成并接入商店弹窗的美术资源 - 参考图效果 ![图片](../feishu-images/TkC2wqIxJiz21Tk9kLxcrL0unZc_Mav8bptThos1.png) - 拆分的UI组件 ![图片](../feishu-images/TkC2wqIxJiz21Tk9kLxcrL0unZc_RFsxbHRolozO.png) ![图片](../feishu-images/TkC2wqIxJiz21Tk9kLxcrL0unZc_ZvOdbMNxxog7.png) - 目前效果 ## 2.4 美术线——重新梳理了化妆的逻辑,以此为基础重新设计主副链 - 化妆产品的逻辑 - 分为妆前、妆后、面妆、眼眉妆、唇妆,这几大核心的产品系列 - 妆前和妆后都是各式各样的护肤品:这类型物品,可以单独开一条物品链 ![图片](../feishu-images/TkC2wqIxJiz21Tk9kLxcrL0unZc_QGd1bF4o6oqf.png) ![图片](../feishu-images/TkC2wqIxJiz21Tk9kLxcrL0unZc_BMeZbSg1Mohk.png) - (核心)面妆:主要包括遮瑕/校色盘、气垫粉底(底妆)、定妆喷雾(或者散粉粉饼)、修容(棒、液、粉)、腮红/高光 - 眼眉妆:主要包括眼影、睫毛夹、睫毛膏、 眼线笔、眉笔 - 唇妆:主要以各式各样的口红为主,可以考虑少量润唇膏 - 另新加香氛作为辅助的副链,作为补充 - 物品链设计 - 主链:唇妆链 - 主链:面妆链 - 主链:眼眉链 - 副链:护肤品链 - 副链:香氛链 ## 2.5 美术线——生成并接入面妆链、眼眉链 ![图片](../feishu-images/TkC2wqIxJiz21Tk9kLxcrL0unZc_LzUMbfph2oFN.png) ![图片](../feishu-images/TkC2wqIxJiz21Tk9kLxcrL0unZc_LIPKbvOGpoos.png) # 3.收获与反思 - 在设计物品链时,相对之前的餐厅主题,要花费更多的时间,原因在于 - 化妆的物品相似程度很高,需要挑出没那么相似的几个加入物品链 - 化妆物品很讲究逻辑,如果单个物品链上的物品设计与现实不符合,有可能会招致玩家反感 - 例如:在面妆链中插入眼影 # 4.下一步计划 - 商店弹窗面板:优化+生成并接入美术资源 - UI底部的文本提示框:优化+生成并接入美术资源 - 基础功能线 - 物品/生成器/宝箱的具体信息界面 - 美术线 - 生成并接入剩余的美术资源 - 物品链 - 生成器 - 人物立绘(剧情+订单) - 按钮图标 - 主界面背景图 - 购买体力、钻石、金币的弹窗面板 - 具体信息界面 - UI底部的文本提示框 # 5.项目规划 参考: https://jasminehuang477-cmd.github.io/share_hyper_casual_game_design_guide/#s10 https://merge2iaa-selectionanalysis.netlify.app/ - 开发计划: - **任务详情看第二个文档的十、两周开发建议节奏** - **非开发计划中的内容,不优先开发** - 拆解调研任务 **目标** **核心任务** **完成情况** 完成《浪漫餐厅》关卡/数值相关设计拆解分析,说明从中收获了哪些二合类游戏设计的关键认知,输出拆解分析报告并进行内部分享 - 对《浪漫餐厅》关卡/数值相关设计进行拆解分析 - 总结《浪漫餐厅》关卡/数值相关设计的规律 - 总结二合类游戏设计的关键认知 - 整理以上2点内容,进行内部分享 - 上线前要完成的任务 **目标** **核心任务** **完成情况** 关卡和数值设计铺量 - 对《浪漫餐厅》关卡/数值相关设计进行拆解分析 - 总结《浪漫餐厅》关卡/数值相关设计的规律 - 用AI生成并配置好类似规律的关卡和数值 30% 基础功能 - 文本提示信息框 - 购买弹窗 - 具体信息界面 - 边缘系统 75% 商业化 - 上架微信小游戏 - UI适配(已经跑通流程,只需要再操作一遍) - 打包优化(已经跑通流程,只需要再操作一遍) 30% 更换新主题的美术资源 - 目前还差 - 物品链 - 生成器 - 人物立绘(剧情+订单) - 按钮图标 - 主界面背景图 - 购买体力、钻石、金币的弹窗面板 - 具体信息界面 - UI底部的文本提示框 65% 优化 - 手感调优 - 上线前测试找bug 30% - 风险注意:https://merge2iaa-selectionanalysis.netlify.app/的六、产品风险分析很有价值,开发时需要注意 - **空间压力设计失误** - **订单节奏不合理** - **合成反馈不够满足** - **美术风格不统一**