UI设计教程!如何提升你的设计水平

分享给刚入门的Ui设计师们希望能帮到初学UI的你。

最近半年尝试性的收了一个小徒弟,因为他今年毕业,我以为教起来会很顺利,因为他是平面设计专业而且PS软件基础还不错。但是实际上却遇到了不少的问题不少的弯路。我把它们整理了下来,总结了一下。分享给刚入门的Ui设计师们希望能帮到初学UI的你。

一、提升你自己的设计审美

每个行业都有属于自己的一套评判标准。初入行的新人却很容易摸不清楚。审美水平

的提升是进本不可能速成的,它是一个非常缓慢的过程。

正所谓:

人生不在于用脚步丈量万水千山,而是用内心真正体会世间百态。

只有有了一个很好的审美水平,你才能清晰的判断好或者不好。才能对自己的设计作

品有一个非常清晰的认识。

我觉得UI设计有些像画素描,在绘画的过程中你的画板可能会显得空,显得造型不

准,显得灰。但是在落下最后一笔之后,你一定要对你画出来的作品有一个明确的判

断。哪里的造型不准(间距),哪里的颜色过于灰(配色),哪里的地方显得空(布

局)。这些都是应该一眼就可以看出来、可以自己去把控修改的,而不是别人告诉你

如何去改,那样实际上你就变成了一个所谓的设计工具。

这也就是我为什么不喜欢线下速成培训班的原因,在培训班里没有足够的时间去培养

审美能力,老师告诉你如何去改去改,作品的效果虽然上去了,但实际上对个人的帮

助微乎其微。

所以多看一些好的作品,有助你审美的提高,以及对自己作品的一个判断把握

(图片来自网络)

二、设计工具切勿贪多嚼不烂

实际上我现在如果做UI一般是Sketch+Principle,之前几年一直只是PS+AE。

如果你对设计软件难以取舍我不妨这样说。

设计软件的选择实际上取决于你想掌握什么样的设计技能。

分享一下我的学习路线

PS(美工技能)→AI(美工技能)→AE(动效技能)→DW(切图技能)

→Sketch(美工软件更新)→Principle(动效软件更新)→C4D(建模等技能学习)

希望对你有一定的参考。

新人来讲,我觉得会个PS就足够了。。。

如果有耐心有毅力,可以学一些初步的AE

三、适当的前端知识

四年前,我刚接触UI设计的时候,还在嘲笑一些公司,为什么会有切图师这样的职

位。难道他们不知道cutterman这个插件可以自动切图嘛。

后来我进了公司才知道,原来所谓的“切图”,是指将UI设计通过前端

HTML+CSS+JS进行静态的切图布局,我们美工所谓的“切图”,只是“抠图”罢

了。

这件事过后我就开始了自己的代码之路,说真的,我是属于一看见英文单词就想打瞌

睡的。

效率很低,但是至少现在我明白我的界面会通过怎样的一种方式去实现,懂一些简单

的框架。这在工作中的沟通上对我的帮助是难以言喻的。

很多设计师会说,设计就是设计,不能学代码。

但是Vue.js的作者也是设计师出身,各厂的大神很多也都是懂代码的,希望新人在面

对这个选择的时候想一想,是自己真的想要一辈子专注设计,还是只是为了偷懒而找

的一个借口。

(图片来自网络)

四、切忌设计上下限相混

跟其他一些设计师不同,我很提倡徒弟去临摹一些飞机稿。

甚至是各种动效乱飞现在的技术实现起来很困难的设计稿,因为我认为,对于新人而

言,提升眼界的一个最快的方式就是临摹飞机稿。

只有当你飞到两万英尺的高空,你才能看到最广阔的风景。

视觉效果极佳的飞机稿就是提升审美的一个相对的捷径。

但是在实际落地的需求中大肆运用飞机稿去设计,那就是找死了。

设计分为上限和下限。决定着你设计水平的体现和实际项目的体现,切忌相混。

就如同车展的概念车和落地车,有可能你自己上限和下限的差距,比人跟猪的差距,

都要大。

五、多去关注一下行业状况,跳出设计本身去思考问题

UI设计和平面设计不同,我们设计的是一个软件产品,甚至有时候还包括着一些内部

的跳转架构。

只有你吃透了相关行业的运作,才能明白其中的逻辑关系,才能更好的去设计产品。

前些年UI设计群里一直有人每天都在发“XXX20亿融资O2O”之类的归类新闻,有什

么用呢。

不如撇开这些快餐式的行业新闻,直接去看一看相关专业人员的分析。

看的越深,你就会越觉得,

设计只是一个产品内部的一个齿轮,外观做的再漂亮,也不如和其他的齿轮有一个默

契的配合。

有的人总喜欢喷别的设计师或者别的产品,做出来的东西一点都不好看。尤其是培训

班的设计师,自己的设计稿天花乱坠般酷炫,外面的产品是如此的普通。

但是,当你纠结于设计本身的时候,你是否发觉自己进了一个死胡同。

网上的屠龙宝刀,点击就送,是不是丑?

但是这是一个洗脑式的营销。

有的产品交互是不是不太合理?给用户增加了不少的麻烦?

交互设计不全等于尊重用户体验,而是在体验和变现之间寻求一个平衡。

六、适当的建立自己的设计素材库

这点不多做赘述,但是请注意,你的素材库一定是要有一个素材命名规范的

比如01-001-XXXXX

01代表移动端或者PC端

001代表设计素材的编号

XXXXX代表你对这个素材的简略概况

这样能让你在拥有近五位数的素材的时候也能快速准确的找到你想要的那一张。

(图片来自网络)

七、细节处理

我上高中的时候,一个美院老教授来我们学校开讲座,我问了一个问题。

如何画好一幅素描?

老教授回答了六个字:“造型、空间、对比”

当时不理解,现在想了想,其实足够。

对于新人设计师,我也想说:“字体、间距、关系”

字体指的是一个合适的字体以及合适的字号

我现在还见到有的设计师用宋体用楷体,理由是好看。

我现在还看到有的设计师在750*1334的设计稿上用很小的字体,理由是显得精细。

这样的设计稿如果给前端,简直是一场灾难。

间距指的是合适的间距,MD上讲的是8px 16px 24px。

关系指的是你需要明白你设计稿显示的主要信息是什么,次要信息是什么,不重要信

息是什么。

这样,在你设计的时候,你是不是就可以把主要信息突出展示,不重要信息可以在空

间拥挤的时候收起来?

---------------------------------------------------------------------

到此为止,不知道能不能给大家带来一些启发

总得来说这个教程适合设计入门的准UI设计师,如果您喜欢,我将不胜欢喜。

欢迎各位一起学习交流:3-4-3-5-9-8-4-2-6-9

你可能感兴趣的:(UI设计教程!如何提升你的设计水平)