• 培训机构
  • 培训课程
18390309275

客服时间:9:00-18:00

71爱课网   培训资讯  UI设计   UI新手如何做能快速出一套界面图标

UI新手如何做能快速出一套界面图标

本文作者: 千锋教育 发布时间:2021-11-25 栏目分类:UI设计 浏览人数:5
【导读】:ui 这个词似乎已经成为了网民除了用户体验之外最熟悉、最流行的词。

ui 这个词似乎已经成为了网民除了用户体验之外最熟悉、最流行的词。 不管你问谁,你都能说出这个词和相关知识。 但是如果你深入研究,能说出ui设计是什么,是否有ui设计的基本指南和技巧指南等等的人并不多,今天我们就带一个UI设计教程,如何快速创建一套 界面图标,供新手谈UI设计。

千锋UI培训

面形图标

面形图标的视觉占比大,有比较强的视觉表达力,通常用在应用中的主要入口。最新的苹果iOS 11底部标签栏就使用了面形图标。那么面型图标的风格要如何统一呢?

在APP界面中,面型图标通常有两种使用方法:正形和反白。我将分别讲下这两种使用情况下,如何进行统一。

1.正形

上图是面形图标的正形使用,要统一风格,要注意的是:面的面积、负形的面积、线条的统一、形的统一。可以从形的形状,圆角进行统一,满足以上3个条件,基本就可以做一套风格统一的面形icon了。正形注意:线的形状、闭合区域的大小、线的粗细、线的断点

2.反白

反白使用时,除了正形图标的3个注意点,还需注意图标和背板的尺寸比例,比例并没有严格的规定,但是建议用0.618黄金比例。

注意点如下:面的面积、负形的面积、线条的统一、形的构成统一。比如:圆角统一、背板和图标的比例

线形图标

线形图标比较轻量化,减少视觉干扰,让用户集中在产品核心功能上。在iOS11以前,iOS原生应用的导航栏,标签栏,工具栏全部采用了2px线框的图标设计。二线形图标的使用也有两种:正形和反白。不建议线形图标的反白使用,因为从设计逻辑上讲,背板结合线形图标是互相矛盾的。

扁平描线图标

扁平描线图标其实是面形和线形的结合,一开始这种设计形式,主要用来做复杂度比较高的插画,后来逐渐在标签栏,首页功能入口这些位置开始应用。这类图标相对于纯面形,纯线形来说,风格明显,个性化程度更强。有一款APP叫“想去”,它的分类图标就用了扁平描线图标,有兴趣的同学可以去看下。

扁平描线图标,统一风格,除了要注意线形图标设计(线的形状、线的粗细、线的断点)以外,要注意填色区域的大小。

基础已经讲完了,当你掌握了统一图标风格的基本方法以后,就可以开始创新,有自己APP特色的图标了。更多UI设计教程敬请到字母网咨询。

免责声明:

一、71爱课网旨在免费为用户传递信息,不代表本站的观点和立场;

二、71爱课网仅提供信息发布平台,对于本文版权归属问题本站无法判断和调查;

三、本文整理于会员新闻,如果侵犯您的版权,请联系管理员删除或增加版权信息(QQ:981561103)。

免费预约试听

只要一个电话
我们免费为您回电