说到ui设计,外行人看来似乎觉得很简单,一些圈圈框框线条。而薪资在设计师中又是算高的。

ui设计初学者最关心的问题:ui小白快进来了解一下ui设计到底要干什么(1)

说到这,那真的要为各位UI设计师们抱不平。

ui指的是什么呢?

UI即User Interface(用户界面)的简称,UI设计是指对软件的人机交互、操作逻辑、界面美观的整体设计。

ui设计初学者最关心的问题:ui小白快进来了解一下ui设计到底要干什么(2)

我们一般所说的UI设计多指UI视觉设计,主要负责APP、Web、H5等页面的色彩、布局、icon、字体方面的设计工作。但随着互联网的不断发展,纯视觉的工作已经开始日益减少,行业要求UI设计师也要懂点交互设计和产品方面的知识,即懂用户体验设计(User experience),国内称UE,国外叫UX(全栈设计师甚至要懂代码)。UI设计最后产出物是高保真视觉稿+页面标注+切图。

下面就以3类设计师为例

解锁一下设计师们强悍的技能

UI设计师——不是日常做着各种 APP 的界面图,然后再加上一些ICON这么简单,TA负责软件的界面美观、操作逻辑、人机交互的整体设计,需要掌握扎实的平面构成、色彩构成、版式设计、设计心理、设计原则与规范、绘画等技能。UI设计师的水平,直接决定了App、网站的“颜值”。一个好的UI设计师,能润物于无声,在浑然天成的设计中为产品注入新的价值,而绝不是普通的打杂美工。

UX/交互设计师——做以用户体验为中心,使互联网产品产生用户粘性的设计。TA需要理解并分析不同用户的背景、需求和mental model(心智模型),提出能让用户觉得直观、高效又有趣的交互方案,并且通过user validation来验证这些方案。简而言之,UX设计师承担着提升界面可用性的重任。

UXD/全栈设计师——目前用人企业在设计维度,最需要最紧缺的复合型人才。UXD全栈设计能力结构是由UI(界面视觉) UX(交互设计与用户体验设计) Design(跨界设计)共同组成,所以一名优秀的UXD全栈设计人才是同时具备UI、UX、Design几大能力,技能点Max,成为众多设计师所追求的发展目标。

UI设计行业远没有想象的那么简单

举个栗子

当我们设计一个按钮的时候

大家都以为的步骤是:

看看原型图——加个颜色——加个圆角——完工!

ui设计初学者最关心的问题:ui小白快进来了解一下ui设计到底要干什么(3)

但其实真实的情况呢

我们先要确定主题色

ui设计初学者最关心的问题:ui小白快进来了解一下ui设计到底要干什么(4)

“不不不不,绿色太像安全产品了,感觉不符合品牌”

“诶,红色好像也不太好有点警示作用,怕吓到用户”

……尝试24个色之后

“嗯,还是蓝色保险又好看”

ui设计初学者最关心的问题:ui小白快进来了解一下ui设计到底要干什么(5)

然后又开始尝试各种样式

ui设计初学者最关心的问题:ui小白快进来了解一下ui设计到底要干什么(6)

“圆角太大有点幼稚”

“没有圆角又太硬朗了吧”

……尝试24个圆角像素后

“嗯,还是5px的圆角最好看”

ui设计初学者最关心的问题:ui小白快进来了解一下ui设计到底要干什么(7)

最后开始尝试各种效果

ui设计初学者最关心的问题:ui小白快进来了解一下ui设计到底要干什么(8)

“投影远了层级关系太大,不好看”

“投影太浅感知度很弱的,不如不要”

……尝试24个设计效果后

“嗯,勉强就这样吧”

ui设计初学者最关心的问题:ui小白快进来了解一下ui设计到底要干什么(9)

据说当年微博客户端的底部按钮改版

飞机稿壮观成了这样

最后才有了线上这个样子

ui设计初学者最关心的问题:ui小白快进来了解一下ui设计到底要干什么(10)

再来举个例子

UI设计好坏如何影响到一个产品

以下两个界面来自同样的交互文档

但为什么左图看上去就低端一些呢

ui设计初学者最关心的问题:ui小白快进来了解一下ui设计到底要干什么(11)

这就是大家留意不到的设计细节

看似无关痛痒的地方

就决定了一个UI设计的好坏

ui设计初学者最关心的问题:ui小白快进来了解一下ui设计到底要干什么(12)

除了右图的简约调整方向

UI设计师还能从细节着手

将整体上升一个level

ui设计初学者最关心的问题:ui小白快进来了解一下ui设计到底要干什么(13)

即使不用操刀大改

只是调色调位置也能有不一样的效果

ui设计初学者最关心的问题:ui小白快进来了解一下ui设计到底要干什么(14)

So 还会觉得UI设计是画线框图那么简单吗

这些设计中的小经验

都是在实践中积累起来的

并不是随便临摹一下

就能完全学会的

所以他们的工资才会辣么高呀

ui设计初学者最关心的问题:ui小白快进来了解一下ui设计到底要干什么(15)

~此文转载,如有侵权,请联系删除

,