之前寫過：前幾天在網(wǎng)上看到一組漂亮的空狀態(tài)接口。它們都是由 完成的，并添加了紋理、顏色和干凈的界面。正好我前段時間做的產(chǎn)品中也用到了一些紋理插畫，所以在這里我給大家講解一下如何利用雜點來繪制紋理插畫，并與大家分享一些小經(jīng)驗。 （ps：嗯，我想我對紋理插畫很著迷，哈哈）

本文主要內(nèi)容：

1、UI設計中的紋理插畫分析

2. 雜點的使用方法

3.紋理插畫教程（附詳細步驟圖）

4.展示我畫的紋理插畫，啦啦啦

1、UI設計中的紋理插畫分析

上面的6張圖片是從我看到的一組圖片中選出的。我們可以看到，這些界面的插畫在陰影部分和某些元素上添加了噪點和漸變，讓插畫更加立體。并且層次感得到了更好的體現(xiàn)。下圖中，我在圖中標注了添加噪點的地方以及具體參數(shù)。

2.如何運用文中的雜點？

如果我們想畫這樣的插圖，我們首先必須了解如何使用其中的噪音。

1. 在哪里添加噪音？

答案：第六個填充在檢查器中

2、噪聲點參數(shù)如何設置？

答：噪點文字主要有四種：原始、黑白、彩色疊加模式與PS中相同。通過分析上面的紋理圖，我發(fā)現(xiàn)常用的主要有三種：、、。強度不需要設置太高，在5%-30%以內(nèi)即可。

3、四類雜文有何區(qū)別？

答：從下圖中我們可以發(fā)現(xiàn)噪點的密度為：顏色>白色>原始>黑色。您可以根據(jù)插圖所需的噪點強度選擇未使用的文本。

需要注意的是，噪點層要位于顏色填充層之上，否則噪點會被覆蓋。此外sketch怎么用，您還可以選擇深色背景上的變暗疊加模式，以及淺色背景上的疊加模式。這還需要具體問題具體分析。

3.紋理插圖教程

我們以這張圖為例來講解如何繪制紋理插畫。

1. 我們先來分解一下這些要素。拆開之后是不是覺得很簡單呢？

2、新建一個375*667的畫板，設置畫板的顏色為#sketch怎么用，然后新建一個375*227的矩形，用#-#填充漸變

3.分解植物并用鋼筆工具繪制這些形狀。不要忘記添加漸變。

4、用同樣的方法分解杯子，用筆畫出來

5.將書分解，畫完后復印。

6.結合這些元素，添加文案，添加噪音。添加噪聲的方法前面已經(jīng)解釋過。具體參數(shù)如下所示。

4.我繪制的紋理插圖展示

這里選取了一些部分，主要是APP引導頁面和一些日程詳情頁面。有的是畫出來的，有的是AI的。噪聲點全部添加。我添加的噪聲點的強度相對較小。您可以根據(jù)自己的情況進行調(diào)整。進行調(diào)整。

以上內(nèi)容是我自己總結的。可能還存在很多不足。歡迎加我微信與我交流：也可以關注我的公眾號：。

如有侵權請聯(lián)系刪除！