手繪你也許并不陌生，在電商設計中的運用日見頻繁。在剛過去的16年雙11狂歡節(jié)，更是各大手繪大神實力大比拼，各種狂拽炫酷屌炸天，各種奔放洋氣有深度；BUT，今天不講手繪。

今天只講“鼠繪”。當我在腦海中想像到“鼠繪”二個字時，我還天真的以為“鼠繪”一詞是我的初創(chuàng)呢！

還特地跑去百度一下

（來自百度網(wǎng)頁搜索）

百度百科：鼠繪——使用鼠標借助圖形圖像處理軟件來進行“創(chuàng)作”的一種技巧。

我不確定百度百科所說的鼠繪是否跟我接下來要講的“鼠繪”一樣，SO，再次百度圖片去搜索，結果如下：

（來自百度圖片搜索）

這畫風咋跟我想像的不太一樣?。「医裉斓姆窒碛休^大的出入，這TM就很尷尬了；所以接下來的通篇文章，只要提及“鼠繪”二字，定會加上雙引號以示區(qū)別，請悉知，謝謝！

對“鼠繪”自我的定義是：借助PS軟件，按照1：1圖像比例，相對真實的還原照片/圖片中的商品。（為什么是商品？因為我的分享多數(shù)是針對電商設計，電商就是出來賣（貨）的，不講商品講啥？講互聯(lián)網(wǎng)產品？還是不要扯蛋，會疼）咳……咳咳……先欣賞下我的一組作品：

（純“鼠繪”）

（純“鼠繪”）

（“鼠繪”與商品照片對比）

（“鼠繪”與商品照片對比）

沒有對比哪來傷害？“鼠繪”圖與照片圖你會怎么選？好吧！不要啰里啰嗦了，正式進入主題。

為什么需要“鼠繪”？

1/視覺表現(xiàn)需要——大前提，如果說電商就是一場視覺營銷盛宴，那么“鼠繪”必然會有它存在的意義！

2/極難拍攝的商品——表面光滑容易形成鏡面反射、環(huán)境倒影多、成像光線雜亂、質感差、雜質多且不易清除，容易遺留指紋等等拍攝難度極大的商品，均適合用到“鼠繪”；

3/貴重商品——有實力的商家可以通3D建模、場景渲染等等各種手段實現(xiàn)商品視覺高大上；這里只針對實力欠佳，又想賣高客單價且還想要有良好視覺表現(xiàn)的商家（真是貪心呀?。?；

4/各種活動圖——好看漂亮有質感的圖片，能引起更多買家關注，增進購買欲、增強購買信心；同時也是商品自信的表現(xiàn)，以商品品質足夠好為前提；

5/設計師、美工的自我需求——“鼠繪”其實是非?；A的技巧，于科班專業(yè)人員是底層技巧。但是由于我朝教育問題及這幾年電商設計發(fā)展經歷的蠻荒生長時期，科班/非科班從業(yè)人員良莠不齊，各種不學無術、人心浮躁。會“鼠繪”并能做好“鼠繪”的人很少。具備這種技巧的從業(yè)人員有著天然競爭優(yōu)勢。SO，如果你在看這篇分享時還不會“鼠繪”，那你是不是得學習呀？

-------------------------------------------- 分割線 ----------------------------------------------

哪些商品適合“鼠繪”？

1/外形輪廓簡單——對稱、線性、曲面較少的產品適合“鼠繪”?！笆罄L”繪制比較煩瑣，需要花去設計師大量的時間與精力。復雜的商品結合“鼠繪”修圖，不建議完全純“鼠繪”繪制；

2/某些類目——比如美妝、家電、快消品等。美妝在這方面的運用比例很高；家電以“鼠繪”作為輔助，以修圖為主；

3/產品構圖角度少——還是拿美妝說事，一個角度通殺各種需求：詳情、banner、直通車、鉆展圖……

4/你喜歡啰——“鼠繪”不復雜，只是很煩瑣、單調重復。只要你愿意，想繪啥就繪啥，剩下的僅僅只是時間問題。

-------------------------------------------- 分割線 ----------------------------------------------

“鼠繪”需要掌握哪些知識？

1/素描三大面，五大調。“鼠繪”跟素描是相通的，素描是用筆在紙上畫，“鼠繪”是用軟件在電腦上畫。所以要想表達物體明暗關系，必須恰到好處運用好素描三大面、五大調。

素描三大面即黑（背光部）、白（受光部）、灰（側光部）。如下圖所示：

素描五大調即高光、明部、明暗效果線、暗部（包括反光）、投影。如圖所示：

2/對靜物攝影布光有所了解。靜物攝影布光大概有5種方法，以下作簡單介紹：

一、 正面光(也稱為“順光”)

光源位于被拍靜物正前方，光與攝影方向一致，故稱為順光。

二、主光+輔光

輔光是補充光照射不到被拍靜物其他面的光種，以彌補光照的不足，起輔助作用，增強靜物細節(jié)表現(xiàn)，須配合主光使用，所以又被稱為副光。

三、頂光

頂光，即來自被拍靜物頂部的光線，與景物、照相機成90度左右的垂直角度。

四、側光

側光，即來自被拍靜物左側或右側的光線，同靜物、照相機成60~90度左右的水平角度。

五、逆光

逆光一種是由于被拍靜物主體恰好處于光源和照相機之間的狀況，這種狀況極易造成使被攝主體曝光不充分。相信我們都有試過逆光拍攝的人像，黑黑的看不清。

-------------------------------------------- 分割線 ----------------------------------------------

“鼠繪”運用的布光及光影表現(xiàn)：

“鼠繪”運用的布光方法主要有正面光、主光+輔光。具體的光影表現(xiàn)如下圖所示：

“鼠繪”中也經常會運用到對稱光的表現(xiàn)手法。對稱光僅存在于繪圖中，多用于圓柱形狀物體的表達，真實的攝影布光中是不存在對稱布光的。真實的光是會疊加并增強，二個強光疊加會使拍攝物體曝光過度；二個弱光疊加可能會曝光不足，也可能會光影表現(xiàn)平平。對稱光的光影表現(xiàn)如下圖所示：

“鼠繪”運用材質的各種光影表現(xiàn)特點：

塑料與磨沙材質高光與陰影過渡柔和，金屬材質高光陰影過渡生硬，玻璃材質高光陰影過渡柔和且通透。

平時在日常生活中，多點留意觀察各種材質物品的光影表現(xiàn)，在“鼠繪”中就不會顯得無從下手。以上“鼠繪”知識點均介紹完畢，下面請看濕紙巾案例實操步驟。

-------------------------------------------- 分割線 ----------------------------------------------

步驟一：確定材質及布光方法

濕紙由外包裝材質為塑料膜，塑料在“鼠繪”材質中高光與陰影過渡柔和。從照片拍攝角度看，適合使用正面光布光方法繪制。

（濕紙巾實拍圖）

步驟二：繪制商品基本輪廓

商品結構比較復雜可以拆分成多個部份單獨繪制，繪制過程中各個面用不同色塊加于區(qū)分。

步驟三：吸取照片顏色，為每塊區(qū)域上色

前面三大步驟主要用到矩形工具及鋼筆工具，繪制出商品基本形狀跟摳圖。每個色塊需要獨立并分組管理，這樣做是為了方便后面整個模型的布光。（運用PS軟件時，平時養(yǎng)成分組的習慣，畢竟上了規(guī)模的公司都有好多個設計師一起協(xié)作，方便自己也方便他人）

步驟四：繪制細節(jié)

這部主要用到鋼筆工具、高斯模糊，將細節(jié)摳出且繪制出來。

步驟五：整個模型、細節(jié)搭建完成后開始繪制光影，布光

高光陰影繪制主要是通高斯模糊白色或黑色色塊疊加到模型的每個色塊中，如下動態(tài)圖所示：

用這種方法布光需要疊加多個圖層，調整每個圖層透明度及疊加模式，簡單點說就是盡量讓光表現(xiàn)的真實、有質感一些。

步驟六：貼圖

如果有外包裝設計稿，可以直接將上面的圖文信息貼到模型上。沒有的話還是用“鼠繪”繪制出來。最后要注意：整體搭建完后再次進行整體布光。正面光的特點是由中間向二邊遞減，用畫筆將濕紙巾包裝的二頭壓暗點，中間的高光提亮點。完事后用中性灰進一步加強明暗對比關系，以突顯空間感跟立體感。

抽紙部份同樣利用上述方法步驟繪制。這里將不再復述。以下是整體制作的動態(tài)效果圖：

“鼠繪”分享完畢

-------------------------------------------- 分割線 ----------------------------------------------

結語：其實作一幅好圖沒有想像的這么難，只是你得花時間去磨，過程確實是件很痛苦的事，堅持下去會有意想不到的收獲！一段時間的努力工作與學習，驀然回首時你會看見你的成長與進步，進步是很快樂的事情（我已不止一次強調了，你自己去感受吧）。

最后送上一碗雞湯，與君共勉：“今天不努力爭取過你想要的生活，明天你將疲以應對你不想要的生活。”我先干了，你隨意。哈哈……

附件分享一些PSD源文件。喜歡的就拿去，感謝支持。記得點贊哈~