切图细节——图标

上篇介绍了切图的框架,这篇介绍一下如何高效的切图标。

界面的图标分为两种:功能型图标和装饰型图标。

简单解释一下两种图标功能型图标是有触发效果的图标;装饰型图标仅用于美化页面,提高文字可读性。

1. 图标归类

将图标按照上述两种图标进行归类,这样能够看出整个设计中所有图标是否统一,也防止露掉某个图标。

2. 切图

功能型图标:APP端切图范围至少为88px*88px(@2x,其他倍率自行换算);PC端同装饰型图标

装饰型图标:根据图标大小至少长宽增加2px

3. 命名

建议将图标命名为“模块_类别_功能_状态”,当然,也可以根据自己喜好进行命名(有识别度的命名方式均可)

这种分类切图的方法只是一点小小的经验,在工作中还是多和前端工程师沟通,寻找两人共同认可的方法。


王旋子同学

你可能感兴趣的:(切图细节——图标)