详解高手设计师是如何临摹作品

记得刚开始学美术的时候，都是从临摹开始的，等到一定的阶段才开始写生，照着实物画。这个过程根据个人能力有长有短，但是每个人都必须经历无法避免。

现在回想起来，印象最深的是画室老师让我们上午临摹一张图，下午就立马默写这一张图，刚开始的时候，连画面基本布局都记不清，苹果有几个、分别在哪里都会混乱，但没办法老师要求不能去看原图，只好硬着头皮画。慢慢的到后面，临摹的时候就会下意识的去记一些布局、画面笔触，最后也能还原到百分之八九十了，而且等下次其他同学默写同一张图的时候，还能说出画面某个地方的笔触应该是怎么怎么样的，记得特别牢靠。

在做 UI 的时候，我也发现有很多异曲同工之处。前期都是需要去大量临摹好的页面，然后记忆，形成条件反射，最后再为己用。但很不幸很多新手在入行之初，完全忽略了这点，包括刚入行时的我，拿到原型之后，一味的想自我创新，页面布局、字体大小、间距等都没有深入的去研究，完全凭着感觉来。这做不好也实属正常。

那怎么改善这一情况呢?最好的方法就是从临摹开始。

一、怎么找临摹素材

临摹最重要的就是找素材，素材的好坏直接影响到后期的效果。建议临摹线上 APP，线上 APP 的页面在落地前经过很多人的打磨，特别是那些大厂的 APP，直接去临摹就好，并从中找到规律所在。

二、临摹四步曲

很多人临摹的时候，总喜欢「描摹」，比照着原图进行临摹，但这样的成效有限，没有经过太多的思考。我建议可以和上面我讲述的学画画的故事一样，描摹完之后再凭借记忆画一遍，画完之后再比照着原图进行修改。

在临摹 UI 界面时，需要有侧重点，我自己的经验是可以先从临摹图标开始，然后再扩展到布局、字号、间距等，逐个击破。之所以推荐从图标开始，是因为它是每个 APP 中不可或缺的，画不好会直接导致页面不精细，没有细节，而画的好的话也能直接提升页面质感。

1. 图标

初期只需要单一的临摹图标，不过需要注意的是不要只临摹一个两个，而要整套临摹，一个两个图标看不出来整体性，而 UI 界面上的图标也是整套出现，不会单独存在。

过程中也需要有意识的找一些当前不会画的、和之前风格不一样的图标，扩展宽度以及转换思维。不把自己限制在一个局限的空间里。

等手头功夫练到一定阶段的时候，再去和页面相结合了。以我的经验来说，前期练手头功夫很重要，相当于打地基，单纯的临摹图标会让你更在意图标本身，是否和原图一致，怎么画才是最方便快速的。

如果一开始就临摹一整个页面，就会过多的去关注页面，而忽略了图标的细节。举个例子，如下图1、图2相信大家第一眼看到的肯定是整体的页面风格、调性怎么怎么样，看完之后还会觉得这两个页面是一样的，没有区别?

但其实并不是，注意看一下导航栏上的图标，两个页面的图标在细节上不一样。图1的3个图标描边粗细、大小都不一致。而图2是调整后的，看起来整体统一很多。这些小细节在整体页面中很容易忽视，自己也很难意识到，但是当把它们单拎出来时，就很容易发现问题所在了。

以上只是列举的一个小例子，在实际工作中还有很多很多，所以我建议是先临摹整套图标，把一整套图标放到一起，看看是否统一。

2. 页面

当这一步攻克的时候，就可以到下一步了，临摹整套页面。去找几个线上的图标多的页面了，最常见的就是个人中心页面以及视频类 APP 的频道页。去临摹整个页面。这个时候就要多去注意图标和页面风格是否一致、和字体是否匹配等等。

3. 分析总结

临摹完了之后，要学会总结，比如个人中心图标一般多大、配多大的文字以及颜色等等，不然久了之后就都忘了，白临摹了。比如拿刚刚京东金融和陌陌的页面举例：京东金融是40*40px 的图标配32px 的文字，cell 的高度100px。

而陌陌是48*48px的图标配36px 的文字，cell 的高度100px。

再对比两个产品，你会发现虽然他们字号和图标大小不一样，但是他们的 cell 高度都是100px，那下次自己做的时候就可以优先尝试 100px 的 cell 高度。这样等积累的素材够多时，自己再做页面的时候就心中有谱了，就不用闷头苍蝇一样乱做了。

再额外扩充一点，如图两个 APP 图标距离文字和图标距离页面边距是一样大的，一个都是32px，一个都是30px。