400-920-5594
173-6014-8050
首页 > 资讯中心 > 技术分享
在APP的UI设计中,如何做好图标的设计?
2021-06-18 261 技术分享

  图标(icon)在APP的界面UI中是经常会用到的元素,图标也可以传递信息,在一定程度上可以取代文字,图标设计的好坏可以直接影响整个APP的调性和用户体验。那么,UI设计师要如何才能做好图标的设计呢?

成都App开发

  设计师在日常工作中经常会设计或收集很多图标,可见设计师对于图标的运用很频繁也非常重视,图标的风格也很多,随着收集的图标越来越多,会发现对图标的分类会变得越来越混,做设计时也不清楚到底该参考或运用哪种风格最合适。

  首先将图标按尺寸大小分为两类;细分对应的面性、线性、线面结合、扁平、拟物化等类型;最后选择标准、容器、渐变、3D、手绘、阴影等风格。利用这样的结构层级,可以明确定义图标的类别。

  图标的大小取决于具体功能。例如带有渐变和阴影的图标看起来很酷,但把它缩小到16px,这些酷炫的效果都无法呈现出来。在对图标归类时,首先要考虑图标用在什么位置需要多大尺寸。大尺寸图标通常指标志性图标,例如App启动图标或代表品牌形象;小尺寸图标用作UI控件,起到引导功能或装饰目的。

  图标尺寸越小,展示的细节越有限;相比于大图标,小图标的尺寸有一定局限性,图标组成包括标准和容器两种。大图标利用尺寸上的优势能展示更多内容,分为多种组成形式。简单的图像可以更具包容性,图标的尺寸越小,越考验设计师传达信息的能力。    

  面性图标易于识别,适合应用在小尺寸图标中。注意要确保图标有清晰的边缘,避免羽化;图标复杂程度随着尺寸变小而灵活调整。

  带有背景色的面性图标为简约设计带来了更多可能。通过这个技巧使面性图标更友好,更具吸引力。为背景选择4-12种颜色。考虑图标是浅色还是深色,是否适用于所有背景色。在彩色背景上使用白色图标比黑色效果更好。

  线性图标因为简洁性和现代性而受到用户的欢迎;随着屏显越来越清晰,我们可以更加大胆地使用线性图标。线性图标要确保轮廓像素清晰。越简单越好。追求更简单的细节。

  通过以上对各种图标的分析,希望大家能对图标的分类及设计有更全面深入的认识,从而构建一套完整的图标思维体系。

推荐文章查看更多》