千锋教育-做有情怀、有良心、有品质的IT职业教育机构

400-811-9990
当前位置:千锋视频教程 >  UI视频教程  >  UI视频教程内容补充:关于UI设计的规范和技巧

UI视频教程内容补充:关于UI设计的规范和技巧

时间:2018-07-06 14:18     来源:千锋视频教程 作者:千锋老师

大家看ui视频教程这么久了,相信大家已经对技术了解的比较不错了。作为如今已经成为一名优秀UI设计师的你们来说,对产品的理解,天马星空的创意,这些都是可以滴,但是要将这些想法落地,就需要我们熟练并且高效的使用绘图软件。

我们的ui视频教程里没有讲过,这里给大家简单说一下,UI设计和视觉设计最大的区别是,UI设计有很多的规范和技巧需要设计师学习,否则在做UI设计时你会经历无数的痛苦,痛苦遭受了但做的东西还不符合业界规范,这就费力不讨好了。今天就给大家分享一篇UI设计师必须知道的规范和技巧。

1. 设置网格线 保持像素完美

不在1:1分辨率下也能保持像素完美,可以通过创建网格线来避免虚边的出现。编辑 > 首选项 > 参考线、网格和切片保持尺寸为偶数。

例如:设置网格线间隔为64px,子网格为64

2:自动对齐网格

平时画icon的时候会常常使用到二分一、三分一或者其他比例的线条,所以一般会对网格对齐功能进行关闭。而做界面的时候我们要求更加精准的界面,所以通常会开启网格对齐功能。

开启与关闭网格对齐方法:Ctrl+K 勾选“将矢量工具与变化和像素网格对齐”

3:图层自动选择

当做UI设计时,我不会将某个图层隐藏,可能是用AI习惯了```我最喜欢的一个Illustrator一个原因是:无论你选择了什么,它会直接在工作区域显示,你也可以点击你想编辑的事物,它就会被选中。

但是在PS中,如果你想选什么,有三种方法:1. 去图层面板里选择;2. 按住CTRL点击鼠标左键选择;3. 单击右键选择你要的图层(如果有很多图层的时候,上帝保佑你能找到它…)

其实PS中也是有类似于illustrator的工具——自动选择。选择工具栏里的移动工具后,上面的选项栏会粗线一个“自动选择”和一个下拉菜单,将自动选择打上勾勾,下拉菜单选择图层。欧了~现在你试试,无论何时都可以自由的选择图层了~

4:多窗口利用起来

如果你浏览过窗口菜单,你将会看到“排列”>为“**”,这个选项会为你当下的文件开一个新窗口。这样做的好处是:若你在其中一个窗口的图层里画画,另一个窗口会有同样的变化~简单来说,这就是一个文件的两个相同视图。在UI设计中我们经常会找一些素材作为参考,同事开启多个窗口会帮我们大大提升效率。并且当你制作一个文件,既需要线上发表,又需要打印出来,颜色模式一个是RGB,一个是CMYK那就更需要这种方法了。

五、捷径!——为图层或蒙版创建选区(这点开始以为大家都知道,结果```)

按住CLRT键,点击图层缩略图,你将对图层里的文字或形状创建一个选区,如下图所示,用这种方法选文字和错综复杂形状非常方便。

等等别急,真正的精华来了,它不仅仅作用于图层,也适用于蒙版。你可以在矢量蒙版上试试。

六,操纵变形

用操纵变形转换一个图片时,只需点击 编辑>操纵变形,图片就会被很多线分成一小块一小块的。在每条线的连接点你都可以放置一个图钉,在一个图片中,你至少需要两枚图钉。可动的图钉为外黄里黑,不动的仅有黄色。使用操纵变形,你可以对图片进行部分移动,方法:在不需要移动的位置放置图钉,拉动你想要变换的区域。

删除图钉的方法是:按住ALT并点击需要删除的图钉。 PS,按住ALT键时,可动的(外黄里黑)图钉会出现一个大圈,然后左右拖动久可以产生变化了。

七、用“样式”来储存预先设置效果

当你做完投影、内阴影,渐变叠加等选项后,突然看见混合选项框的右边有个新建样式!轻轻点击它,就能保存你的制作,太省时间了擦。

另一种方法是选择有你想要储存的样式的图层,打开样式面板(或者在“窗口”选项里找),然后点击“新建”样式(与新建图层图标一样),最后储存。

然后在这个面板里,你可以看到你已经储存的样式(还有那些死挫的PS自带样式…)。赶紧滴,试试吧

八、拒绝取消,改用复位

这个估计很多老司机也不知道这个隐藏功能。处于新手阶段的筒子们一定觉得曲线和色阶调整挺难的,有些时候有些色阶结合或是其他的调整不能很好的融合,这就导致设计师不得不重新开始。通俗的对应方法是:点击取消按钮,或者重新打开调整面板。

不过这里还是有节省时间的小窍门~当你想要重新做一个曲线,不要直接点击取消按钮,按住ALT键,“取消”将会瞬间变身成一个叫“复位”的东西…

点击复位,曲线就会回到初始状态了~

ps这款软件,如今很多人活多或少的都会一点,有些人懂了些皮毛就以为自己精通了,但看过我们ui视频教程的同学都知道,其实ps的奥秘还有很多,小技巧也有很多,有很多工具都能为我们节省很多时间,如果你不会用的话就会多花很多时间去抠图,之前的ui视频教程中我们也提到过,对于一个好的ui设计师来说,最需要的就是时间,如果把时间都浪费在软件操作上,很显然是得不偿失的额,所以就需要咱们的同学虚心去请教学习,这样才能持续进步。

  • 北京天丰利校区(总部)地址:北京市海淀区宝盛北里西区28号天丰利商城4层
    北京沙河校区:北京市昌平区沙阳路18号北京科技职业技术学院广场服务楼2、3层
    咨询电话:400-811-9990
    面授课程:HTML5大前端培训、JavaEE+分布式开发培训、Python全栈+人工智能培训、全链路UI/UE设计培训、物联网+嵌入式培训、360网络安全、大数据+人工智能培训、全栈软件测试培训、PHP全栈+服务器集群培训、云计算+信息安全培训、Unity游戏开发培训、区块链、红帽RHCE认证、好程序员
  • 深圳西部硅谷校区地址:深圳市宝安区宝安大道5010号深圳西部硅谷B座A区605-619
    深圳大学城校区地址:深圳市南山区留仙大道1201号大学城创客小镇16栋3楼
    咨询电话: 0755-23015275/23015546-801(硅谷) 0755-86660670-801(大学城)
    面授课程:HTML5大前端培训、JavaEE+分布式开发培训、Python全栈+人工智能培训、全链路UI/UE设计培训、物联网+嵌入式培训、360网络安全、大数据+人工智能培训、全栈软件测试培训、PHP全栈+服务器集群培训、云计算+信息安全培训、Unity游戏开发培训、区块链、红帽RHCE认证、好程序员
  • 上海校区地址:上海市宝山区同济支路199号智慧七立方3号楼2-4层
    咨询电话:400-811-9990 021-65233829-609
    面授课程:HTML5大前端培训、JavaEE+分布式开发培训、Python全栈+人工智能培训、全链路UI/UE设计培训、物联网+嵌入式培训、360网络安全、大数据+人工智能培训、全栈软件测试培训、PHP全栈+服务器集群培训、云计算+信息安全培训、Unity游戏开发培训、区块链、红帽RHCE认证、好程序员
  • 郑州校区地址:郑州市二七区航海中路60号海为科技园C区10层、12层
    咨询电话:0371-55191750
    面授课程:HTML5大前端培训、JavaEE+分布式开发培训、Python全栈+人工智能培训、全链路UI/UE设计培训、物联网+嵌入式培训、360网络安全、大数据+人工智能培训、全栈软件测试培训、PHP全栈+服务器集群培训、云计算+信息安全培训、Unity游戏开发培训、区块链、红帽RHCE认证、好程序员
  • 广州校区地址:广州市天河区元岗路200号慧通产业园B9三层
    咨询电话:020-38035223 020-38035220
    面授课程:HTML5大前端培训、JavaEE+分布式开发培训、Python全栈+人工智能培训、全链路UI/UE设计培训、物联网+嵌入式培训、360网络安全、大数据+人工智能培训、全栈软件测试培训、PHP全栈+服务器集群培训、云计算+信息安全培训、Unity游戏开发培训、区块链、红帽RHCE认证、好程序员
  • 大连校区地址:辽宁省大连市高新园区爱贤街10号大连设计城A座901
    咨询电话:400-811-9990
    面授课程:HTML5大前端培训、JavaEE+分布式开发培训、Python全栈+人工智能培训、全链路UI/UE设计培训、物联网+嵌入式培训、360网络安全、大数据+人工智能培训、全栈软件测试培训、PHP全栈+服务器集群培训、云计算+信息安全培训、Unity游戏开发培训、区块链、红帽RHCE认证、好程序员
  • 武汉金融港校区地址:武汉市东湖高新技术开发区光谷大道77号金融港B18栋3楼
    武汉智慧园校区地址:武汉市东湖高新技术开发区光谷大道61号智慧园21栋2楼
    咨询电话:027-59313371
    面授课程:HTML5大前端培训、全链路UI/UE设计培训、PHP全栈+服务器集群培训、JavaEE+分布式开发培训、大数据+人工智能培训、 Unity游戏开发培训、360网络安全、Python培训、云计算+信息安全培训、全栈软件测试培训、智能物联网+嵌入式培训
  • 成都校区地址:成都市武侯区科华北路62号力宝大厦N(北楼)18楼
    咨询电话:400-811-9990 028-83178771
    面授课程:HTML5大前端培训、JavaEE+分布式开发培训、Python全栈+人工智能培训、全链路UI/UE设计培训、物联网+嵌入式培训、360网络安全、大数据+人工智能培训、全栈软件测试培训、PHP全栈+服务器集群培训、云计算+信息安全培训、Unity游戏开发培训、区块链、红帽RHCE认证、好程序员
  • 西安校区地址:西安市雁塔区高新六路52号立人科技C座西区4楼
    咨询电话:029-85363390
    面授课程:HTML5大前端培训、JavaEE+分布式开发培训、Python全栈+人工智能培训、全链路UI/UE设计培训、物联网+嵌入式培训、360网络安全、大数据+人工智能培训、全栈软件测试培训、PHP全栈+服务器集群培训、云计算+信息安全培训、Unity游戏开发培训、区块链、红帽RHCE认证、好程序员
  • 杭州旺田校区:浙江省杭州市江干区九堡旺田书画城A座4层
    杭州龙驰校区:浙江省杭州市下沙经济技术开发区元成路199号龙驰智慧谷B座7层
    咨询电话:400-811-9990 0571-86893632/0571-86094032
    面授课程:HTML5大前端培训、JavaEE+分布式开发培训、Python全栈+人工智能培训、全链路UI/UE设计培训、物联网+嵌入式培训、360网络安全、大数据+人工智能培训、全栈软件测试培训、PHP全栈+服务器集群培训、云计算+信息安全培训、Unity游戏开发培训、区块链、红帽RHCE认证、好程序员
  • 青岛校区地址:青岛市市北区龙城路卓越世纪中心3号楼8层801
    咨询电话:0532-80911190
    面授课程:HTML5大前端培训、JavaEE+分布式开发培训、Python全栈+人工智能培训、全链路UI/UE设计培训、物联网+嵌入式培训、360网络安全、大数据+人工智能培训、全栈软件测试培训、PHP全栈+服务器集群培训、云计算+信息安全培训、Unity游戏开发培训、区块链、红帽RHCE认证、好程序员
  • 重庆校区地址:重庆市高新区科园一路2号大西洋国际12-1
    咨询电话:400-811-9990 023-68883009
    面授课程:HTML5大前端培训、JavaEE+分布式开发培训、Python全栈+人工智能培训、全链路UI/UE设计培训、物联网+嵌入式培训、360网络安全、大数据+人工智能培训、全栈软件测试培训、PHP全栈+服务器集群培训、云计算+信息安全培训、Unity游戏开发培训、区块链、红帽RHCE认证、好程序员
  • 长沙校区地址:湖南省长沙市岳麓区麓谷企业广场A2栋三单元306号
    咨询电话:0731-85513210
    面授课程:HTML5大前端培训、JavaEE+分布式开发培训、Python全栈+人工智能培训、全链路UI/UE设计培训、物联网+嵌入式培训、360网络安全、大数据+人工智能培训、全栈软件测试培训、PHP全栈+服务器集群培训、云计算+信息安全培训、Unity游戏开发培训、区块链、红帽RHCE认证、好程序员
  • 哈尔滨校区地址:哈尔滨市松北区创新一路699号 科技创新城19号楼B座五楼
    咨询电话:400-811-9990/0451-87173191
    面授课程:HTML5大前端培训、JavaEE+分布式开发培训、Python全栈+人工智能培训、全链路UI/UE设计培训、物联网+嵌入式培训、360网络安全、大数据+人工智能培训、全栈软件测试培训、PHP全栈+服务器集群培训、云计算+信息安全培训、Unity游戏开发培训、区块链、红帽RHCE认证、好程序员
  • 南京校区地址:南京市建邺区应天大街780号应天智汇产业园弘辉园1幢2楼
    咨询电话:400-811-9990
    面授课程:HTML5大前端培训、JavaEE+分布式开发培训、Python全栈+人工智能培训、全链路UI/UE设计培训、物联网+嵌入式培训、360网络安全、大数据+人工智能培训、全栈软件测试培训、PHP全栈+服务器集群培训、云计算+信息安全培训、Unity游戏开发培训、区块链、红帽RHCE认证、好程序员
  • 千锋教育服务号

    了解千锋动态
    关注千锋教育服务号

  • 千锋教育移动站

    扫一扫快速进入
    千锋移动端页面

  • 千锋互联服务号

    扫码匿名提建议
    直达CEO信箱