Photoshop制作筆記本電子商務(wù)網(wǎng)站首頁模板

2022-12-26 13:21:23 來源/作者: / 己有:4人學(xué)習(xí)過


作者:夕木木   出處:夕木木

這個教程,講的不怎么詳細(xì),倒也講出制作網(wǎng)頁的一般步驟.還是一樣我們先來看一下效果圖:

1.在PS中新建一個文檔,768*800px,并填充#1e2528.

2.添加LOGO,在左上角,并給它新建一個圖層.

 

 


3.新建一個圖層.并使用圖層樣式為其添加一個漸變效果.

 


4.使用減淡工具,并設(shè)置10%的不透明度,給圖像加個高光.如圖:

5.現(xiàn)在加入菜單文字.使用文字工具并設(shè)置如圖,顏色#444b44.

 

 


6.在文字下面加入下劃線.也在菜單上面加入一條線,來做區(qū)分用.

7.在頭部加個產(chǎn)品圖像和產(chǎn)品介紹.

8.來看一下如何做按扭.首先用圓角矩形,畫出按扭的形狀.并填充#5a676c.并設(shè)置它的圖層樣式.


 

 

 


9.現(xiàn)在要添加兩條線,一條大小為1px,相距也為1px.別一條大小為2px與第一條相距2px.

10.頁眉做好之后,我們來看看頁面的主體怎么做.利用矩形工具畫出三個相等的矩形并填充白色.為它們各新建三個新圖層.建好之后就可以添加產(chǎn)品了.如圖:

 

11.為產(chǎn)品添加介紹和價格等之類必要的信息.

 

 

 

 

 


12.選擇矩形選框,在左側(cè)畫出一個矩形來做產(chǎn)品菜單,并填充#6b7b81.



13.現(xiàn)在來做一個自定義畫筆,新建一個3*3px,然后用畫筆畫出如圖所示.

最終結(jié)果如圖:

 



14.在下面畫兩個矩形并填充#d1dbdf.并添加圖標(biāo),如圖所示.


15.新建一個圖層來創(chuàng)建頁腳.使用圓角矩形工具,畫一個圓角矩形出來,填充白色,然后利用矩形選區(qū)工具把上面的一部分刪掉.

 

 



添加圖標(biāo):

使用畫筆工具給每個LOGO中畫一條區(qū)分線,顏色為#D2D2D2.

16.最后我們來為網(wǎng)頁裝飾一下,添加一個小圖標(biāo).下面是步驟載圖:

 

 

 

 

 

 



利用橢圓工具畫一個橢圓,然后填充白色并改為不透明30%.并添加文字.

 



17.完成:




標(biāo)簽(TAG) 網(wǎng)頁模板