切图细节——图标

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

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

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

1. 图标归类

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

2. 切图

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

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

3. 命名

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

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


王旋子同学

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 使用sketch最重要的一点是设计好控件的规范。 为做好设计规范需要对色彩进行编号,比如:color_a”_1,c...
    youyeath阅读 26,291评论 2 237
  • 小狼好像不是很明白长大的含义。经常有这样的对话: “妈妈怕辣吗?” “不怕” “爸爸怕辣吗?” “不怕” “狼狼怕...
    Exorcist阅读 200评论 7 0
  • 第二十章 铭哲守夜 文❤十月五 爸爸和小姑的意思,和心蓝想的差不多,只要有一线希望,他们都愿意尝试,绝不能就这样...
    十月五阅读 510评论 29 43
  • 我是一个五年制临床医学本科毕业生,由于工作和个人原因,近期一直感觉到胃不舒服,于是就去医院门诊看病。这是我第一次做...
    雕兄_KYP阅读 3,406评论 2 5
  • 穷人和富人的差别是什么 有天,我在天津车站乘坐出租车,上车以后发现出...
    Sarahzhou阅读 118评论 0 0