漂亮实力派！教你用Sketch绘制一枚精美的锤子论坛图标

编者按：好久没出Sketch教程了，今天跟着@老罗弟弟_罗方可 来一发图标临摹，原图标是锤子科技的UI高手方迟设计的，效果惊艳。刚买Sketch的同学，内文附有新手系列教程，帮你从零开始掌握Sketch。不多说，先看今天教程。

Sketch源文件免费下载：http://pan.baidu.com/s/1ntMnLxf

1. 《SKETCH设计教室！从零开始学APP设计利器SKETCH（一）》
2. 《SKETCH设计教室！从零开始学APP设计利器SKETCH（二）》
3. 《SKETCH设计教室！带你了解超好用的SKETCH插件》
4. 《想要一稿过不加班？SKETCH绝配神器MIRROR抢先体验》

工具：Sketch 3.3.2

首先，先画一个水箱

新建圆角矩形、调透明度，然后调大小。

水箱的角，我是直接添加描点绘制的。

接下来就是添加水箱的边，和凹面绘制。先看一下所有样式。

因为这个水箱的边内外有两个切面，所以描边一共有三层。

第一层、第二层分别是线性渐变。

第一层比第二层短，这是因为第二层才是水箱边的内切面。

这是第三层，这里我使用了环形渐变，因为水箱角的上部_外切面也是高光的。

接下来是水箱凹面。

这里使用了两个样式，径向渐变+内阴影。

同样的，外阴影也两个。

红阴影

黑阴影

接着画水

同样，先把水部分的轮廓勾出来，然后调整渐变色。

水与水箱之间是有“缝隙”的，所以也是要有“边”。

接下来添加水面的波纹。

水波共两层（ Path 21、Path 22 ）。

绘制方式：Path 21 是纯色面+描边，Path 22 是线段，色彩自己看着调，这里不上图了。

气泡

感受一下矢量图和位图之间的差别。

直接上图。

径向渐变填充

描边居中、线性渐变

外描边、纯色填充

之后就是复制、粘贴、放大缩小、变形。

水影

水面上半部分的 LOGO 我就不说了，我直接说水影。

水影我是直接绘制的，共两层（愚蠢的方式）。

第一层我用的高斯模糊。注意！是 Path 1 ~ Path 10 。

这是第一层 Path 24 的样式（变焦模糊）。

第二层全部是变焦模糊。注意！变焦模糊会严重变形曲线，所以一定要使用蒙版（蒙到“水”里）。

主体完成，来做背景

也是两层。

这是“背景”层，径向渐变+杂色。

然后复制一层（中心背景），并添加圆形蒙版。

最后，改一下“中心背景”层的杂色。

完。

第一次用Sketch好紧张，如何假装经常用？

1，迁移
《高效省时教程！PHOTOSHOP用户如何迁移到SKETCH？》

2，看新功能（安利必备）
《对比才有看头！SKETCH秒杀PS CC 2015新功能的7个地方》

3，好用的插件
《前端神器！为网页设计而生的15个优质SKETCH插件》

原文地址：zhihu
作者：@老罗弟弟_罗方可

【优设网 原创文章 投稿邮箱：2650232288@qq.com】

================关于优设网================
"优设网uisdc.com"是国内人气最高的网页设计师学习平台，专注分享网页设计、无线端设计以及PS教程。
【特色推荐】
设计师需要读的100本书：史上最全的设计师图书导航：http://hao.uisdc.com/book/。
设计微博：拥有粉丝量102万的人气微博@优秀网页设计 ，欢迎关注获取网页设计资源、下载顶尖设计素材。
设计导航：全球顶尖设计网站推荐，设计师必备导航：http://hao.uisdc.com