主页 > ui设计易尔灵网络科技

ui设计图标设计要素?

50 2023-12-16 12:50

一. 图标功能

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

二. 图标类型

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

1. 功能型图标

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

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

三. 图标风格

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

1. 线性图标

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

2.面性图标

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

3.线面结合图标

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

顶一下
(0)
0%
踩一下
(0)
0%
相关评论
我要评论
点击我更换图片

热点提要

网站地图 (共14个专题15259篇文章)

返回首页