当前位置:万古网校 > 职业培训 > IT培训 > UI设计培训 > UI设计教程,新手如何做能快速出一套界面图标

UI设计教程,新手如何做能快速出一套界面图标


  ui这个词似乎成了互联网工作者中除了用户体验外最熟悉不过的热门词,不管你问起谁都能说出这个词及相关的知识。但要是你深究一下,到底ui设计是什么,ui设计有没有基本的准则和技巧指南等等,恐怕没有多少人能说出来。今天我们就UI设计教程,新手怎样做能快速出一套界面图标来聊一聊UI设计。

UI设计教程,新手如何做能快速出一套界面图标

一、什么是UI设计

  UI是用户界面的简称,UI设计师指对软件的人机交互、操作逻辑、界面美观的整体设计。UI设计主要是图形设计和交互设计。图形设计就是传统意义上的美工,以前UI设计不受重视,所以美工地位不高,现在随着UI设计的兴起,美工也被称为UI设计师。其实UI设计师不是单纯意义的美术工人,而是软件产品的“外形”设计师。交互设计主要设计软件的操作流程、树状结构、操作规范等。

  广义的UI设计是艺术与科学的杂交事物,学习它且从事这个职业,就需要这两方面的素养了,大部分人因为各种原因都是无法从事自己最喜欢或最擅长的职业的,如果你感觉自己有一定的潜力并且喜欢,尝试一下未尝不可。

二、UI设计有哪些基本准则

  用色,要让觉得舒服、字体,采用特殊字体、图标,风格保持一致(图形结构和复杂程度)、遵循格式塔接近原理、弥散投影的使用细节、使用与业务属性相关的颜色、信息对齐、头像的选择、元素之间的间距使用、视觉主次对比、主副文案的层级性、合理的图文顺序、文字的颜色对比、背景的颜色倾向、分隔线的使用细节

三、UI设计需要学习那些软件

  UI设计需要学习的软件,分别有PS,AI,AE,ARP,思维导图等软件。

UI设计教程,新手如何做能快速出一套界面图标

  好,简单的和大家说了UI设计常用的的设计软件,那如何去设计呢。别着急咱们继续往下看,如何设计出3种风格统一系统图标呢?图标是决定一个APP风格的重要构成元素,要设计一款讲究的APP,成为一个讲究的设计师。掌握如何设计一套统一风格的icon是基本要求。APP中的图标的类型多种多样,最常出现的有:面形图标,线形图标,扁平描线图标。

面形图标

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

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

  1.正形

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

  2.反白

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

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

线形图标

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

扁平描线图标

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

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

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


-->

联系我们

17621386012

在线咨询: 点击这里给我发消息

邮件:1260585560@qq.com

时间:周一至周五,8:30-20:30,节假日休息

扫一扫,关注微信