當前位置:首頁>ps實例教程>ps網頁設計>網頁模板>教程內容

Photoshop設計電影商店網站模板(6)

來源:作者:佚名 來源:網頁教學網 作者:admin 學習:766人次

本文電影DVD商店網站界面設計翻譯自國外教程,整體設計風格簡潔直白,有主有次,主要使用到PS筆刷來制作網站界面的變化效果,使得電影DVD商店網站整體上不單調,設計制作過程如下:

先在PS里新建760x770大小文件,白色背景

下載筆刷: line and circle decoration brushes.

使用PS里的畫筆筆刷工具:

Photoshop制作DVD電影商店網站模板 1

接下來使用將之前安裝的筆刷。

webjx.com

在新建的圖層上用筆刷繪制背景圖形,顏色為 #f3f3f3。

Photoshop制作DVD電影商店網站模板 3

導入電影影片圖片素材。

Photoshop制作DVD電影商店網站模板 4


再下載一個筆刷 Grunge border brushes.

安裝筆刷后選擇如下圖筆刷圖形。

Photoshop制作DVD電影商店網站模板 5

使用筆刷修飾網頁:

Photoshop制作DVD電影商店網站模板 6

使用橢圓橡皮擦工具:

Photoshop制作DVD電影商店網站模板 7

對網頁圖形進行涂抹修飾。

Photoshop制作DVD電影商店網站模板 8

將涂抹后的圖層進行復制,旋轉180度,完成后如下圖

Photoshop制作DVD電影商店網站模板 9


使用圓角矩形工具:

Photoshop制作DVD電影商店網站模板 10

使用顏色#e3f7fe 制作簡單的圓形,如下圖:

Photoshop制作DVD電影商店網站模板 11

繼續(xù)制作圖形,顏色為 #91bcdc

Photoshop制作DVD電影商店網站模板 12

制作矩形,顏色為#90a6bd:

Photoshop制作DVD電影商店網站模板 13


使用鋼筆工具為矩形制作折角:

Photoshop制作DVD電影商店網站模板 14

復制矩形圖層:

Photoshop制作DVD電影商店網站模板 15

制作顏色為#004995的圓形,用來制作折角背景

Photoshop制作DVD電影商店網站模板 16

在圓形圖層上按鼠標右鍵柵格化圖形

Photoshop制作DVD電影商店網站模板 17

I will make a selection.

Photoshop制作DVD電影商店網站模板 18

裁剪這塊圖形

Photoshop制作DVD電影商店網站模板 19

隨后將裁減下的圖形翻轉180度:

Photoshop制作DVD電影商店網站模板 20


并為其添加圖層樣式:

Photoshop制作DVD電影商店網站模板 21

自由變形調整其位置與之前的圓形組合成如下折角圓形樣子:

Photoshop制作DVD電影商店網站模板 22

使用文字工具

Photoshop制作DVD電影商店網站模板 23

為電影網站添加文字:

Photoshop制作DVD電影商店網站模板 24

最后加入影片圖片,整體電影網站設計完成,效果圖如下:



學習 · 提示

  • 一定要打開PS,跟著教程做一遍,做完的圖到這交作業(yè):提交作業(yè)
  • 建議練習時,大家自己找素材,盡量不要用教程提供的素材。
  • 教程有看不懂的地方,可以到論壇發(fā)帖提問:新手求助
  • 加官方微信,隨時隨地,想學就能學:ps_bbs,或掃右側二維碼!
  • 關注我們學更多,每天都有新教程:新浪微博 抖音視頻 微信小程序
- 發(fā)評論 | 交作業(yè) -
最新評論
暫無評論,交個作業(yè)支持一下吧~

關注大神微博加入>>

網友求助,請回答!