主页 > 设计大全 > 分享UI设计中的图标设计要素

分享UI设计中的图标设计要素

2023-11-15 03:40来源:m.sf1369.com作者:宇宇

一、分享UI设计中的图标设计要素

一. 图标功能

图标是 Web 和 App 设计中的点睛之笔,既能辅助文字信息的传达,也能作为信息载体被高效地识别,并且图标也有一定的装饰作用,可以提高界面设计的美观度。

二. 图标类型

关于图标的类型目前并没有很权威的分类,我根据图标的用途将其分为两大类:「功能型图标」和「展示型图标」。

1. 功能型图标

一般来说,凡是 UI 界面中,用户可以点击的图标均可看成是功能型图标,该类图标往往代表某一功能或某一链接的跳转。这类图标的典型应用场景就是 iOS 系统中的底部标签栏,以及 Material Design 中侧滑菜单选项的左侧。某些列表或卡片内的图标也属于功能型图标,但这类图标往往代表一个功能,而底部标签栏图标往往代表一个页面或板块。2.展示型图标

相比功能型图标,展示型图标更加具有「设计感」,是独特的、有内涵的以及具备辨识度的。一般来说,展示型图标主要是应用程序的启动图标。该类图标代表了一款产品的属性、气质以及品牌形象等。

三. 图标风格

图标的设计风格有很多种,例如:线性图标、面性图标、线面结合图标、扁平图标、轻拟物图标、拟物图标、手绘型图标等,我对其中常见的几种作下简要的介绍。

1. 线性图标

线性图标是由直线、曲线、点等元素组合而成的图标样式。该类图标轻巧简练,具有一定的想象空间,且不会对界面产生太大的视觉干扰。

2.面性图标

面性图标可以简单理解为对线性图标的填充,但面性比线性更加稳重和扎实,对色彩的传达也清晰明显。

3.线面结合图标

线面结合图标典型代表是「MBE风格」图标,其设计特点是采用了粗描边线和偏移的填充面相结合,灵动而鲜明。粗线条起到对画面的绝对分割,突显内容、表现清晰。

以上就是环球青藤小编关于图标设计要素的相关分享,UI设计行业近年来比较火热,如果你想学习,那就快快行动吧!

二、公司名字设计logo免费,企业logo标志设计免费

公司名字设计logo免费,企业logo标志设计免费 提起公司名字设计logo免费,大家都知道,有人问公司名字设计logo免费,另外,还有人想问求设计一个公司名字,logo,你知道这是怎么回事?其实公司名字叫富炜 想请大家设计个LOGO 麻烦大家把设计的上图看,下面就一起来看看企业logo标志设计免费,希望能够帮助到大家!

1、求设计一个公司名字,logo 问:实践作业,设计一个公司,要有名字,logo,企业理念,求帮忙,不要那种…

答:logo标志不仅仅是一个图形或文字的组合,它是依据企业的构成结构、行业类别、经营理念,并充分考虑标志接触的对象和应用环境,为企业制定的标准视觉号。――广州星杉设计

2、公司名字叫富炜 想请大家设计个LOGO 麻烦大家把设计的上图看 大体可以简称2.喻示公司一帆风顺3.喻示公司一路乘风破浪 稳固前行望采纳

3、怎样在浴巾上设计公司名称和logo 在超市找几条合适的浴巾(质量、品牌、价格),然后按浴巾上的联络方式与厂家沟通,现在的厂家都乐于开展类似的定制化服务,你可以提出公司名称及LOGO的设计要求,他们会帮你完成样品。价格不会太高的。找专门的礼品定制企业也可以,网上一搜一大把。

4、做个logo标志 建议您去 网或者拍拍网,输入关键字,比如 图标,自定义图标,图标,图片等等,即可找到,价格大概在10元左右

以上就是与企业logo标志设计免费相关内容,是关于求设计一个公司名字,logo的分享。看完公司名字设计logo免费后,希望这对大家有所帮助!

三、线性图标的设计要点有哪些?

线性图标的设计要点:

图标基础形状一般由外轮廓+内部线条组成。在造型上可以从线条粗细、圆角半径大小、图标复杂程度等方面来考虑。

1、线条粗细

线条粗细不同,图标的力度和重量感也会有差异。

粗线的图标:粗壮、厚重,视觉上看更加突出。

细线的图标:精致、透气。

2、圆角半径大小

圆角越小:视觉上越硬朗和稳重

圆角越大:视觉上越柔美和活泼

3、图标复杂度

过度简洁会导致图标失去该有的识别性,图标太过复杂视觉上会更繁重。

建议在不影响图标识别度的情况下,提升图标的简洁程度同时要表意准确。

4、断点图标

在线形图标基础上面,寻找一个缺口剪断,使得图标具有透气性和线条的变化。缺口的位置尽量保持统一的方向及大小,另外需要控制开口个数,一般不会超过2个。

5、两种线条粗细

外轮廓线条和内部线条用2种粗细大小,丰富图标细节。

扩展资料:

考虑该模块是否为该功能的核心出入口。如果整个产品此功能70%以上都是通过此模块进入的,那么建议采用面性图标;如果此功能还可以通过其他多个模块进入,就可以采用线性图标。

绘制线性图标是UI工作者的日常工作之一,也是UI工作者需要掌握的基本能力之一。初学UI的人在掌握了基本工具(PS、AI等)之后都会从最常见的线性图标开始画起。花花是名UI自学者,在自学过程中也经历了练习线性图标的阶段,今天就和大家聊聊在绘制线性图标过程中的一些体会吧。

统一性

统一性不是说规规矩矩的每一个图标都一样大,毕竟图标有圆有方。大小统一是说一整套图标至少在视觉上是统一的,不会看起来大大小小,参差不齐。

1.规格统一

图标有不同规格大小,比如:120px*120px、60 px *60 px 、58px*58px、29 px*29 px。

图片来自网络

2.色彩统一

一套图标应该有统一的色彩风格,这样才能体现出这套线性图标所要表达的主题或是传达的思想。当然,这里的色彩统一不是说非要用一种颜色,而是说色彩搭配要合理。

图片来自网络

3.风格统一

一套图标应该是整体,就像哲学上所说整体由部分组成,但绝不是部分的简单相加。

图片来自网络

学会灵活使用钢笔工具

灵活使用钢笔工具绘制出需要的形状,并且用钢笔工具进行调整,熟练掌握钢笔工具中锚点、手柄的使用。

图片来自网络

善于利用布尔运算

在绘制线性图标时,我们经常会遇到一些奇奇怪怪的图形,或者是一些图形没有现成的形状供我们使用,当然我们可以利用钢笔工具进行绘制,但相比于钢笔工具,布尔运算是更好的选择。运用图形或选取的相加相减来绘制图标会使得图标更加标准、规范,而且后续还可以自由调整基础细节,不至于用手动调节而造成不一致。

线的粗细一致以保证图标的统一性

、线条粗细

线条粗细不同,图标的力度和重量感也会有差异。

粗线的图标:粗壮、厚重,视觉上看更加突出。

细线的图标:精致、透气。

2、圆角半径大小

圆角越小:视觉上越硬朗和稳重

圆角越大:视觉上越柔美和活泼

3、图标复杂度

过度简洁会导致图标失去该有的识别性,图标太过复杂视觉上会更繁重。

建议在不影响图标识别度的情况下,提升图标的简洁程度同时要表意准确。

4、断点图标

在线形图标基础上面,寻找一个缺口剪断,使得图标具有透气性和线条的变化。缺口的位置尽量保持统一的方向及大小,另外需要控制开口个数,一般不会超过2个。

5、两种线条粗细

外轮廓线条和内部线条用2种粗细大小,丰富图标细节。

相关推荐

川菜菜谱图片

设计大全 2024-01-09

徽章自定义的图片怎么做

设计大全 2023-11-18

半开放式厨房效果图片大全

设计大全 2023-11-10

中式门楼高度多少?

设计大全 2023-09-30