Photoshop制作簡潔干凈的網頁效果圖
- 2022-12-24 22:35:27
- 來源/作者:互聯網/佚名
- 己被圍觀次
在這篇教程中,我將教給你如何在photoshop中制作一個簡潔干凈的網頁效果圖。原始效果是由 ThemeForest的kuntiz 設計的。我很感謝他允許我發布這篇教程。這是這篇教程的第一部分。 一些需要的素材: 葉子素材 像素化藍色矩形 Step 1: 新建文檔 在photoshop中,按住(Ctrl+N

創建一個新群組,命名為”left arrow”。用橢圓工具l (U),創建一個圓形,填充顏色#406f94。雙擊圖層打開圖層樣式面板,按照上圖設置。
Step 32: 在藍色圓圈中創建一個箭頭

新建圖層,用用戶自定義圖形,創建白色箭頭。雙擊打開圖層樣式面板,按照上圖進行設置。設置圖層透明度為50%。
Step 33: 在右邊創建另一個箭頭。

重復以上步驟,在矩形的右邊創建對稱的圓圈和箭頭。
Step 34: 創建特色圖片

新建群組。命名為 “image” 。在這個群組中放置一個小的圖片,命名這個圖層為”image” 。雙擊打開圖層樣式面板。按照上圖設置。
Step 35: 給你的圖片添加陰影

點開圖層>圖層樣式>新建圖層,在原始圖層上面新建了一個圖層。打開圖層>圖層夢般>顯示全部,設置漸變,畫一個黑色到透明的漸變,從小圖片的底部到中間的位置。給這個圖層命名為 “shadow”。
Step 36: 添加文字

新建群組。用文字工具添加一些文字,命名這個群組為 “text”。
Step 37: 創建白色矩形

新建群組,命名為 “content”,在其中再新建一個群組,命名為 “shadows” 。用矩形工具,新建一個矩形,填充白色,向上圖一樣。命名這個圖層為”white shape” ,設置圖層透明度為90%。
Step 38: 添加頂部陰影

按住Ctrl單擊圖層面板上圖層”white shape”的小縮略圖,創建選取。創建一個新圖層,用漸變工具,畫一個從 #8f8f8f 到透明的漸變,參照上圖。設置該圖層透明度為 50% ,命名這個圖層為”top shadow” 。然后用移動工具,向下移動2個像素。
Step 39:創建橫向的陰影

新建圖層,,用矩形工具,創建一個選區,如上圖。用漸變工具畫一個從 #8f8f8f 到透明的漸變。給這個圖層創建蒙版,用一個直徑較大的軟筆刷,創建陰影。設置該圖層透明度為 30% ,命名該圖層為 “vertical shadow 1″ 。復制這個圖層 (Ctrl+J),命名這個新圖層為 “vertical shadow 2″ ,并且把它移動到右邊。
Step 40: 創建橫向線條

用直線工具 (U)創建一個橫向線條,如上圖,高為1px,顏色#aebcc7。命名為 “line”。
Step 41: 添加文字

選擇文字工具,添加一些文字。你也可以添加一些圖片。
Step 42: 給底部創建漸變

新建群組,命名為 “footer”。在里面新建一個圖層,用選區工具(M) 創建一個選區,如上圖。設置前景色為#555555,用一個直徑比較大的軟筆刷,在選取頂部的位置涂抹。設置該圖層透明度為 50% ,命名該圖層為”gradient”。
Step 43: 在底部,添加一個1個像素高的線條

新建圖層。按照以前的做法,創建一個1px高的線條,填充顏色黑色,設置圖層透明度為15% ,命名該圖層為 “line”。
Step 44: 給底部區域添加文字

在底部添加一些文字
Final Result

*PSjia.COM 傾力出品,轉載請注明來自PS家園網(m.sz-xdd.com.cn)
標簽(TAG) 網頁模板








