妙笔生花：立体图标手绘设计实战

的文章里我们已经教大家如何运用五大调子来塑造出物体的体积感了，如果平常你已经做了大量练习，那么今天将是你能力的提升。今天手把手教大家如何利用素材进行图标的再组合，以及如何用手绘表现出图标的质感。

一、图标的形体构图

如果你也对海底的世界充满好奇，那么今天为我们请来的荐书人的这本书，将会极大满足你的探索欲望哦。不管塑造任何事物，第一步都要把构图做好。由于今天我们要画一个便签图标，便签肯定和书本有关，所以要知道书的基本特征。之前和大家说过要多观察生活中的事物，从生活中选取设计元素进行图标的设计，所以如果你不知道如何构图的话，可以找一本书进行观察。

书是方形、有厚度的，更细致的特征也要观察到，比如书封面上的压痕，这些都可以运用在这次的图标绘制上，观察完后我们就要把这些特征和图标相结合了。

1.确定图标大小

先在纸上画一个正方形，确定图标大小。如果没有特殊要求，图标形状我们尽量画的圆润一些，圆润的物体会给人舒适、亲切的感觉，太尖锐的图标给人感觉比较硬，这是形状给人最直观的心理感受。所以我们把正方形改为圆角矩形。

2.确定书籍宽度和厚度

快速将矩形等分为五份，留下左侧的线条，其他四条线擦掉。可能有同学会问为什么我会做出这样的判断呢？我只能告诉你，这需要长时间的练习，熟能生巧，大量的练习会使你的眼睛可以快速判断出物体的比例关系。想要拥有这样的“超能力”，平常就多多练习吧。

快速将矩形等分为五份，留下左侧的线条，其他四条线擦掉。可能有同学会问为什么我会做出这样的判断呢？我只能告诉你，这需要长时间的练习，熟能生巧，大量的练习会使你的眼睛可以快速判断出物体的比例关系。想要拥有这样的“超能力”，平常就多多练习吧。

书籍的宽度确定后，再来确定书籍的厚度。书籍的厚度要根据你的需求而定，如果想表现书籍的立体感强烈一些的话，建议把书做得厚一点。厚度的确定也和比例有关系，我们将圆角矩形等分三份，取三分之一的厚度。

3.丰富图形细节

书籍的宽度和厚度确定好后，再来添加细节。整体画出书籍里面的页数，先不抠具体页面。可以看到，这时的书籍形状已经基本上有了，但这样的图标看起来很呆板，既然是便签图标，那我们可以加一个活泼可爱的便签条。

书籍的封面画一根羽毛，表示一根笔，画羽毛比直接画根笔在封面上要柔和得多。羽毛的特点就是轻盈、灵活，表现效果更好。如果想要体现羽毛飘动的感觉，可以把羽毛增加一些弧度，就好像羽毛随风飘落在书籍上。

画好图形的细节后，整体调整修饰一下前面确定好的形状，擦掉多余线条，图标线稿就画好了。线稿确定后就可以进图标体积感的塑造了。

二、图标体积感的塑造

1. 黑白灰关系的确定

我们需要通过黑白灰的明暗关系来对图标进行体积感的塑造。先将书脊、封面和厚度这三个面用调子表现出来，根据外轮廓的特点铺调子，比如书脊的位置可以用弯曲的线来表现，整个外轮廓上调子可以稍微重一些，然后慢慢往浅调子过渡，刚好到书的压痕。

书的厚度需要画的稍重一些，才能够表现出它和封面的层次关系，这样才能突出书的立体感。

快速把调子铺好，但要注意在上调子的时候不能破坏书的轮廓，一边做调子一边刻画形体，我们应该做到的是调子越精细，形应该越准，而不是调子越精细，形反而没了。

到这一步我们已经把这本书分成了黑白灰三个面，书的厚度作为暗面，这部分调子比较重；书的封面留白，和暗面一对比，书的体积感就出来了；书脊作为灰面，它的调子稍浅一些。

黑白灰这三大关系有了以后，因为羽毛飘在书的封面上，所以它一定会有投影。我们把羽毛的投影做出来，当物体有投影后，你就会发现它的体积感、真实感就出来了。

2.深入刻画细节

做好投影后，我们继续深入塑造书记的体积感。大关系出来以后，我们就需要继续深入了，这一步需要细致的刻画，不要再用大粗线了。把书的页数表现出来，页面虽然是直的，但是一定不要拿尺子比着去画，这样会把页面画得很假。

我们如果想要让页面更真实的话，一定要注意纸张之间的黑白关系和调子的轻重关系。这一步考验的是耐心，一页一页画出来，然后继续调整书籍厚度的调子，只有厚度的调子暗下去，书籍封面才能够被衬托出来。

上调子的时候要注意周围细节的刻画，把小便签画出来，然后继续加重羽毛的投影，利用投影把调子慢慢往外扩散。随着书脊、厚度的调子暗度的增加，书的封面上也要有一层浅浅的调子。如果封面全部留白的话，会显得很假，与其他部分不匹配。

接下来开始羽毛的深入刻画，先给羽毛一层浅调子，然后用手或者纸巾揉一揉，调子揉均匀后用橡皮擦出羽毛的纹理。

一根根擦完后继续修改，该加重的部位加重，该擦的部位再去擦，擦完以后只是一个大效果，还需要我们拿调子去细致的刻画。羽毛与书之间的投影也要随着书的结构转折而变化，书的压痕处投影要弯一点点，到书脊的位置再上来，有一个坡度变化。这样我们所画的投影才真实，才能让人感觉到羽毛是落在书封面上的。

接下来，书的继续加重高光，留出高光。这一步是为了提书的质感了，也是我们得最后一步。提质感一定要黑白关系强烈，页面的边角处，我们拿橡皮擦亮，然后再上一些调子，与周围环境相融合。

书脊的关键就是要突出压痕，所以把压痕擦亮，然后调整它与周围的明暗关系。为了装饰我们的图标，可以增加一些小细节，在书籍封面画一圈虚线，像缝线一样。

为了增加真实感，我们把虚线擦一点小高光，这些特征需要大家在平常生活中仔细观察。这是我们利用书的元素表现了一个便签图标，立体图标的特点就是要有质感，所以明暗关系要处理好，修整外轮廓后图标就完成了。

拟物化图标的重点在于能否观察到质感的特征，并通过明暗关系表现出来。所以，对于手绘来说，手头功夫是最重要的。想提高手绘能力没有捷径，只有通过练习你才可以总结出绘画方法。人们常说会手绘的人是非常幸福的，所以不要把手绘想象成枯燥的一件事情，开开心心的去画画吧，总有一天它会成为你的加分技能。

互动话题：你工作中有没有遇到过手绘方面的困难或者心得，欢迎在留言区写下你的想法和观点。

- END -

这是UI设计研究院第1次推送