‘壹’ UI设计前端学习哪些内容
1、HTLM基础认知DIV框架及CSS样式
首先要了解HTLM基础、CIV框架以及CSS样式， HTML称为超文本标记语言，是一种标识性的语言。它包括一系列标签.通过这些标签可以将网络上的文档格式统一，使分散的Internet资源连接为一个逻辑整体。DIV元素是用来为HTLM文档内大块的内容提供结构和背景的元素。 CSS不仅可以静态地修饰网页，还可以配合各种脚本语言动态地对网页各元素进行格式化。CSS 能够对网页中元素位置的排版进行像素级精确控制，支持几乎所有的字体字号样式，拥有对网页对象和模型样式编辑的能力。
2、浮动原理、Margin认知
Margin，是CSS的语法，这个简写属性用于在一个声明中设置所有当前或者指定元素所有外边距的宽度，或者设置各边上外边距的宽度。
3、框架应用搭建
框架很多，在这个教程中选择一个主流框架带大家看看前端框架如何搭建。
4、插入图片、文字标签和版头、导航栏
编写的网页中插入图片，可以使浏览网页的用户得到更好的体验效果。在这一部分会讲解插入图片、文字标签以及版头和导航栏如何实现。
5、Banner块插入、内容文字排版、内联元素、A标签和Banner链接定位
Banner是网络广告最早采用的形式，也是目前最常见的形式。它是横跨于网页上的矩形公告牌，当用户点击这些横幅的时候，通常可以链接到广告主的网页。而网页中的文字内容排版也直接影响着网页的美观以及网页的用户体验。
6、锚点标签、超链接标签、固定定位和绝对定位、相对定位
标签用于定义超链接，用于从一张页面链接到另一张页面。用于设置锚点，用于页面定位。
7、导航二级菜单显示隐藏
很多网页中的二级菜单示，需要鼠标移动到一级菜单或者点击一级菜单才会展开显示二级菜单。
8、input表单
input表单栏不直接显可以获取用户的信息，做出对应的动作，教程中直观的展示input表单的应用方法。
‘贰’ UI设计都包括什么
UI即User Interface(用户界面)的简称。UI设计是指对软件的人机交互、操作逻辑、界面美观的整体设计。好的UI设计不仅是让软件变得有个性有品味，还要让软件的操作变得舒适、简单、自由、充分体现软件的定位和特点。现在从事的最多的实际上就是GUI（Graphic UI）设计。也就是图形设计，包括软件界面、手机应用程序界面等各种可以与之交互的电子设备的界面设计。不同的公司要求UI设计职位的能力也有所差异。
那么做UI设计师到底需要学什么呢？在此给广大学子简单介绍一下，希望对大家有所帮助，在以后的学习中少走弯路。
一．初步认识UI：了解UI设计师的角色定义和价值体现，UI的含义、UI设计师的含义
学习内容：学习设计基础、字体、构图、手绘等基础技能。快速培养UI设计师的视觉敏锐度，和绘画能力。
二维造型方法，二维简约图标绘制原理与技法，各种材质质感表现。
三维造型方法（物体的体积、结构、透视与光影表现）
色彩原理：色彩属性、对比与调和、色彩的混色配置、设计色彩的表述体系，色彩的装饰美感及色彩的表现方法
二．设计软件应用：以Photoshop软件为工具，讲解书籍封面设计、海报设计、广告设计、影楼后期处理、包装设计、喷绘设计、画册设计、DM设计等企业实际工作中的具体项目。
以矢量图形绘制软件Illustrator为工具，讲解标志设计、字体设计、图形设计、企业VI设计、卡通形象设计等企业实际工作中的具体项目。
字体专项设计：字体的分类和种类、字体的认识、各种场合字体的应用、形象时尚字体设计、字体标志及在广告设计中的实际应用
版式专项设计：版式的概念、版式中的色彩应用、版式中的字体应用以及网页、书籍、报纸、画册、DM、海报等中的应用。
平面项目设计：结合软件、色彩、字体及版式的学习，针对宣传单、折页、名片、海报及VI做专题设计，提升综合应用能力及平面UI设计能力。
三．WUI设计基础：页面设计基本流程与设计规范的概念性讲解，重点了解WEB界面设计规范；网页配色技巧、色彩与构图的概念及技巧；网页导航与字版式设计
网页设计软件应用：以Fireworks为工具介绍软件的基本构成、矢量工具和位图工具、WUI用户界面及广告设计。
以Dreamweaver为工具建立站点、添加页面元素、使用CSS样式及交互行为。
以Flash为工具了解动画制做原理与技巧，典型WUI商业广告中的Flash技术与实现。
网页设计要素：学习web网站设计基本要素，网站图标、按钮、广告banner、专题页设计等元素的具体设计方法
Web标准化布局：（X）HTML/HTML5语言：HTML语法与常用标签的详解，包括布局标签，表格标签，表单标签等。
CSS/CSS3层叠样式表：CSS语法与常用属性的详解，使用CSS对网站中各个模块进行修饰美化。
WUI项目实战设计：以企业网站、电商网站及专题网页做实战项目设计，经过全流程设计，达到网页界面设计要求
四．UE交互设计
1. 手机主题、界面与图标设计；
2. 拟物化与扁平化设计；
3. 系统性学习苹果IOS设计规范；
4. 系统性学习Android设计规范。
图标设计：图标设计要素与技法，图标设计中的色彩应用，图标创意思想与方法，2D图标设计方法，3D立体图标设计方法，图标在界面中的设计应用。
移动UI界面设计：手机APP的用户使用场景，手机界面的布局与结构，手机界面中的视觉语言与控件详解，手机交互中的手势操作，APP产品的核心设计：导引设计，手机APP的色彩与情感化设计，手机APP整体视觉情感的提炼与传达，移动APP项目设计iphone端APP实际项目实战。
职业市场的风云变化，技术发展的突飞猛进，人们只有通过不断的学习进步才能保证自己不被时代所抛弃，这种情况在IT行业与设计领域尤为明显。
‘叁’ UI设计需要哪些能力
一、UI 设计师需要具有的几大能力
注意看这里要讨论的是“能力”而不是“技能”。很多同学在面试的时候自信满满的说：“我会PS、AI、AE、sketch、C4D……”。当然会这些东西可以为你的面试带来小小的加分，但是大家都知道设计师面试主要是看作品的，面试官看你的作品一般不会关心你是用什么软件做的，最主要的是看你有没有设计感觉，符不符合他们的设计要求。那么一个合格的UI设计师应该具备什么样的能力呢?主要有以下几点：
1. 调研能力
调研能力是作为设计师必备的一项技能。它考验设计师的信息搜索、整理、分析能力。它在设计阶段前期提供问题切入点，为方案提供夯实依据，还能为进行中的项目提供各种决策支持。另外，通过用户研究来验证设计结果也是不二法门。
你的眼界决定了你的高度，设计师最忌讳“闭门造车”。即便你没有behance、Pinterest的主页，也应该天天浏览一些最新的设计，要了解当前的流行元素是什么?思考下一步的流行趋势是什么?当你拿到产品需求，不要着急动手做。这个时候你最应该做的是“调研”。很多人会说：“这不是产品的工作吗?”。“对!”，产品前期是要做调研，但是我们的调研跟产品的调研角度是不一样的。我们的调研是从视觉、交互角度出发的。首先你要知道你们的竞争对手是怎么做的，然后还有没有适合你们产品风格的视觉定位，所谓“知己知彼，百战不殆”。
2. 交互设计能力
UI设计师的界面还是要服务于产品设计，那么对于界面的设计不应只停留在美学的思考，还应该思考界面的逻辑，界面元素的摆放，通过深入了解产品的行为目的后，更好的用视觉手段表达产品意图，这就需要对设计师的逻辑思考能力，界面交互综合能力提出更高要求。。交互工作本身要做的事非常多，但这提到的“交互设计能力”主要是指“以用户为中心的设计人机交互行为的能力”。重点在于设计人机互动的过程。
3. 设计思考能力
设计和美工的区别就是，设计需要思考。经常会有一些应届的毕业生拿着临摹的作品去面试，虽然做的很漂亮，也是自己动手做的，但是我们招的是设计而不是美工。临摹只会锻炼你的技能而不会锻炼你的思考能力，对你的设计提高没有一点帮助。那么应届毕业生没有作品应该怎么办呢?我的建议就是“再设计”。再设计不是临摹，是带着思考去做的，每一个排版每一个用色都是经过自己深思熟虑的。
4. 设计创新能力
创新力不止关乎设计师的设计背景，更在于一个人各方面的综合素养。它是可以按部就班生成的创意，但又必须要有一根独一无二的线贯穿。创新力可以是对现有产品进行改进，提升体验的“渐进式创新”，也可以是把握技术变革和观念变革时的“颠覆式创新”。当然，后者更考验设计师对新技术、新观念运用、整合的能力。
5. 设计表现能力
作为 UI
设计师，很重要的一点就是视觉表现力。我在此将此它分为“创意(重在想法)”和“软件技法(重在实现)”。创意是一个好的设计的起点。好的创意能够引人在情感上产生强烈波动，或震惊，或感动，或悲伤共鸣……创意考验一位设计师的视野、脑洞，更考验一位设计师对人情感的掌握。
好的想法需要好的实现。有一类设计师，乐于下功法在视觉表现上，喜欢专研软件做出让人震撼的画面。这类设计师必定精通某款或几款软件，能够熟练运用它们达到惊人的效果。我们常说设计在于想法在于解决问题，但不可否认的是，一个优秀的视觉效果，总能更吸引人。一般来说，UI设计师的视觉表现能力主要集中在图标设计能力、图形设计能力、设计编排能力、设计提案能力、海报banner设计能力、界面设计能力等许多方面，所以在学习过程中设计表现技法不可或缺。
6. 产品把控能力
设计师的产品把控力包括两方面。一是对于整个项目进度的把控，对设计语言的把控。二是对于产品实际开发效果的把控力，需要对工程师乃至内容运营人员进行足够的沟通，保证产品最终效果与设计概念一致。产品的把控力非常考验设计师对产品设计的整理与与人沟通的能力。
没错，我指的就是对好设计的直觉感知能力。上面有提到调研的能力，但不是所有问题都得根据调研的结果去解决。作为设计师还要有根好的天线，这个天线就是你的直觉。“产品直觉力”也并非天赋，必须依靠设计师大量的经验来判断。
7. 沟通理解能力
大多数设计师不是单打独斗，而是和一个团队一起工作，你需要保持良好的沟通能力。比如经常改图的问题。不是别人说1你就做1,有可能你按照要求做了1，别人依然说你好。比如产品要你换样式，你要弄清楚原因，是不符合当前的风格，又或者产品想突出什么，弄清楚意图才去做设计，事半功倍。且给对方留下喜欢思考，乐于沟通的好印象，这样的员工到哪里都受欢迎。相反你默不作声，吭哧吭哧的不断改图，说不定别人想，这人能力真差，怎么说都改不到我想要的。好的沟通能让整个团队更好地运作，使工作效率提升，保证项目顺利、出色地进行。沟通是门学问，演讲也是。设计师的演讲能力可以体现在设计评审时的讨论、与客户沟通方案、拓展业务、对外的演讲交流活动等。沟通、演讲能力出色的设计师，通常像支润滑剂能够令团队协作更加顺畅，更自信地应对问题与
hold 住场面。
8. 协调管理能力
设计师的管理工作主要体现在两块。一是对内，对设计团队的管理，比如人员分配、提供招聘意见、与团队人员沟通、提供指导意见等。二是对外，包括与其他部门人员的工作衔接、对客户汇报项目进展等。值得一提的是，能说会道不代表就是出色的管理能力，我们需要的是让设计团队、整个工作团队更好运作的人，而不是一个“和事佬”。
‘肆’ UI前端设计怎么做
UI前端设计做法分析是：
1、UI设计是指对软件的人机交互、操作逻辑、界面美观的整体设计。从字面上看是用户与界面两个组成部分，但实际上还包括用户与界面之间的交互关系。
2、界面设计不是单纯的平面设计，需要定位使用者、使用环境、使用方式并且为最终用户而设计。检验一个界面的标准即不是某个项目开发组领导的意见也不是项目成员投票的结果，而是最终用户的感受。所以界面设计要和用户研究紧密结合，是一个不断为最终用户设计满意视觉效果的过程。
3、好的UI设计基础界面要做到能够吸引人，给人耳目一新的感觉这就要求工作者不仅要具备广告创意和美工艺术，还要了解心理学，抓住用户的心理。UI设计里面最重要的就是交互设计，负责人类与机器之间的交流，这一操作要简单，便捷，直接有效。通过这一操作从而达到用户的使用目的，这也是交互设计的目的。
‘伍’ UI设计主要包括哪些方面
UI 设计(或称界面设计)是指对软件的人机交互、操作逻辑、界面美观的整体设计，也叫界面设计。UI 设计分为实体 UI 和虚拟UI，互联网说的 UI 设计是虚拟 UI, UI 即User Interface(用户界面)的简称。
UI 设计师的职能大体包括三方面:一是图形设计，软件产品的产品“外形”设计。二是交互设计，主要在于设计软件的操作流程、树状结构、操作规范等。三是用户测试/研究，这里所谓的“测试”，其目标恰在于测试交互设计的合理性及图形设计的美观性，主要通过以目标用户问卷的形式衡量 UI 设计的合理性。
UI设计目前的前景还是很不错的，很多企业都缺少 UI设计师。而且可以看到的是，现在社会的发展，更多的智能机和智能机器人研发出现，这些都离不开UI 设计师。所以说 UI 设计的是很有前途的，是不会失业的。而且 UI 设计门槛不高，要入门也不难的。
从工作内容来说，UI 设计在当前的互联网领域、科技领域可以说无处不在，
好的 UI 设计能够明显提升用户的使用体验,从而给产品带来更多的附加值,所以UI 设计对于互联网产品是非常重要的。目前 UT 设计通常分为两个大的工作方向，一个是交互设计,另一个是视觉设计。
总的来说，UI 设计相比较于编程而言，还是非常适合大众学的并且就业前景很广阔。学完 UI 设计，能获得一份稳定而又不失乐趣的工作，同时有利于追求更高品质的生活，在艺术领域可以获得更多的启迪。
‘陆’ UI设计是由什么组成的
很多人一提起UI设计就会想到手机app，手机程序，代码之类的工作，其实这只是一小部分而已，UI设计包括很多东西，UI指的是用户界面，包括用户和界面之间的交互关系，一般分为用户研究，交互设计和界面设计，下面我就来给大家讲解一下三者之间的联系与功能。
用户研究应该很好理解，就是字面上的意思，简单的说就是研究与你设计的产品相关的人群，那么为什么要研究他们呢？我们做的所有工作都是为了更好地设计，我们需要知道我们的客户想要的是什么，它的需求是什么，什么样的设计会更容易接受，这样在设计产品的时候可以避免走很多弯路。产品是设计给人用的，往往那些很自信不做任何调研做产品，一般都不会有好下场。
交互设计值得是人和机器建立联系，然后通过这个联系达到目的。交互设计的工作内容就是了解产品的想法和布局，结合用研的数据结果，去做产品原型设计。不难发现，由于交互设计的性质，会发现其实它处在产品开发的中间位置，是一个承上启下位置。
界面设计相信也很好理解，就是产品的门面，界面设计可能是被谈得最多的，和交互设计一样，界面设计师需要不断地与交互和产品经理进行沟通。对于界面设计师来说，除了要画软件界面外，还要画logo，icon，配图，运营banner还有就是动效设计等等，然后就是标注、切图和视觉还原，其实远比我们想象的要难的多。
想学习了解更多的，UI设计相关知识可以戳我/
‘柒’ UI设计前端主要学些什么
UI设计不一定需要精通前端，但是如果UI设计了解前端可以减少和开发人员沟通的技术成本，让团队协作更加高效。那UI设计如何学习前端，需要学习到什么程度呢？
我们分享一个前端教程-网页链接，这里面详细讲解了UI设计中的Web前端设计规则及工具，可以帮助大家深入理解Web前端UI设计方法。
1、HTLM基础认知DIV框架及CSS样式
首先要了解HTLM基础、CIV框架以及CSS样式， HTML称为超文本标记语言，是一种标识性的语言。它包括一系列标签．通过这些标签可以将网络上的文档格式统一，使分散的Internet资源连接为一个逻辑整体。DIV元素是用来为HTLM文档内大块的内容提供结构和背景的元素。 CSS不仅可以静态地修饰网页，还可以配合各种脚本语言动态地对网页各元素进行格式化。CSS 能够对网页中元素位置的排版进行像素级精确控制，支持几乎所有的字体字号样式，拥有对网页对象和模型样式编辑的能力。
2、浮动原理、Margin认知
Margin，是CSS的语法，这个简写属性用于在一个声明中设置所有当前或者指定元素所有外边距的宽度，或者设置各边上外边距的宽度。
3、框架应用搭建
框架很多，在这个教程中选择一个主流框架带大家看看前端框架如何搭建。
4、插入图片、文字标签和版头、导航栏
编写的网页中插入图片，可以使浏览网页的用户得到更好的体验效果。在这一部分会讲解插入图片、文字标签以及版头和导航栏如何实现。
5、Banner块插入、内容文字排版、内联元素、A标签和Banner链接定位
Banner是网络广告最早采用的形式，也是目前最常见的形式。它是横跨于网页上的矩形公告牌，当用户点击这些横幅的时候，通常可以链接到广告主的网页。而网页中的文字内容排版也直接影响着网页的美观以及网页的用户体验。
6、锚点标签、超链接标签、固定定位和绝对定位、相对定位
<a> 标签用于定义超链接，用于从一张页面链接到另一张页面。用于设置锚点，用于页面定位。
7、导航二级菜单显示隐藏
很多网页中的二级菜单栏不直接显示，需要鼠标移动到一级菜单或者点击一级菜单才会展开显示二级菜单。
8、input表单
input表单可以获取用户的信息，做出对应的动作，教程中直观的展示input表单的应用方法。
其实以上教程只是web前端很小的一部分，UI设计如果能够了解前端知识，在设计中可以更好的考虑实现问题，也能够更好的和开发人员交流，也能够提高团队协作的效率，加速项目的进度。
‘捌’ UI设计需要具备哪些素质
1、UI设计在起步阶段学习的就是如何实现视觉界面效果
2、了解专业内容网页界面的设计，学习内容有：电商网站界面设计，企业网站界面设计，游戏网站界面设计等
3、了解到移动端的界面设计，学习：APP界面设计、图标设计、切图标注等
4、设计工具的重要性，Photoshop、Sketch、Axure、蓝湖等软件最起码精通一个，熟练使用一两个，另外色彩、排版等这些美术相关的功底，一个都不能少，没事还要看看相关理论。要知道，实践决定走多快，理论决定你走多远