利用Photoshop制作風格化電子商務(wù)網(wǎng)站

2022-12-26 14:02:55 來源/作者: / 己有:8人學習過
利用Photoshop制作風格化電子商務(wù)網(wǎng)站

創(chuàng)建畫布,背景為白色,根據(jù)需要設(shè)定畫布大小,這里以 760 x 770 像素為例。

選擇圓角矩形工具,圓角大小為3個像素,繪制矩形,完成網(wǎng)站整體布局的架構(gòu)。

為這些矩形添加圖層樣式。

圖層 >> 圖層樣式 >> 投影:

漸變疊加:

漸變條設(shè)置如下:

描邊:

我們將得到如下效果:


現(xiàn)在,我們來為這些矩形添加一些細節(jié)。

首先,按住 CTRL 鍵,并點擊圖層。

得到相應(yīng)矩形選區(qū)。

創(chuàng)建新圖層,選擇橢圓選框工具,并將頂部狀態(tài)欄設(shè)置為“交叉選區(qū)”。

在如下位置繪制一個圓。

這是你將得到如下選區(qū)。

選擇油漆桶工具,用白色填充選區(qū)。

圖層 >> 圖層樣式 >> 投影。

描邊,這里我們將描邊大小設(shè)為5像素,位置“內(nèi)部”。

描邊類型設(shè)為“漸變”,漸變條設(shè)置如下:

這時我們得到如下效果:

選擇 >> 修改 >> 收縮,收縮量為5像素(同描邊大小相同)。

創(chuàng)建新的圖層并用白色填充選區(qū),圖層 >> 圖層樣式 >> 投影:

內(nèi)陰影:

斜面和浮雕:

顏色疊加:

描邊:

效果如下:

復制圖層,通過改變顏色疊加和描邊設(shè)置,得到如下效果:

添加導航按鈕和導航文字。

將事先準備好的LOGO和素材圖片添加到適當位置。

最終效果如下,本教程只是起到一個拋磚引玉的左右,希望大家都能做出具有各自風格的網(wǎng)頁。