|
背景和目的 本文的背景是《独立防线》（Killer）项目已进行到了一定阶段。虽然之前定下了UI制作规范，但中途也更新了规范，但程序和美术没有具体面对面沟通，也没有阐述规范的原因和落地方法。 所以，本文目的是为UI美术同事介绍：1.手游性能相关的标准是什么；2.具体制作时需要注意什么；3.什么样的UI流程是高效的。 注，以下内容并非要求UI美术同学都掌握、或者要求UI美术单独去处理。而是希望UI美术同学能知道有这些一回事需要考虑。最重要的是：在设计之初，能意识到可能有问题，需要找程序去沟通。 体验和性能 极端的体验和极端的性能都不现实。 
极端的体验 
极端的性能（从2015年的标准来看） 在手游平台上，我们应该追求的是体验和性能平衡。 
体验和性能的平衡 性能评估标准 游戏中，任一元素（UI图片、特效、模型等）对性能的影响都可以拆分为以下4种影响：CPU消耗、GPU消耗、外存消耗和内存消耗。 现就UI相关的影响进行举例如下。 CPU消耗 CPU负责把UI界面的逻辑结构进行更新、汇总，并负责把这些数据准备好。最后把这些信息传给GPU。 UI一般影响CPU的因素包括： 界面结构复杂度 界面结构变化频率 动画复杂度 
复杂的界面结构 GPU消耗 GPU负责最终画面的绘制、渲染。因为渲染是复杂的流程、且运算量巨大、且手机GPU固有的硬件限制（核心数少、浮点运算速度慢），手游的性能瓶颈往往都发生在GPU。 也就是说，GPU消耗是性能优化的重中之重。 UI一般影响GPU的因素包括： 绘制次数（drawcall），和单张图片的数量等因素相关 图片最终在屏幕所展现的面积 图片是否透明 shader的复杂度 重绘度（overrdraw，单位像素的重新绘制次数） 其中，特别值得注意的是drawcall和重绘复杂度。 drawcall 每一个不同“材质”的东西都需要占用一个drawcall。每多一个drawcall必然带来额外的CPU消耗和GPU消耗。 
UI界面的drawcall次数为125次 可以简单认为，当两个东西的材质的shader相同，且纹理相同，则它们是同一个材质，在渲染它们的时候，引擎会进行优化，会合并drawcall为1个。 overdraw 
overdraw健康的UI界面 
overdraw不健康的UI界面 overdraw表示单位像素的重新绘制次数。 右部表示overdraw的程度，越“亮”的区域表示overdraw的程度越高，也就越消耗GPU。 外存消耗 外存消耗指的是资源在用户“硬盘里占用了多少多少M”。 如果外存过大，可能导致用户不愿意下载，或者下载安装后，硬盘空间不够，安装不成功。 一般影响外存的因素包括： 图片数目 图片的分辨率大小 图片是否压缩 另外，优化了外存，内存往往也会从中受益。 内存消耗 内存消耗指的是“游戏在实际运行时，占用多少M”。 如果内存过大，可能会导致用户游戏体验不流畅，甚至crash。 一般影响内存的因素包括： 图片数目 图片的分辨率大小 图片的分辨率是否是2的N次方， 图片是否压缩 UI制作要点 UI输出的图片，可在Unity里设置为新的等比缩放分辨率。 正因如此，UI美术同学在输出UI贴图时，一般情况下按美术示意图的原分辨率输出即可。 
输出图原本的分辨率为788x488
|
|
|
