UI设计里的切图有企业规范还是行业规范?

发布网友发布时间：2022-04-29 01:44

共1个回答

热心网友时间：2022-06-27 21:29

一、切图资源尺寸为双数
智能手机屏幕大小都是双数值，例如iPhone7的屏幕分辨率为750×1334px。为了以为保证工程师在开发时切图资源高清显示，切图资源的尺寸必须为双数。智能手机能识别的最小单位为1px,1px在智能手机中不能被分为两份，所以如果为单数切图的话，手机系统会自动拉伸切图从而导致切图元素边缘模糊，造成开发出来的APP界面效果与原稿效果差距甚远。
二、图标切图输出应根据标准尺寸输出且考虑手机适配
在切图资源输出中，图标切图输出是非常重要的一个部分。在开发中，各机型的屏幕分辨率都不一样，这就需要我们针对一些大屏机型进行适配。
为了适配大分辨率手机，例如iPhone 7plus，在切图时，图标需要输出@2x和@3x的切图，其中@2x的切图能满足双平台大部分机型的适配要求，@3x是用来适配iPhone手机的各种plus版本的手机。
@3x是@2x尺寸的1.5倍，比如一个图标切图@2x尺寸为44px，那么@3x尺寸是66px。
三、尽量降低图片文件大小，提升APP使用速度
图片切图在切图资源中也是非常重要的，例如启动页面、默认图、广告图、新手引导页等。
图片切图通常情况下，文件大小都是相对较大的，不利于用于在使用APP过程中加载页面。所以尽量压缩图片文件大小。
四、可点击部件应当注意其点击区域不小于88px
在iPhone3（320×480px）普通显示屏下，制定了点击区域数值为44px；在iPhone 7（750×1334px）的Retina显示屏下点击区域变成了88px；不管是320×480px尺寸下的44px，还是750×1344px尺寸下的88px，换算成物理尺寸后大致在7mm-9mm之间。
早在人机工程学研究中得出结论，认为人类舒适的触及范围需要在7-9mm，所以iOS官方空间尺寸经常是88px的数值，例如菜单栏的高度就是88px。
五、可点击部件要把相关状态都切图输出，例如：正常状态、点击状态。
在切图时，不能只输出正常状态，还要注意不能遗漏其他状态的切图。这个也是新人经常会出现的失误。