Photoshop资源下载
    Photoshop热门视频教程
    微信互动
    一弧

    翼狐网(yiihuu.com)旗下新媒体平台,为设计师定制的《生活周刊》!

    微信号:yihuwang2012

    一键加入QQ群,找组织!问题or需求轻松解决!

    • 高端写实CG技术交流: 710818989 高端写实CG技术交流
    • 翼狐影视后期交流群: 459616562 翼狐影视后期交流群
    • 翼狐影视动画学习群: 102835171 翼狐影视动画学习群
    • 翼狐游戏制作交流群: 285280704 翼狐游戏制作交流群
    • 平面设计PS AI ID学习: 43745569 平面设计PS AI ID学习1群
    • 翼狐插画&漫画&手绘群: 90826203 翼狐插画&漫画&手绘群
    • 翼狐三维设计学习交流: 589292014 翼狐三维设计学习交流

    零基础如何正确的自学UI设计?

    247人浏览 0人收藏 2017-08-07 Photoshop   PS图像设计   UI设计   photoshop图标设计   photoshop界面设计  

    摘要:零基础自学UI首先要知道的就是你自己是否对UI感兴趣,兴趣是最好的老师,如果没有兴趣学习UI,那么自学基本是不可能的,所以自学UI的第一步就是兴趣。

    相关视频教程学习推荐:
    Substance系列应用《PBR材质流程》完整案例教学-SP篇【正版|中字】

    零基础自学ui,大致概括为:

    培养兴趣>提升美感>认识ui>熟悉掌握各软件>实例操作>总结经验


    零基础自学ui首先要知道的就是你自己是否对ui感兴趣,兴趣是最好的老师,如果没有兴趣学习ui,那么自学基本是不可能的,所以自学ui的第一步就是兴趣


    第二步就是提升自己的审美,要学习ui,并且成功的掌握了,不能少的就是自身的审美,画图不可少的就是美感,ui设计师的水平决定了产品的颜值,用户的视觉体验不好,很多时候就会卸载产品,因此零基础的学员还需要提升自己的美感


    第三步并不是学习ui的软件,而是认识ui,不要认为ui设计只是简单的ps画图, ui官方的介绍是系统和用户之间交互和信息交换的媒介,也就是说,ui设计师是设计用户界面的人。


    认识以上的基础之后,我们就可以开始认识ui设计需要的软件了。ui设计常用的软件有photoshop、ai、sketch、ae等,这些软件起码要精通一个,熟练使用两个或以上。

    sketch是面向ui设计师、交互设计师的一款软件,所以建议大家多多熟悉sketch软件,如果你用过ps软件,接触过sketch之后就会了解到sketch的优点,零基础的可以参考sketch零基础入门教程




    通过教程,你能快速了解sketch的基础入门知识,熟悉线框图、流程图、图标设计和界面设计等app产品设计流程,并且通过案例能学习到色彩运用、格式塔设计心理学和黄金分割等设计理论和设计方法,以及熟悉sketch各种高效的插件使用方法。

    零基础如何正确的自学UI设计?

    零基础如何正确的自学UI设计?

    零基础如何正确的自学UI设计?

    类似的教程还有ui设计师利器-sketch教程,也介绍了sketch界面的基础入门,很适合零基础的学员。

    零基础如何正确的自学UI设计?

    △sketch界面

    下面借鉴一个用sketch简单制作的ui小图标的例子,也可以参考sketch基础教程之ios图标制作

    1、按u,绘制圆角矩形。

    零基础如何正确的自学UI设计?

    2、进入edit,点击左上角和左边,添加两个点。

    零基础如何正确的自学UI设计?

    3、然后删除左上角的角点。

    零基础如何正确的自学UI设计?

    4、按v 绘制折线。

    零基础如何正确的自学UI设计?

    5、进入edit 选择折线角点,corners=2 圆角。边框为黑色,粗细为8 。

    零基础如何正确的自学UI设计?

    6、使用样式。

    首先选择折线,然后点击右侧的create new shared style 建立一个新的共享的样式。这个样式就记录了线的各种属性。下面按v,绘制一段线段。选择刚刚新建的path 2 style样式。

    零基础如何正确的自学UI设计?

    7、这个线段就与折线的风格是一样的了。按alt复制,然后调整大小。

    完成之,这作为一个文档图标还可以,但是作为“文本编辑”还缺点什么?缺一支笔。

    零基础如何正确的自学UI设计?

    8、按r 绘制一个矩形,边框为无,填充为黑色。

    零基础如何正确的自学UI设计?

    9、按alt键向上拖动复制,缩小为笔头。

    零基础如何正确的自学UI设计?

    10、按transform按钮,调整笔头的形状。

    零基础如何正确的自学UI设计?

    11、然后,按向下的方向键,使两个图形对象靠近。按group对二者进行组合。

    零基础如何正确的自学UI设计?

    12、按旋转按钮,调整到位。但感觉有点界线不分明。

    零基础如何正确的自学UI设计?

    13、按alt键复制一个为底层。

    零基础如何正确的自学UI设计?

    14、设置底层如下属性。

    零基础如何正确的自学UI设计?

    15、再把”笔”对象叠到上面,按v 绘制一个线段,为白色,粗细为2左右。

    零基础如何正确的自学UI设计?

    16、完成图标。

    零基础如何正确的自学UI设计?

    需要sketch的可以自行百度sketch下载。


    至于ps、ai、ae等的软件我就不详细介绍了,可以自己在网上找一些相关的资料或者书籍教程,如果不知道参考哪一些资源较好,感兴趣的可以参考:

    ps入门教程

    1. ps零基础到精通入门教程

    2.photoshop基础教程实用技能精讲

    ai入门教程

    1. ai基础教程入门

    2.illustrator cc零基础入门教程

    ae基础+实战教程

    李辰:c4d+ae高级特效实例教程


    熟悉了软件之后,就要开始模仿一些实例,一定要坚持练习,从中会得到很多你意想不到的收获。

    总之,零基础自学ui,这本就是一个艰难的过程,自身的毅力也是需要考验的,既然开始自学ui,就坚持下去~

    我就介绍到这里,望交流~

    Photoshop入门到精通视频教程精选
    设计教程