吸引人的图标样式能给你的设计带来良好的用户体验

2021-04-23
3934
0

插画将用户带入叙事中,讲述一个故事,而图标则有更多的功能目的。它们代表内容而不是补充内容。一般来说,插画使用隐喻和叙事来描绘大型主题概念。而图标则简单得多,更适合描绘非常具体的概念。把插画看作是段落,把图标看作是要点。

我分享的一些图标相当详细,可以作为插画处理,所以我让你决定它们属于哪一类。当然有几十种风格,然而在本文中,我将谈谈我最喜欢的那些风格。

 

1. 线性图标

通常,黑色的轮廓,1到3个像素,图标的某些部分是彩色的。

这些图标让网站看起来很有品位,几乎适合任何风格。从更大的图标。

audt.to网站的图标

…到更小、更简单:

paymentx.io的图标

……或者更细致更有品位:

想法

让一个再简单不过的图标成为热门的方法之一就是给它做个动画:

从Lordicon这个动画互动图标库中获得一些灵感:

要避免什么

让我们来看看这套图标,看看哪些地方可以做得更好:

kencko.com的图标

1.使用相同的视角。

2.检查细节。不要让一些图标极简,而其他的图标超级详细。

3.牢记图标的权重。有些对象在视觉上比其他对象占据更多空间。

 

2. “线条 色块 “图标

看看这些明亮而友好的插画:

Packlane的图标

添加色块可以是一个简单的方法来刷新极简主义和标准图标。

Habx的图标

 

3. 等距插画

等距插画可能需要花费很多时间,但结果往往是非常值得的。

模仿现实或创造一个不真实的魔幻世界,都可以用等距插画来实现。

在这种情况下,还有很多公司正在创建遵循相同样式的等轴测图,从而带来整体的用户体验:

 

4. 抽象的极简主义插画

仅仅是几个线条和圆圈,如果没有后续文字,几乎无法理解图标的含义。

同时,我们也很难错过这幅插画–它实在是太大胆了,太抢眼了且好端端的不规则。

 

5. 3D图标

作为一种相当不寻常的方式来表示一些想法,3D图标在创作中并不复杂。通常情况下,这些图标在明亮的色块上看起来很神奇。

Wealthsimple的图标

 

丰富的价格计划设计与一些惊人的3D图标。

 

要避免什么

1.尽量不要写实,而是要增加你的个人风格,股票图标很少能唤起人们的信任或兴趣。

2.不要混合使用轴侧和三维透视图标。

3.请记住,详细的图标应该足够大,以便于识别它们。

 

6. 极简主义插画

相当容易找到或创建,他们将适用于任何网站或应用程序。

想法

尝试重新思考标准图标,并创建极简版的图标。

 

要避免什么

过于通用的图形模板,没有人可以涉及到。

 

7. 图文并茂

这可能是最广泛使用的风格。听起来可能是一种沉闷的风格,然而一些公司证明它可以相当时尚。

最大的挑战是设计的图标不仅要支持你的想法,而且要以愉快和独特的外观为产品增加价值。

想法

部分动画图标。

 

8. 补充内容的图标

有时候,文字附带的图标有点出乎意料。

如果你的大多数用户发现很容易将图标与描述联系起来,而且图标对他们来说似乎很有价值,那么你就走上了正轨。让图标变得有趣或有感情,会提升整体体验。

然而有时很难将图标与描述联系起来,或者对图标的认知与它所描述的点的主旨不同。

不要让人不知道你想用这个图标来表达什么。图标要绝对清晰,不给人留下歧义。

 

9. 自定义绘制的图标

这种类型的图标可能并不适合每家企业,但一些产品品牌可能会觉得它们很有用。

绘制这样的图标需要一定的技巧。然而,你可以尝试Photoshop或Illustrator的插件,将图像转化为草图,并节省一些时间。

“弯曲 “图标。

把毛笔的风格改成手绘粉笔,会有很大的不同。

转载声明:本文来源于网络,不作任何商业用途

免责声明:本文内部分内容来自网络,所涉绘画作品及文字版权与著作权归原作者,若有侵权或异议请联系我们处理。
收藏

全部评论

您还没登录

暂无留言,赶紧抢占沙发
绘学霸是国内专业的CG数字艺术设计线上线下学习平台,在绘学霸有2D绘画、3D模型、影视后期、动画、特效等数字艺术培训课程,也有学习资源下载,还有行业社区交流。学习、交流,来绘学霸就对了。
绘学霸iOS端二维码

IOS下载

绘学霸安卓端二维码

安卓下载

绘学霸微信小程序二维码

小程序

版权声明
本网站所有产品设计、功能及展示形式,均已受版权或产权保护,任何公司及个人不得以任何方式复制部分或全部,违者将依法追究责任,特此声明。
热线电话
18026259035
咨询时间:9:00~21:00
在线客服
联系网站客服
客服微信:18026259035
公司地址
中国·广州
广州市海珠区晓港中马路130号之19
绘学霸客户端(权限暂无,用于CG资源与教程交流分享)
开发者:广州王氏软件科技有限公司 | 应用版本:Android:6.0,IOS:5.1 | App隐私政策> | 应用权限 | 更新时间:2020.1.6