郑州华人电脑职业培训学校

试听课 + 活动课
填写信息优先获取试听课

位置:学校首页 > 学校动态>郑州学UI设计哪家比较好

郑州学UI设计哪家比较好

ui设计师如何切图

当界面设计完成时,设计师需要将图标切片并提供给开发工程师。切图与标注是为了满足开发人员对效果图的的高度还原需求,这直接影响到工程师对设计效果的原度,也是设计师的重要输出之一。正确、准确的切图可以较大限度地还原设计图,起到事半功倍的作用。

通常,我们只需要对icon进行切图即可,文本、线条和一些标准几何形状不需要切图。例如,搜索框只需要描述其尺寸、圆角尺寸、背景颜色值和标签中的不透明度即可,开发工程师可以使用代码来实现这一效果。

切图基本规范

切图的尺寸必须是偶数;

在同一模块内,切图尺寸应一致;

如果有背景,尽量用平铺背景图案进行设计(减少程序体积);

可点击部件把相关状态都切图输出,如正常状态、点击状态和不可点击状态;

输出的切图应尽可能压缩,以减小APP的总尺寸,提高用户的加载速度;

所有变形的字体把它当成icon来切;

切图输出格式:png-24;

重复的东西只切一个。

切图输出类型

1.图标切图输出

桌面图标切图输出

App的桌面图标将用于许多不同的地方,例如手机桌面、应用商店和手机设置列表,因此app桌面图标需要许多不同尺寸的切图输出。对应于两个平台的桌面图标的设计输出尺寸也不同。输出时把双平台的尺寸全部输出切图,桌面图标切图只需要提供直角的图标切图,手机系统会自动生成圆角效果。

系统图标切图输出

一套图形适配双平台:iOS平台(iPhone 6plus版本除外)和安卓平台公用44*44px切图素材,可以实现一套切图适配双平台的开发。

适应大屏幕:为了适应iPhone 6plus和iPhone 7plus,单独切一套比原来44*44px切图大1.5倍的切图,即66*66px切图。

app内功能图标

图标可以有留白区域,建议图标的尺寸不要太大。

2.图片类切图输出

图片类切图主要指启动页面、新手指南页面、默认提示、广告地图等需要完整切图的图片。一般来说,对于工程师开发和使用的相同类型的切图图片,应该保持相同的尺寸。此外,这些切图的文件通常很大,在切图过程中需要控制切图文件的尺寸。


领取试听课
温馨提示:为不影响您的学业,来校区前请先电话或QQ咨询,方便我校安排相关的专业老师为您解答
版权所有:搜学搜课(www.soxsok.com) 技术支持:搜学搜课网