Photoshop绘制科技感十足的网页立体插画设计教程

2019-02-27 10:45 来源： UI中国 作者：设计遇上思想 人气： 次阅读 我要投稿
Photoshop结合AI绘制城市扁平场景插画设计教程

Photoshop结合AI绘制城市扁平场景插画设计教程

18890

本教程主要使用Photoshop结合AI绘制城市扁平场景插画，在绘制的过程中，学会效果中形状的绘制以及运用配色的方
Photoshop结合AI绘制质感自行车插画设计教程

Photoshop结合AI绘制质感自行车插画设计教程

18805

教程内容来自Ranganath Krishnamani的作品，临摹插画到没有什么难度，主要运用了一些基础形状工具和刚钢笔工具，
Photoshop制作简约渐变风格的插画设计教程

Photoshop制作简约渐变风格的插画设计教程

18799

制作如下图所示这种插画很简单，网上亦有很多类似教程，但是发现其中大多是针对于有部分基础的人群，制作步骤上对

step4：立体的图了，这个我们需要先把层分出来，就跟刚刚对整个画面分层是一样的道理，先来看第一个。

Photoshop绘制科技感十足的网页立体插画,PS教程,

Photoshop绘制科技感十足的网页立体插画,PS教程,

将元素组合起来，就是模型01的样式了。

接下来看一下有光的效果的是拆分。

Photoshop绘制科技感十足的网页立体插画,PS教程,

剩下的就是叠加上去，凹进去的可以创建剪切蒙版，快捷键ctrl+alt+G

等几个图形都制作完毕后，就进行一下整体的调节，添加一些周边的东西。剩下还有一个按钮，叠加了两层，原本考虑直接用内阴影，效果不理想，于是就分两层来做了。

Photoshop绘制科技感十足的网页立体插画,PS教程,

最后，成品啦!

Photoshop绘制科技感十足的网页立体插画,PS教程,

附上一张应用立体感觉设计的图，放在网页上面，网站看起来就比较专业啦~

Photoshop绘制科技感十足的网页立体插画,PS教程,

3/3首页上一页 1 2 3
插画设计   插画   网页设计
上一篇
下一篇