# 260617日报-韦译 260617日报-韦译# 1.工作内容概述- 基础功能线——功能:点击感叹号,展示物品/生成器的具体信息- 美术线——优化购买体力弹窗的美术资源,熟悉了cocos中调整UI的操作- 美术线——生成并接入商店弹窗的美术资源- 美术线——重新梳理了化妆的逻辑,以此为基础重新设计主副链- 美术线——生成并接入面妆链、眼眉链# 2.进度## 2.1 基础功能线——功能:点击感叹号,展示物品/生成器的具体信息- 《浪漫餐厅》效果- 实现思路拆解——文本提示框的具体信息界面- 一 底部文本提示框上有1个感叹号按钮,一个多功能区按钮,一个标题区,一个信息区 其中:点击后感叹号按钮,跳出弹窗,是介绍物品/生成器/宝箱的具体信息界面- 二 具体信息界面- a 通用规则- 零 整个具体信息界面由2个核心的UI组件组成,一个是格子分页,一个是格子。一个格子分页包含多个格子,并且格子分页都会有名称。- 零一 目前的格子分页有4种,一种是等级,所选中的物品/生成器/宝箱,是几级,那么格子分页的名称则是几级,这种格子分页会直接列出所有等级的物品,每个物品一个格子;- 一种是“产自:”,一般是所选中的物品的生成器来源,一般会列出1到2个格子,因为一共物品可能有多个生成器的来源;- 一种是“可生成”,一般是选中某个生成器,列出这个生成器可以产出的物品。- 一种是”升级后可额外生成“,表明生成器生成到最顶级后,可以新增的生成物品- 一 所选中的物品/生成器/宝箱,有几级,那么就展示多少个的物品/生成器/宝箱- 二 格子应该有多少个的问题:目前竞品中,格子每行最多有4个,最少有1个,但是有多少行,则是需要根据所选中的物品不同以及对应的格子分页下属的格子数量不同来决定的。例如,如果有一个格子分页有7个格子,则需要2行来容纳。也就是说,格子的列数是动态变化的,UI也是随之动态变化的,因为格子行数多了,整个弹窗的高度就要增加。- b 如果选中的是物品:则有2个格子分页,等级格子分页和”产自:“格子分页,分别说明这个物品所属物品链的各个等级物品以及这个物品对应的生成器- c 如果选中的是生成器:一共有3个格子分页,等级格子分页、“可生成”格子分页、”升级后可额外生成“格子分页- d 如果选中的是宝箱(暂不考虑),因为目前宝箱还没做 - 目前效果- 目前问题还比较多,后续需要进行进一步优化## 2.2 美术线——优化购买体力弹窗的美术资源,熟悉了cocos中调整UI的操作- 之前效果问题- 文字集中在一段,溢出了弹窗[图片: 图片展示的是游戏内“购买体力”弹窗界面。。]- 2个实体按钮上,没有内容[图片: 图片展示的是《餐厅》餐厅》游戏中购买体力弹窗的原版效果。弹窗上方标题为“购买体力”,下方文字为“体力不足?快来补充体力,继续经营你的餐厅!”。弹窗底部有“看广告”和“10”(代表10个游戏内货币)两个实体按钮。该图片与上下文紧密相关,上下文提到之前的购买体力弹窗存在文字溢出、按钮无内容等问题,此图直观]- Cocos UI的操作- 解决文字溢出的问题- 修改cc.Label中的overflow溢出处理选项- 一共有3个选项- clamp:自动截断溢出的文字- shrink:会把文字约束在边框内,但是会使其缩小- resize:会根据文本内容的高度,增加文本高度。如果有换行,则会展示换行[图片: 图片展示了cocos中调整UI操作的界面情况,重点展示了cc.Label的属性设置区域。界面中有对“overflow”属性的提示,文字排版模式包括CLAMP(节点约束框之外的文字被截断)、SHRINK(自动根据节点约束框缩小文字)、RESIZE(根据文本内容自动更新节点的height属性)三种。右侧显示了购买体力弹窗的相关文本内容“生成棋子需要消耗体力,您可以在这里购买更多体力!”等。该图与文档中美术线优化购买体力弹窗美术资源、熟悉cocos中调整UI操作的内容相关。]- 解决按钮上没内容的问题- 新增ActionButton节点,把要挂载的图片资源都默认挂载在ActionButton节点下[图片: 图片展示了Cocos编辑器中ActionButton节点的层级结构。其中,ActionButton节点下有三个子节点,分别是ButtonBg、ButtonIcon和ButtonLabel。该图片与文档中“解决按钮上没内容的问题”部分内容相关,说明新增ActionButton节点后,把要挂载的图片资源都默认挂载在ActionButton节点下,以解决按钮上没内容的问题。][图片: 图片展示了优化后的购买体力弹窗界面。上方有闪电图标及“+100”字样,表明可获得100体力。下方是灰色长方形按钮,内有蓝色边框,按钮上默认挂载了蓝色宝石图片,数字“1 addCriterion图片内容:]- 目前效果## 2.3 美术线——生成并接入商店弹窗的美术资源- 参考图效果[图片: 图片展示的是游戏内商店弹窗界面,标题为“宝石”。界面中展示了不同数量宝石的价格,分别为100颗1.99美元、265颗4.99美元、580颗9.99美元、1260颗19.99美元、3350颗39.99美元、7450颗99.99美元。每个价格下方都有对应的宝石图标。界面底部有“恢复购买”按钮,左下角有蓝色宝石图标,右下角有咖啡杯图标。该图片与文档中“生成并接入商店弹窗的美术资源”内容相关,展示了商店弹窗的美术效果。]- 拆分的UI组件[图片: 图片展示了《光·遇》游戏商店弹窗拆分的UI组件。包含充值分页、购买道具分页、叉号退出按钮、商店弹窗、未选中分页按钮的底框、选中分页按钮的底框等。这些组件是美术线生成并接入商店弹窗的美术资源的一部分,与文档中2.3美术线——生成并接入商店弹窗的美术资源的内容相关,直观呈现了相关UI元素。][图片: 图片为《260617日报》中“2.3美术线——生成并接入商店弹窗的美术资源”部分的图片,展示了商店弹窗中不同钻石数量的图标及底框。包括8元、30元、68元、128元、328元、648元等不同档位的钻石数量图标,以及对应的购买按钮底框、购买项底框和钻石数值底框。这些图标和底框是生成并接入商店弹窗的美术资源,与上下文介绍的商店弹窗美术资源生成及接入内容相呼应。]- 目前效果## 2.4 美术线——重新梳理了化妆的逻辑,以此为基础重新设计主副链- 化妆产品的逻辑- 分为妆前、妆后、面妆、眼眉妆、唇妆,这几大核心的产品系列- 妆前和妆后都是各式各样的护肤品:这类型物品,可以单独开一条物品链[图片: 图片展示了化妆前护肤的流程。左侧以“妆前护肤”为标题,右侧依次排列着洁面、爽肤水、精华液、眼霜、乳液、面霜、防晒等护肤步骤,每一步骤旁配有对应护肤品的插图。该图与文档中][图片: 图片展示了夜晚护肤流程。左侧“夜晚护肤”标题下,依次排列着卸妆、洁面、化妆水、精华液、眼霜、乳液、面霜等护肤步骤,每一步骤旁配有对应护肤品的插图。该图与文档中“化妆产品的逻辑”部分内容相关,是对化妆逻辑中妆前护肤品环节的直观呈现,强调了护肤步骤的顺序,与文档中提到的护肤品可单独开一条物品链相呼应。]- (核心)面妆:主要包括遮瑕/校色盘、气垫粉底(底妆)、定妆喷雾(或者散粉粉饼)、修容(棒、液、粉)、腮红/高光- 眼眉妆:主要包括眼影、睫毛夹、睫毛膏、 眼线笔、眉笔- 唇妆:主要以各式各样的口红为主,可以考虑少量润唇膏- 另新加香氛作为辅助的副链,作为补充- 物品链设计- 主链:唇妆链- 主链:面妆链- 主链:眼眉链- 副链:护肤品链- 副链:香氛链## 2.5 美术线——生成并接入面妆链、眼眉链[图片: 图片展示了面妆链的8个层级 addCriterion级物品,分别为参考、面妆链1级、面妆链2 addCriterion2级、面妆链3级、面妆链4级、面妆链5级、面妆链6级、面妆链7级、面妆链8级。这些物品以图标形式呈现,直观展示了面妆链的层级结构,与上文提到的面妆产品逻辑相呼应,是重新设计 addCriterion设计面妆链的成果展示。][图片: 图片展示了眼妆链的70级 addCriterion眼妆链]# 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% 优化 - 手感调优- 上线前测试找bug30% - 风险注意:https://merge2iaa-selectionanalysis.netlify.app/的六、产品风险分析很有价值,开发时需要注意- **空间压力设计失误**- **订单节奏不合理**- **合成反馈不够满足**- **美术风格不统一** --- *Source: feishu doc X7ehd3G7LoUAGFxaI6EcUQZJnbd*