学UI入门阶段到底要掌握哪些知识（UI第一阶段课

写在之前：这篇教程内容比较多，如果你是新手，能坚持每个知识点都搞明白的话，起码要半年的时间~~！、
如果你进来随便看一看就走了，那不能怪别人，是你自己不努力~！~~已经有很多新人在这里学完找到了高薪工作。 阅读量破100万的文章，太多人从这里起航！灵智飞扬就是这么一个专为新人准备的免费学习UI的网站。  给灵智飞扬打气，加油  猛点这里 >> 虎哥还要推荐大家收藏这个 hao.xueui.cn UI学习网址导航，虎哥整理，必须精品。这里面都是我常用的网址。 今天来谈谈这个话题，学UI第一阶段到底要掌握哪些知识和技能。
我们先来划分一下啊，学UI要分几个阶段来学： 初级阶段  →  中级阶段  →  高级阶段 QQ群里大多数学生都还在入门阶段，感到很迷茫，不知道从哪里开始学起。网上的海量信息，全是教程，都不知道先看什么，后学什么。非常的无助。 虎哥拥有10多年UI设计实战经验，大大小小也做了很多项目，借这个机会，给新人们指引一个方向，希望能帮助到大家。 入门阶段，就像一张白纸一样，干干净净，也很茫然。所以才会有那么多的培训学校，教给大家的都是最基础的入门的知识。  

很多人在群里会问，我是自学还是报班啊。这个问题回答的嘴都软了。

答：你如果定性比较弱，需要人逼着才学的进去，又不差钱。那么就报班吧，这样入门比较快。选择学校的时候先去听听，在问问大家，不要被忽悠~！~如果你自学能力还不错，又差钱。那么还是自学好了。   下面我们来讲讲自学，因为虎哥从业多年都是自学。谁叫咱是穷孩子，交不起16800的学费。话说这钱可以买一台高配的MACBOOK PRO 15。          上边这几篇文章看完以后，是不是大致明白了一些什么了。 重点推荐上面这本《零基础学UI》。详细介绍>> 1.这本书老断货，虎哥搞了一些在灵智飞扬官方淘宝店代卖：点我去抢购>> 2.或者打开淘宝APP扫描上面二维码购买 凡是购买了本书的同学可加我们灵智飞扬福利-书籍购买QQ群：317086090，群文件会有书中的PSD源文件下载。    

先来说说UI设计入门阶段，用什么软件。工欲善其事，必先利其器

对于入门阶段的童鞋来说，不要纠结那么多，先把Photoshop玩熟练再说吧。因为在日常工作中，用的最多的就是PS了，可以这么说，做UI界面基本上用它就够用了。所以入门阶段的你，不要瞎操那么多心了，专心学习PS吧。当然最近2年也流行用SKETCH来设计界面，好处很多，坏处就一点，你得先有一台mac电脑。目前国内绝大多数公司还没办法给设计师们都配上高大上的mac电脑。所以新手朋友们还是先别纠结软件的问题，先学会设计思路和设计方法，设计流程，搞出看的过去的作品，这样才好顺利转行。  

软件安装（建议购买正版软件，以下下载仅供学习使用）

  1. Photoshop 2017 软件下载 请到官网下载试用版，然后干啥自己百度
  2. 怎样安装Photoshop画笔，形状，动作，滤镜等插件
  3. psd 缩略图查看插件
 

插件安装

  1. UI设计师高效秘笈－工具预设（先来把你的PS给设置好了，新人必看）
  2. 一个好用的PHOTOSHOP切图插件（CutterMan插件下载）
  3. 标注神器马克鳗，PxCook 像素大厨，Parker
  4. 一键标注神器－zeplin
  5.  IconTemplate 启动图标生成插件
  6. 安装一个Ps Mirror可以在iphone上实时观看效果。
  7. PS 2015圆角神器 Corner Editor 来了（UI设计必装神器）
  8. PS 玩转长投影（带PS动作）（现在流行的长投影傻瓜模式）
 

配置Photoshop参数，做UI更方便

    

安装字体（虎哥整理的）

    

photoshop视频教程

  1. PS基础视频教程
  2. 李涛-photoshop教程
 

还有这几个也要看看的：

  1. 45个设计师需要熟记的ps快捷键
  2. PS真正实用技巧
  3. Ps改进UI设计的一些技巧（必看）
  4. 设计新手在PS中最常犯的6个错误
  5. 你的PS很卡吗？来瞧下这10个加速技巧
       好了，软件也安装好了，视频看了不少了。接下来就是要做各种练习了。前边UI到底是什么一文里面也说了，UI不光是画ICON,还要做界面。还有一些交互知识。 入门阶段，就先别想那么多，先画画简单的图标，做一些简单的界面吧。 这个时候，逮到什么画什么，比如打开百度的首页，这个界面不陌生吧(老版本的界面了），照着画一个出来。有人说了，这有什么好画的啊。你还别不服。很多入门级的新人，还真是做不出来。   有人连字体都做不出来，宋体12号 ，这个地方选无，就好了。 然后输入框的效果放大看看，用了内阴影。   然后是搜索按钮，用到了什么效果了。 渐变+描边+投影+内阴影做的白色高光（一个图层样式完成）。小小的一个按钮，尽然有这么多学问在里面。这就是UI的魅力所在。  

UI设计要先把什么搞明白，哪些PS技巧先学会

Photoshop的知识点太多了，用了10年都不敢说精通。每个不同的设计领域用到PS的知识点也不一样。 比如做CG原画的，做网页设计，照相馆处理照片的等等用到PS功能都不太一样。  

UI设计 入门阶段先要学会以下几个功能，一定要玩的很熟练

第一：图层样式 
上面做的百度这个页面，看着简单，却用到了好几种的图层样式。那么像下边这样的按钮。 用到的就更多了。所以想打怪升级，还是要把图层样式玩的很熟悉，入门阶段要分析的出来，用到了什么效果。 看到什么好的界面或是ICON，就立马分析一下，它用到什么图层样式？ 相关的教程：
  1. 一个按钮有话说（PSD下载）
  2. 还在担心按钮设计吗？来看看这十条基本准则
  3. 教你画一个开关
  4. 如何与像素打交道
  5. 透明导航设计讲解
 
第二：图层的混合模式
  1. Photoshop的混合模式（详细解答）
 
第三：形状工具
  1. 玩转PS形状图层UI设计师必看
  2. 虚线的画法
 
第四：学会切图（常用的切图办法就在这里，先挨个学一遍，然后根据实际的情况选择相应的切图方法）
  1. photoshop切片使用小技巧（切图）
  2. PhotoshopCC新功能 生成图像资源（切图）
  3. 【详细介绍android和ios平台的切图】
  4. 做ui必备–PS切图动作用法（必装）
  5. Android切图小贴士
  搞明白一些常规的界面尺寸和视觉规范

移动端：

      
  1. 移动端界面设计之尺寸篇
  2. ios视觉设计规范说明
  3. IOS 7 Ui规范PSD
  4. Android系统字体规范(含Android系统字体包下载）
  5. android规范文档3份PSD下载（新手必学）
  6. ios7和ios6 2套icon模板下载(ui设计师必备）
  7. WP7 控件，WP设计师必备文件。（psd下载）
 

网页端：

  1. 网页UI是如何标注的？（附带WEB UI视觉规范文档）
  2. 网页UI视觉设计规范
  3. 网页设计基础技巧
  4. WEB设计指南！
  5. 界面设计速成
  6. 不要让用户思考
 

色彩的学习

     设计中关于颜色搭配的一些小经验 配色秘要：永远不要使用纯黑 PS教你做渐变大背景  

PHOTOSHOP操作技巧

        

开始做点什么（临摹阶段）

先来点励志的        开始练习！先学会技法。                               
  1. 还在担心按钮设计吗？来看看这十条基本准则
  2. 解密IOS7毛玻璃效果
  3. 轻松打造iOS7风格图标
  4.  PS强大的角度渐变
  5.  教你如何画圈圈—–标识设计中辅助参考线入门
  常规网页UI切图(3种方法，各有各的好）         

移动端UI切图必备工具和教程

    好了，差不多了，这些都挨个学一遍。就入门UI了。 学UI 要学的真的很多，这些都是基础的知识，这些掌握了，才能到达 中级阶段，加油！少年~~！ 最后要是想顺利的转行UI设计，必须要有拿得出的成套的作品。  

什么是成套的？

起码要一套15-20页的app界面，交互流程要顺畅，这个需要自己好好研究研究。网页界面1-2个，然后包装一下。  

为什么要包装了？

包装其实反映了一个设计师的综合的实力，考验一个人能不能从大的方向把握整体的风格，版式形式感能不能贴切你的产品定位，配色和基础的排版能不能做到整体一致性。视觉规范的统一性如何。等等。当然，看着也是高大上的，把学到的东西串联在一起，写上设计思路和说明，更容易让人理解你的设计思维。你不是一个单纯的做图仔，你是一个有脑子的，会思考的设计师。 包装可以去参考虎哥的徒弟作品集，每一套作品都是自己命题原创作业，经历1-2个月的时间打磨出来的，可能很多人觉得哇，特么要这么久吗？对的，真的要这么久，基本上都是从app的界面主界面开始做15-20个然后整体改了10多遍，然后包装也改了5-10遍，才达到拿得出手的效果和质量。真的不是随便套个模板就搞出来了，没有想象的那么简单。往往很多东西看着简单，真正自己做起来就不是那么回事了，毕竟大部分的人还是很普通的新手。 每个人的基础不一样，激发潜能的深度也不同，原创的设计作品确实不容易，希望大家努力吧~~！ 其实吧，你只要稍微努点力，就能甩掉全国90%的懒娃子。学习之一个长期的过程，需要坚持！坚持！还特么是坚持！ 整理编写：Tiger（虎哥） 谁的青春不迷茫？谁的职业路程更清晰？虎哥团队帮你来解答咨询②群 ：238079364 zcool主页>> 文章来源：www.lingzhifeiyang.com   转载请注明：灵智飞扬 » 学UI入门阶段到底要掌握哪些知识（UI第一阶段课程） 登录收藏

学UI就上灵智飞扬！越努力，越幸运！

“灵智飞扬www.lingzhifeiyang.com ”最值得关注的UI学习平台！ 每天发布高质量的设计教程和分享设计经验，服务于20万UI设计师,帮助初学者快速转型。 ，给大家提供更多免费学习的机会。想成为设计师的你快来关注吧！ 【特色推荐】 “APP截图站www.lingzhifeiyang.com”  海量APP截图，让你灵感爆发！国内最好的APP截图站。 “国内最棒的UI设计导航站” 专为UI设计学习者打造的资源＋学习，双用途的网址导航站。亲爱的，你收藏了吗？ 【灵智飞扬 原创文章 ，也可以找各个群的管理】  给灵智飞扬打气，加油  猛点这里 >>  
 本文来源：未知

分享：

{dede:include filename=foot.htm