ps創(chuàng)建常見的網(wǎng)頁風(fēng)格教程系列一

2022-12-26 11:37:18 來源/作者: / 己有:25人學(xué)習(xí)過

網(wǎng)頁效果圖教程

點(diǎn)擊圖層>圖層蒙版>隱藏所有(保證你選擇的圖層是圖片圖層)。

網(wǎng)頁效果圖教程

選擇漸變工具,確定是默認(rèn)顏色設(shè)置(前景白色,背景黑色),按照下圖的標(biāo)記拖拽你的漸變。

網(wǎng)頁效果圖教程

我的效果:

網(wǎng)頁效果圖教程

好了,添加一些陰影。我用的是橢圓工具,在頭部下面創(chuàng)建一個細(xì)長的形狀。

網(wǎng)頁效果圖教程

保持這個形狀被選定,我把這個圖層命名為陰影。點(diǎn)擊濾鏡>模糊>高斯模糊。

網(wǎng)頁效果圖教程

5.5半徑

網(wǎng)頁效果圖教程

好了,我們頭部基本上也完成了。

網(wǎng)頁效果圖教程

Step 4 – 創(chuàng)建主要內(nèi)容部分

按照下圖,添加一些文字。采用的是三欄布局。

網(wǎng)頁效果圖教程

選擇矩形工具,創(chuàng)建一個形狀。這就是我們的主要內(nèi)容區(qū)域。我的尺寸是935px X 504px。

網(wǎng)頁效果圖教程

設(shè)置圖層樣式如下:

網(wǎng)頁效果圖教程

網(wǎng)頁效果圖教程

我的效果

網(wǎng)頁效果圖教程

然后在上面和下面添加一些陰影,用橢圓工具和高斯模糊就可以完成了。添加一些分割線。

現(xiàn)在的效果:

網(wǎng)頁效果圖教程

好了,添加更多的矢量圖標(biāo)和文字。這是現(xiàn)在的效果。

網(wǎng)頁效果圖教程

好了,主要內(nèi)容部分也完成了

Step 5 – 創(chuàng)建底部內(nèi)容

底部內(nèi)容就很容易完成了。放上logo和一些文字就可以了。

最終的效果圖
image