Sketch实例教程： 快速绘制出写实风的一杯绿茶俯视图

Sketch Mac是一款为设计师量身定做的优美界面和强大工具兼有的专业绘图工具。能够满足网页、用户界面、图标等的设计需求。 Sketch是一款为设计师量身定做的优美界面和强大工具兼有的专业绘图工具。制作出漂亮的图形是一件很有挑战性的事情，你所需要的是一款精心设计的应用 程序。此次小编带大家Sketch实例教程： 快速绘制出写实风的一杯绿茶俯视图。

首先看看画好的成品。

一、绘制碟子

1、首先建立新的空白sketch文档，拉一个art board（艺术板），尺寸随意，这个软件是矢量软件，大小不会有什么影响，唯一要注意的就是如果放缩的话设置图层样式的时候需要改参数。按R键，画一个和画布一样大的矩形，取消borders（描边），填充3层（也可以自定义），分别为：

第一层，pattern(图案填充)，选择第三个白色底纹，模式normal（正常）；

第二层，flat color(单色填充)，颜色为897A4C，叠加模式overlay（叠加）；

第三层，还是单色填充黑色（000000），模式改为soft light （柔光）。

锁定图层，图片看起来有明显分隔线，是由于放缩的原因，实际导出后不会看到。

2、首先我们需要确定光源方向，这里我定的视角是顶部正视，光源是从画面上方打下来的，所以投影应该在光源下方。现在我们需要画一个茶碟，在画布中画一个正圆（快捷键O，按住SHIFT画正圆），尺寸584x584。填充渐变色：FFFFFF 到F4F3F1 ；添加shadows（投影），参数为：0，20，30，0 ，颜色纯黑，30％透明度；添加inner shadows（内阴影），参数为：0，1，16，0，颜色纯白，50％透明度 。

3、选中形状，command+D复制一个形状，尺寸改为572x572，垂直翻转，对齐，取消小圆的投影效果，保留inner shadows ，勾选gaussian blur（高斯模糊），数值改为4，我们会得到下面这样的，碟子的高光和凹凸感初步得到呈现，接下来还需要进一步刻画。

4、再次复制572px的圆,大小改为380px，使用镜像工具垂直翻转，对齐，高斯模糊参数改为2px，这次inner shadows 也取消掉，这样我们就得到了一个有点样的碟子了。现在我们再加上一个放光效果，我们复制一个572px的圆，移动到最顶层。接下来按V键（钢笔），画一个形状，利用布尔运算和圆一起合并剪出一个月牙形的反光区域（可以是subtract减去或者是intersect相交），形状参考图片。然后我们需要删除这个图层所有效果，填充一个渐变色，参数如下：FFFFFF 100％到 FFFFFF 0％，方向范围自己调整一下，大概是右上到左下。这样，我们的碟子就绘制完成了，可以把碟子的图层都编组（CMD+G）并且锁定（CMD+SHIFT+L），以免影响后续的操作。

ps：这里要说的是，很多反光率高的东西上面的反光并非一定是光源直接影响，可能是反光板或者其他东西投射到物体表面的效果，例如手机我们经常能看到漆黑的屏幕上有一道圆弧形的反光，这个实际是反光板的投射效果。这里我没有实际的照片参考，所以就自己臆想一下，反正就是想要衬托一下质感的么。

二、绘制茶杯和茶水

现在我们开始第二部分，茶杯和茶水的绘制，这里的方法还是和第一部分的碟子很相似的，下面开始。

1、在碟子上方画一个318x318的圆，填充渐变色：FFFFFF 到F4F3F1 ；添加shadows(投影)，参数为：0，10，20，0，颜色纯黑，20％透明度；添加inner shadows（内阴影），参数为：0，0，6，0，颜色纯黑，20％透明度。

2、画一个296x296的圆，填充渐变色：569500 35％到E5FFAE 20％，勾选 gaussian blur （高斯模糊），模糊程度为2px，整体透明度改为60％（选中图层，按数字键6即可）对齐。这个是茶水的散射效果（以前学3D的时候好像就这么叫的，不过都3D都还给老师了）。效果如下。

3、画一个220x220的圆，填充渐变色：FFFFFF  0％到F2F2F2  100％；添加inner shadows （内阴影），参数：0，-1，1，0；勾选gaussian blur（高斯模糊），模糊程度1px，这个是杯底，得到下图的效果。

4、复制刚才第2步做的茶水散射图层，移动到最顶层，并且将尺寸改为260x260；填充渐变色为：B0CE58  100％ 到 C3F25E  40％。这样，茶水部分也绘制完毕，下过如下。将上面这几个图层成组，命名为杯子，并且锁定。

三、茶叶

好了，进入最后一部分茶叶的绘制，茶叶看起来比较难绘制，但是实际上茶叶是很容易绘制的，只要掌握了方法，就能轻松绘制出栩栩如生的茶叶，这里的茶叶我并未深入刻画纹理（例如叶子的叶脉），如果深入刻画也是可以的，但是考虑到这里茶叶并不需要画得非常精细，所以我们画出大概的样子就行了，有兴趣的回头大家可以自己尝试去进一步刻画。

1、在杯子上方，使用钢笔工具，画出一张合适大小的叶子形状。填充渐变色，CEF042  100％  到  4D941B  100％，方向参考图中。增加inner shadows，参数为：0，0，4，0，颜色  253504 40％；再增加一层inner shadows ，参数为：0，1，2，0，颜色：D3FF95 100％。这样我们得到了一个叶子的雏形。然后我们继续下一步。这里我们可以选中这个图层，点右键，选择 copy style，复制这个图层的样式，后续我们继续画茶叶可以直接选中画好的形状，点右键选择paste style即可粘贴图层样式。

2、CMD+D原位复制刚才的叶子，按return键，进入路径编辑状态，这时候光标会自动转为钢笔工具，用钢笔工具选中叶子的一边的一个节点，往叶子中间移动，最后得到半张叶子的形状，叠在原来的完整叶子上面，就出来了一个比较精致的叶子了。

3、继续用相同的方法绘制茶叶的叶芽和叶瓣，最后得到如下的单个茶叶效果。最后把每个茶叶成组，对组添加shadows（投影），参数为：0，15，8，0，颜色：2C6206  15％。

最终完成效果图：

顺便改了个红茶的