UI教程:绘制逼真的多肉植物

好文转载 分类: 教程 版权: 原作者: 丝路教育
2215 29 24 2
2017-03-21
12.4

  上班的人,每天对着电脑,要是能有一个可爱的绿植放在眼前,那一定是极好的。最近多肉植物受到了很多人的青睐,她肉肉的外形看起来很Q萌,所以,你想不想买一盆放在办公室呢?先不考虑这个,今天小编可是给大家带来了设计教程的,说到教程,是不是觉得小编刚才讲了一堆废话,不不不,今天的是关于做肉植物的哦。那一个多肉植物拟物化的UI设计课程即将开始。

  之前看到这个图形很喜欢,就自己尝试着画了,

  有很多细节的地方不够精致,

  继续努力!

  我们先看下最终效果

Image title

  现在开始!

  1、新建文档600x800px如图:

Image title

  2.将我们在纸上绘制好的手稿植入PS

  然后适当调低手绘稿的透明度,这里我调的透明度是60%,根据自己方便识别度而定.

  调低透明度可以方便我们描绘,就相当于加了一层硫酸纸一样.

Image title

  3,我们用钢笔工具开始描绘叶子的形态,首先绘制每片叶子的大轮廓

Image title

  4.新建图层,开始上底色

  线条有不对的地方可以适当调整

Image title

  5.在颜色铺好以后,我们要检查一下叶子叠放的顺序对不对,通过调整图层顺序来调整叶子上下前后的顺序.

  6.根据个人习惯我先给部分叶子底部深了一点颜色,好区分层次感.

  颜色加深,我们可以通过工具栏里的加深减淡工具

Image title

  我们选用阴影,适当调低曝光度,可以让颜色看起来没那么重.

Image title

  7.调整每片叶子的立体感

  首先,我们可以给它一个渐变叠加

  先用钢笔工具绘制一个与外轮廓相近的线条

Image title

  给它一个深色的渐变

Image title

Image title

  然后利用高斯模糊工具,让深色部分看起来没那么生硬

Image title

  再复制一个我们做好的深色阴影图层,调节图层大小,让阴影与边缘贴近一点

Image title

  大家可以按照自己的想法调整

  然后我们在叶子边缘绘制一个区域来展现叶子的厚度感

Image title

  给它一个较深的颜色

Image title

  同样我们给它一个高斯模糊

Image title

  因为多肉植物的质感强,所以我们在给阴影,的时候最好都用高斯模糊来调整一下

Image title

  现在我们要做的是给叶子一个圆润的感觉,我们先根据叶子的形状画一个弧度

Image title

  给一个深色的填充,同样模糊一下

Image title

  在左上角给一点亮色

Image title

  在尖角部分给一个红色的透明渐变

Image title

  其他叶子上色方法也是如此,大同小异

  只要根据叶子的形状,方向来上色就可以了,在叶子的边缘适当的用接近白色的亮色来修饰一下,

  表现出叶子的厚度和质感…..

Image title

  8.上完色后记得给叶子们加点投影效果

Image title

  9.绘制花盆,我们先绘制一个圆角矩形框

  我的矩形框半径设置的是100

Image title

  10,调整矩形的混合模式

  先调整斜面浮雕

Image title

  添加投影

Image title

  11.复制一个矩形2,图层移至矩形1下面,将矩形2下移

Image title

  12,做盆里面的效果

  在矩形图层下新建图层,画矩形,填色

Image title

  将我们的土壤素材放入PS中,创建剪贴蒙版

Image title

Image title

  将小草的素材移入PS,创建剪贴蒙版

Image title

  13.添加一个木质背景 OK!

Image title

首发地址: 用UI绘制逼真的多肉植物_丝路教程网

资源地址: http://blog.silucg.com/UI/jc/5717.html(分享请保留)

吃吃吃

193粉丝/0关注

网页设计中对齐原则的运用如何有效利用网页设计中的留白

京ICP备14007358号-1 / 京公网安备11010802014104号 / Powered by 2008-2018 UI.CN