UI设计、标准、掌握能力、工具软件

一、什么是 UI 设计，UI、UE、UX、GUI、ID 有什么区别？

我们常说的 UI 设计，即用户界面设计“User Interface Design”，大家常常混淆几个概念：UE、UX、UI 、GUI、ID，我们一起看看他们之间的关系和区别：

很多传统的企业把 UI 设计等同于美工，实际上有很大的差别，美工主要是负责界面的美化，而 UI 设计师不仅要负责界面的美观，还要站在产品的角度，参与流程的优化、把设计进行工程化的输出。比如有人说学好 PS 再去临摹一些界面就能成为 UI 设计师，对不起，还差得远。

二、好设计的四个标准

1.好的设计首先是实用的

优秀的界面视觉设计，一定是便于用户使用的。利于使用，是设计的根本需求。设计师未必是好的艺术家，好的艺术家也未必是好设计师

我们遇到不少初学UI设计的同学在问：“学设计要从学手绘开始吗？”有这样的疑问，其实是没有区分开设计和艺术的不同。设计和艺术是不一样的：设计本身是服务于产品，是在一定规范下完成信息的传达，而艺术品纯粹重在表达。UI 设计师是用自己的设计服务于产品，在视觉规范下完成信息的视觉传达和表现，最终满足用户的需求。

2、容易让用户快速学会使用

在尼尔森可用性标准中，有一个易学性原则。遵循这个原则，在保持美观性基础上,更重要的是能够准确、快速、有效地传达信息，让用户更容易学会使用。

微信“摇一摇”的图标，就能够让用户快速学会如何使用这个功能。

搜索界面、语音图标，能够引导用户快速使用语音功能。

微信会话界面输入控件旁的笑脸，能够让用户快速学会发表情。就算是爷爷奶奶看见这个笑脸，也更容易理解这里可以发表情给你吧。

3、产品中的设计元素都是统一的

设计师如何能让用户快速、有效、容易地使用产品？那就需要设计师保持在产品中的设计元素的统一性。

建立统一的标准

这里提到的统一指的是在同一套标准下，设计上面的统一，即同样的功能保持一致。设计师需要建立和维护视觉设计规范，来保持设计的统一性。我平时不管是带新人还是教别人，都会通过大厂的设计规范，让大家学会如何建立和维护视觉设计规范，便于保持设计元素的统一性。

相同功能保持一致

针对相同的功能，在视觉呈现上保持一致，达到统一的效果。统一是降低学习成本的关键，统一的界面设计，可以降低用户的学习成本，能够提高产品使用效率。

4、好的设计必须是美学的体现

好的设计在视觉上必须是美的体现，这里有一个关键点：对于目标用户来说，设计要好看。

这里的的关键点就是“目标用户”认为的好看。设计并不是设计师主观上的好看，而是需要深入了解和考虑目标用户的审美喜好，做出他们觉得好看的设计。

比如：你作为设计师，要为3-6岁的儿童设计一个界面，那么你就需要深入了解这个年龄段的孩子认为什么样的美的。或许作为成年人的我们认为“性冷淡”风更显高级，但是对于孩子来说，“红配绿”或许是他们最爱的。

三、UI 设计师必须掌握的 5 项能力

UI设计入门需要掌握 5 项能力:

1. 图形造型能力

比如你要画一个星星图标，不仅需要画出一个“星星”的形态，还要符合造型审美。

2. 图形表现能力

你画的这个星星不仅有“星星”的造型，还要有质感，比如毛茸茸的质感、大理石的质感。

3. 色彩表现能力

你怎么为“星星”进行色彩配色，比如说用渐变邻近色，还是选择对比色配接起来配色。

4. 终端规范能力

你把这个“星星”做好之后，放在界面里面，需要注意哪些，比如界面最小可点击范围是48px * 48px，那么就要注意这个“星星”图标尺寸不要小于这个尺寸。

5. 终端界面能力

当图标这种小元素做完之后，放在整个界面里，要注意优先级排序，以及界面与界面之间的逻辑关系。

四、做设计师要用到的工具软件

1.基础工具

Office 系列必须会用，这是职场人的基础，这里不再多说了，使用 Mac 的同学也要会用 Pages、Keynote、Numbers。另外石墨、语雀等在线工具也有很多团队用于协作。这些工具大家都有一定的基础，学起来也不难。

2.信息架构工具

这些也不用多说了，UI 设计师和交互设计师、前端设计师、产品经理都要保持密切协作，甚至有很多 UI 设计师具备全链路的能力，如果不想当一个只会画图、没有思维的工具人，这些必须要掌握。

MindManager、Xmind、Excel、MindNode

3.原型制作工具

纯粹的美工，噢不，是 UI设计师，在实际工作中可能不需要深入使用这些工具，但是为了了解交互、和交互设计师协作，这些软件多少要有了解。

Axure RP、Sketch、Adobe XD、Afflnity Designer

4.图形处理工具

这就是 UI 设计师的核心了，PS 是使用最广泛的，用 Sketch（Mac）和 XD（Windows）的也很多，Sketch/XD 比较轻量级，基本能满足 UI 设计师的日常工作需要，如果想在插画方面深入学习的话，可以学 AI。

Adobe Photoshop、Adobe XD、Sketch、Adobe IIlustrator

五、通过哪些软件能够学习 UI 设计的知识、理论和方法

Dribbble（http://dribbble.com）

Dribbble 是一个著名的设计师作品分享平台，全球设计大神云集，在网站上搜索英文关键词便可看到相关作品。作品包括品牌设计、手绘插画、动效、排版、网页和移动端 UI 设计，是所有专业设计师寻找灵感、了解当今设计潮流、趋势不可错过的网站。

Awwwards.（http://awwwards.com）

Awwwards. 是一个世界各地优秀设计师的聚合点，他们在这里寻找灵感、传授知识和经验、相互联系并分享具有建设性和富有尊重的批评。网站的口号是：“始终质疑”，“不断发展”，旨在表彰世界上最优秀网页设计师、开发人员和代理机构的才能和努力。

在这里我们可以看到 UI 设计、艺术插画、摄影、建筑、时尚、房地产、游戏、电商等 25 个分类下的作品。

花瓣（http://huaban.com）

花瓣网是国内的社交分享网站，网站允许用户创建和管理主题图片集合。用户收集了来自各个网站的优秀设计，在这里可以看到海量的优秀设计作品，你在查看一个作品时能够为你推荐更多优秀的同类作品，是设计师寻找灵感创意不可错过的网站。

花瓣网的页面采用流式，用户浏览时内容自动加载，无需翻页，用起来简直不要太轻松！

知群设计圈（App）

设计圈旨在为设计师、产品经理提供同频次的职业交流平台。在这里你可以学习和设计、产品相关的理论知识；临摹分析规范作品集；搜索查看高清图片素材、设计流程；和同行业产品经理、UI设计师、UX设计师交流，共同成长为界面设计和产品设计专家。

六、想学 UI 设计还要多体验优秀的产品

最美应用公众号（官网：http://zuimeia.com）

最美应用是老牌的应用推荐平台，一直以推荐“好看、好用、好玩”的移动端产品为使命，大家可以关注“最美应用”推荐的产品和专题。最美应用推荐的产品往往在功能、设计、交互方面有着独到的地方，在各个领域都已经成为红海的今天，这些产品为什么能脱颖而出？值得大家深入研究和思考。

七、如何提高自己的动手能力

大多数设计师在实际工作过程中，一个人独立负责整个产品的设计、UI 设计师兼顾交互和产品的情况屡见不鲜，在实际工作中如果没有老师指点，很多人只能在低水平重复劳动。临摹作品可以帮助我们提升技能，但是想通过实战获得更大的突破，不妨参加各种行业内的比赛，尤其是准备入行或航入行的新人，通过项目驱动自己成长。

站酷上的设计活动

站酷网常年会有大量的设计比赛，大家可以选择自己擅长的领域和优秀的同行一起碰撞交流，其中不少活动是与知名企业合办，奖品丰厚。

中国产品设计大赛

由知群举办的中国产品设计大赛主要针对产品设计领域，是产品经理、交互设计师和 UI 设计师展现技能的舞台，以往和阿里、腾讯、携程、知乎联合举办过多期，有不少在比赛中表现优异的同学直接拿到了大厂的 offer。

作者QQ及微信：49922779