揭秘APP图标设计流程,让你的图标更吸引人

发布时间:2024-08-30 13:52:30 浏览量:201次

图标设计

身为设计师,图标设计是一项必须掌握的技能,一个具有创意的图标,不仅可以吸引更多用户关注,还能向用户传达一种“高品质、大品牌”的信号。

UI设计

图标设计作为UI设计当中重要的一环,承担着物品、动作、程式等等图形象征的过程,如果对于用户而言,这个对象或行动不明确,该图标就立刻会失去它的实用价值,并成为一个视觉干扰。

那么UI设计师在设计图标的时候,针对这些情况,该怎么处理呢,跟数艺君一起来看。

App 产品界面中的图标设计

功能图标在 App 中的应用场景

以手机为例,几乎所有界面都设有功能图标,尤其是个人设置界面和功能类别繁多的界面中,设置功能图标是非常必要的。在UI设计工作中,设计功能图标已经成为设计师的常规工作。而功能图标的设计水平也体现了设计师的能力。另外,在求职的时候,关于功能图标的设计经验和能力也是简历中的必备项。

功能图标

不同的App产品,功能图标所占数量也不同。根据 App产品的性质不同,少则十几个功能图标,多则几十个。

如下图所示,优酷的分类图标设计得就非常有创意,在类别繁多的情况下依然能够保持良好的识别度,对颜色的使用可圈可点,将优酷的主题颜色——蓝和红体现得淋漓尽致。

分类图标设计

目前,以线下服务为目的的产品越来越多,功能类别也越来越多,例如支付宝的功能分类,如果只使用文字会很难辨识,在这里,功能图标的意义就更加重要了。

设计功能图标时,新手往往会出现做得复杂、充满故事性、图形随意等错误,这是违背了功能图标的基本设计原则的。功能图标设计有3大原则,简洁、规则、统一。重点在于简洁,语义层准确,表达清晰,图形规则有序,线条风格统一。功能图标的重要设计精髓在于简单易懂。

功能图标设计

32像素和36像素单位是App中常见的功能图标尺寸,我们知道,目前的触屏手机最佳范围是44像素,但是如果将图标充满44像素,会太过于饱满。常规做法是,肉眼能识别的视觉尺寸采用36像素,而肉眼看不到的切图点击范围采用44像素,这也是我们在设计功能图标时的一个技巧。

功能图标尺寸

功能图标设计注意事项

设计注意事项

1 圆角和描边粗细不统一

2 图形不规则,比如礼物的丝带

3 没有居中对齐,比如积分

设计注意事项

1 图标极简

2 语义层表达准确

3 图形规则,逻辑严谨

4 风格统一,线条统一

功能图标设计的描边法

目前,功能图标的常用制作方法有两种,各有利弊。一是布尔运算法,该方法相对比较高级,特点是使用稳定并且造型变化空间大;二是描边法,该方法非常简单,适合轻量级设计,但是锚点过多,生成的图标在使用过程中容易出现问题,非常有局限性。描边法不是利用图层样式的描边来实现,而是使用截图中的工具。

描边法

36×36 尺寸功能图标操作实例

按快捷键Ctrl+N新建一个空白文档,大小为36像素×36像素。

36×36尺寸实例

新建一个“钱包”组,选择“圆角矩形工具”,在画布中单击鼠标创建一个圆角矩形,大小为36像素×32像素,“半径”为2像素,设置填充颜色。

热门课程推荐

热门资讯

请绑定手机号

x

微信扫码在线答疑

扫码领福利1V1在线答疑

点击咨询
添加老师微信,马上领取免费课程资源

1. 打开微信扫一扫,扫描左侧二维码

2. 添加老师微信,马上领取免费课程资源

同学您好!

您已成功报名0元试学活动,老师会在第一时间与您取得联系,请保持电话畅通!
确定