人人都是设计师!UI自学系列教程之新手入门必备篇(一)

编者按:今天这个UI自学系列教程,不聊软件操作,不谈精美效果的实现,我们来聊聊真正有助于你成为设计师的方法。今天第一篇,聊聊什么是UI,学会哪些软件才能成为UI设计师,

Think Lee:UI=User Interface,这是大家都会说的废话,Interface比较容易理解,界面,通常就是我们看到的网页,APP的界面,图标等等等等视觉元素。UI里的界面设计通常区别于平面设计,因为在Web端,移动端,或者其他手持设备或独立设备上,视觉设计通常会受到技术限制和规则约定,例如说在iOS APP上,状态栏/导航/Tab都有规定的高度,在Web上受、到用户电脑分辨率的约束通常会把网页内容宽度做一个范围限定。所以,在Interface的部分,UI设计师尤其需要考虑到各平台的设计规范与可实现性。当然,这东西难到也不难,只是各平台乱七八糟的规矩太多加之设计趋势天天变,总是感觉自己有点跟不上时代变化的感觉。

此处插入iOS设计规范,你感受一下:

规范里不仅讲了视觉规范元素规格等等,也会大量牵涉到交互上的设计原则,所以作为一个好UI,在Interface层面上你不单单要懂规范,你还要懂交互,交互是另外一个复杂的话题,以后再说。

接下来说User

User是什么,是你的设计作品的最终使用用户。很久之前是没有UI这个职位的,上古时代我们称之为美工(可惜这么有历史的词现在倒成了贬义词),或者视觉设计师,后来做Web设计的干脆叫网页设计师。因为很久以前那时候还没有UCD(User Center Design)这个说法,所以界面设计里并没有加入User的部分,多数只是考虑视觉的美观。而站在现在的角度来看,以用户为中心的设计理念已经深入……深入人嘴(意思就是现在大多数人嘴里念念叨叨用户体验用户体验,其实他们并不知道什么是用户体验),好吧,人嘴就人嘴,你可以粗暴地理解其为:为人民服务。

那到底用户体验是什么?用户体验是产品设计者/团队对产品用户心理的一种把控。用户体验设计过程,是对用户的视觉偏好/行为特征/操作习惯等等等等用户心理特征通过各种调研方法得出的定量或定性的统计数据与结论,从而用来指导整体产品的功能/交互/界面等方面的设计。

到这里,美工/界面设计/视觉/网页设计师,也就摇身一变变成了现在的UI。也就是说,单单考虑到美观的视觉设计还不够,同时还需要把你对用户的感知和理解融入到设计中去。这就是UI的基本要求,当然……要求是要求,能做Interface的,一抓一大把,真有User理念的,不多

学会哪些软件就能做UI了呢?

内行人一看就懂,这题目分明就是外行话,为什么外行,稍后再说

先说下此问题的答案:即便你把adobe系列全学会了,你也不一定能做UI

从上古时代的“网页三剑客”到后来业界公认的PS/AI/DW,到最近一些小众但是逐渐在变热门的Sketch/Affinity系列,UI使用的软件逐渐在向更专业化的方向发展,比如说PS CC 2015新增的“设计空间”就非常适合UI界面做布局配色。但是由于PS本身就不是一个专业的UI软件,新加入的“设计空间”也稍显鸡肋。

大致总结下目前行业常用的软件: Photoshop , Illustrator,Dreamweaver,Sketch,Affinity photo,Affinity Design,Sketch,Axure,Mockups,Flash,After Effects。以上是我经常用的和经常见到别人用的UI行业软件,至于软件好坏怎么选择这些东西略过不表。这篇文章只说软件与设计的关系。

为啥Adobe全学会了还不能做UI?

我们举个例子:

图1:

人人都是设计师!UI自学系列教程之新手入门必备篇(一)

图2:

人人都是设计师!UI自学系列教程之新手入门必备篇(一)

插句题外话,如果你觉得图1很好看图2很丑,那我可能要很遗憾地告诉你,设计行业不适合你,尽快想别的出路吧。

我从昵图网随便找了两个网页,好,大家比较一下图1和图2,我要说明什么呢?

首先,这两个网页都是用PS做的,与软件版本无关,与你用的是Mac还是PC也无关。

其次,图1和图2对PS技术的要求是一样的,而且PS操作技术要求相当低,初学PS不久的同学就可以轻松地画出来

最后,举个例子:

你和小明一起学PS,两个人看同样的PS教材,看同样的视频课程

你做出了图1,小明做出了图2

你屡次投简历失败,还要为月薪两三千的底层美工职位挤破头,而小明已拿到了BAT月薪1.5W的UI Designer offer,转眼迎娶白富美走上人生巅峰

为什么?

因为 会软件≠会设计

许多同学把做UI理解成为”学会软件了就会做UI“,于是赶紧跑上来问“UI都需要什么软件技能?” “PS学到什么程度就能做UI了?” “达到一个UI设计师的水平需要学会哪些软件?” 听了一群外行和半吊子内行说要学PS/AI/DW等等,要学某某某大师的视频课程,要上某某PS教学网站,要去培训班系统学习。抱着对众神百分百虔诚的信任然后赶紧花费大量的时间精力金钱去学PS学AI学DW学Flash(更有奇怪的培训班还要教CAD和3Dmark,真心理解不了)。熬尽七七四十九个白昼与黑夜,“系统”地学完了一大堆UI常用的和不常用的软件之后突然感觉自己瞬间打通任督二脉,不仅长出了三头六臂顺带还精通了十八般武艺,然后撸起袖子做了个图1……

你要知道,图1和图2之间的差距,与软件无关。

中间相差的设计感,色彩感,排版规则,设计技巧等等,绝对不是靠学PS学AI学DW等等等等软件学出来的,就像我开头说的,Adobe全学会了你也不一定能做得了UI。

想起我好多年前刚开始做UI时候认识的一个朋友,年近三十,PS用了9年,快捷键耍得出神入化,但是依然在一个小县城的婚纱摄影店拿着2000的工资做婚纱照的后期

我做设计的最初一年多,只会PS,是的,除此之外什么软件都不用。AI还是后来才摸,DW压根没学(设计和Html的关系这是另外的话题,以后再说)

所以不知道到这里你明白了没有:

不要把你的时间都堆在学软件上面,锅碗瓢盆油盐酱醋备齐并不代表你就能立马变成厨子。

【为了这7个指南也得存书签!】

  1. 平面设计:《超赞!设计师完全自学指南》
  2. 交互设计:《交互设计师修炼指南!教你从零开始成为优秀交互设计师》
  3. UI设计:《超实用新手指南!零基础如何自学UI设计?》
  4. 前端开发:《天猫高手来教你!零基础如何系统地学习前端开发?》
  5. 抠图技巧:《从菜鸟到高手!PHOTOSHOP抠图全方位攻略》
  6. 配色方案:《色彩搭配速成!3个实用方法帮你全面搞定配色》
  7. DPI指南:《基础知识学起来!为设计师量身打造的DPI指南》

原文地址:zhuanlan.zhihu
作者:Think Lee

【优设网 原创文章 投稿邮箱:2650232288@qq.com】

================关于优设网================
"优设网uisdc.com"是国内人气最高的网页设计师学习平台,专注分享网页设计、无线端设计以及PS教程。
【特色推荐】
设计师需要读的100本书:史上最全的设计师图书导航:http://hao.uisdc.com/book/
设计微博:拥有粉丝量105万的人气微博@优秀网页设计 ,欢迎关注获取网页设计资源、下载顶尖设计素材。
设计导航:全球顶尖设计网站推荐,设计师必备导航:http://hao.uisdc.com

收藏 14
点赞 5

复制本文链接 文章为作者独立观点不代表优设网立场,未经允许不得转载。