淺談Photoshop在農寶網美工設計中的應用

陸勛

摘 要：2015年12月16日至18日，在浙江烏鎮召開的以“互聯互通、共享共治——構建網絡空間命運共同體”為主題的第二屆互聯網大會上，釋放了重要信號：跨境壹號助力跨境電子商務應對噴井發展。農寶網，是江蘇南通如皋開發的一個全國性農產品電子商務平臺，實現農產品可以上網發布銷售、買賣交易、購買支付的全新平臺。作者作為此平臺的美工設計者，親歷了此平臺的制作，目前就設計與制作中的一些體會與感受做一些簡單的介紹，希望能與業內從事電商平臺開發的同行們進行交流。

關鍵詞：Photoshop；農寶網；美工設計

1 LOGO的制作

LOGO圖標是一個網站的形象標志。在當今品牌時代，一個優秀的LOGO圖標，不但能點綴界面，而且還可以加深客戶對該網站的印象，提高網站的知名度。Photoshop提供了矢量圖繪制功能。在農寶網美工設計中，涉及到的LOGO制作主要是店鋪標志。

位于農寶網店鋪右上角（如圖1所示）。

制作此LOGO時，首先，本人搜集一些比較有創意的店鋪標志；然后用鉛筆繪制草圖（如圖2所示）；最后在PS軟件中設定圖像尺寸為100像素×100像素，圖像模式為RGB模式，圖像分辨率為72像素/英寸，使用PS矢量圖形的制作工具，如鋼筆工具，制作的LOGO輪廓，并填充了R=255，G=0，B=0的紅顏色。最后在混合選項里設置相關參數，得到如圖1所示的完成效果。

2 圖片的選擇、調整與剪切

在農寶網平臺店鋪裝修時，獲取農產品圖片的方法可以通過攝影或者網絡素材庫獲得。在選擇農產品圖片時，詳細挑選，如在挑選草莓圖片時，一般地，包括種植圖，開花圖，結果圖，成熟圖，包裝圖等。在制作店鋪條幅、產品主圖、產品詳情頁、產品幻燈片等圖片時，所挑選的圖片就可以在其中體現。

以制作店鋪條幅作詳細說明：店鋪條幅，即店鋪招牌，它是店鋪里第一眼被人看到的，位于農寶網店鋪最上方，就如同實體店鋪的招牌，店鋪條幅制作在網頁設計中占據著重要的地位。

（1）素材準備。在制作店鋪條幅之前，首先要搜集產品素材，可以是通過村官拍攝獲得的產品圖片，也可以是網上素材庫里的圖片（包括JPEG、PSD文件等）。

（2）啟動Photoshop軟件，新建文件，設置相關參數，參數設置如圖3所示。

（3）參數設置完成后，生成一個尺寸為1000像素×250像素的頁面，制作者可以在頁面上根據自己的設計思維進行制作。

在網絡素材庫里獲得的圖片文件，其圖像模式有時不是RGB模式，圖像分辨率也不是72像素/英寸，這就需要對圖片進行調整。假設，在網絡素材庫里下載一張草莓圖片，圖像模式為CMYK模式，圖像分辨率為300像素/英寸，調整方法如下：將下載的草莓圖片在Photoshop軟件里打開，把背景圖層復制一層，在圖像菜單下的模式里將CMYK顏色改為Lab顏色，再將Lab顏色改為RGB顏色；在圖像菜單下，選擇圖像大小，勾選縮放樣式、約束比例、重定圖像像素，將分辨率改為72像素/英寸，像素大小還設置為原來大小。

把產品詳情頁傳到網上時，有時會遇到圖片太大，傳不上去的情況。此時，要對大塊圖片進行切片，提高網頁下載速度。使用Photoshop的切片工具切片后，存儲時用“存儲為Web和設備所用格式”命令，切片存儲格式要求一般存為Gif或PNG格式。質量要求高的圖片需要存儲為JPEG格式，JPG格式可以顯示更多的圖片細節。產品詳情頁切片步驟如下：（1）在Photoshop軟件里打開核桃內頁

（假設尺寸為750像素×6120像素）；（2）選擇工具箱中的移動工具，

顯示界面中的標尺，用移動工具拉出參考線，將產品詳情頁劃分成均勻小片；（3）劃分完成后，選擇工具箱中的切片工具，點擊界面中的基于參考線的切片；（4）選擇文件菜單下的“存儲為Web和設備所用格式（D）”命令，設置相關參數，點擊存儲，完成產品詳情頁的切片。

3 網店主題色彩的搭配

一般來講，一個網頁上只采用一個色系，通過調節色系中顏色的深淺來達到整體的網頁風格。但是，如果把平面設計中的整體設計思想搬到網站設計上來，可以達到很好的平面設計效果。如純色的色塊結合淡色線條的設計：用色塊對網頁進行間隔，用線條把網頁中的相關內容連接起來可以增強網頁的層次感，顏色的合理搭配，網頁就令人賞心悅目了。

4 店商PS制作的特點

4.1 圖像模式不同

圖像模式指圖像所在的工作顏色空間。在制作產品圖片時，圖像模式設置為RGB模式，而不是CMYK模式。所有的網絡圖像在開始時都在RGB模式中被開發出來，RGB圖像適合于在計算機顯示器上觀看，計算機在顯示器上的再現顏色是通過紅、綠、藍光來實現的。RGB顏色空間是用色光三原色來描述物體顏色特征的。在圖像處理軟件的色彩管理系統中，RGB顏色模式是數字照相機、掃描儀、顯示器所使用的顏色系統，是一個與設備相關的顏色空間。也就是說，它們產生的顏色是與具體使用的設備有關的，不同設備可能使用不同的RGB三原色，混合出的效果也不會完全相同。

在RGB模式下工作，具有節省內存，提高性能的優點；此外，在RGB模式中具有更大的設備獨立性，因為RGB色彩空間并不依賴于顯示器或油墨。不管使用的是顯示器、計算機，還是輸出設備，對圖像進行的校正都被保留。

圖像的編輯往往要經過許多細微的過程，比如可能要將幾幅圖像中的內容拼合在一起，并且由于各組成部分的原色調不可能一樣，需要對它們進行調整，也可能要使各部分以某種方式合成，并進行過濾器處理等。

用Photoshop軟件進行圖片制作時，使用RGB色彩模式作為其圖像處理的首選模式，其圖像擁有更多調整工具與操作指令，從而更便于彩色圖像的處理與編輯。而與之相對，采用CMYK色彩模式的圖像則有許多調整功能不能實現。因此，RGB色彩模式更有利于圖像的調整與處理。

4.2 圖像分辨率不同

圖像分辨率指單位長度內包含的像素數，將決定存儲為圖像文件時的數據量，常以每英寸像素數ppi表示。像素是可在屏幕顯示的最小元素，像素與屏幕無關。在美工設計中，圖像分辨率以ppi來度量，它和圖像的寬、高尺寸一起決定了圖像文件的大小及圖像質量。

在農寶網店鋪裝修時，所制作的圖像用于屏幕上顯示，顯示屏無論多大，都是以分辨率為前提的，其分辨率只需滿足典型的顯示器分辨率（72ppi或96ppi）即可。圖像分辨率設置的越高，圖像文件越大，顯示速度就會越慢。與印前制作的圖像則不同，印前制作一般設置為300像素/英寸。

ppi值作為對顯示器像素密度的表示單位，在圖像處理軟件中普遍采用72ppi作為默認值，因為1pt=1/72inch，這是點（Point）這個單位的定義，在邏輯上用一個點對應一個像素，是最自然不過的事情了。

5 結束語

文章主要結合現實電商平臺，講述了Adobe Photoshop軟件在網頁設計制作中的應用。主要講述了軟件的部分功能，主題色彩的搭配，以及軟件制作特點。作者作此文，主要想和印刷行業印前制作人員以及電子商務行業美工設計人員交流心得體會，以達到共同學習的目的。歡迎讀者提出意見和建議。

參考文獻

[1]丁瑜.Photoshop在網頁美工設計中的應用研究[J].管理視窗 商業文化，2015，8.

[2]周穎梅，姜中敏.平面設計在網頁中的應用[J].福建電腦，2006，4.