當(dāng)前位置:首頁>ps實例教程>ps網(wǎng)頁設(shè)計>網(wǎng)頁模板>教程內(nèi)容

ps黑色風(fēng)格網(wǎng)頁模板(3)

來源:思緣論壇 作者:臣子木 學(xué)習(xí):6725人次

第九步:添加一個漂亮的裝飾元素這個區(qū)域的最后一步是添加一個漂亮的裝飾元素以增加網(wǎng)頁整體的感覺,使用下載的Floral筆刷,設(shè)置前景色為#343434,在合適位置畫完之后,將圖層的混合模式改為強(qiáng)光;

Photoshop設(shè)計黑色大氣的網(wǎng)頁模板,PS教程,16xx8.com教程網(wǎng)

第十步:創(chuàng)建幻燈片區(qū)域下面開始幻燈片區(qū)域的制作,選擇圓角矩形工具,設(shè)置半徑為5px,前景色為#FFFFFF,在網(wǎng)頁布局的右側(cè)添加一個合適尺寸的圓角矩形選區(qū)。

Photoshop設(shè)計黑色大氣的網(wǎng)頁模板,PS教程,16xx8.com教程網(wǎng)

改變此圖層的填充為15%,是背景圖案可以透過此圖層顯示出來,然后添加陰影,如圖:

Photoshop設(shè)計黑色大氣的網(wǎng)頁模板,PS教程,16xx8.com教程網(wǎng)

 

第十一步:在幻燈片區(qū)域添加圖片我們需要在此添加一個縮略圖,選擇一個合適的圖片并添加到幻燈片區(qū)域上方。在圖層面板中選擇縮略圖圖層,按住Ctrl點擊此圖層,PS自動選擇縮略圖選區(qū),執(zhí)行選擇-改變-收縮命令,設(shè)置參數(shù)10px,然后執(zhí)行選擇-反選(Ctrl+Shift+I),最后執(zhí)行編輯-清除。

Photoshop設(shè)計黑色大氣的網(wǎng)頁模板,PS教程,16xx8.com教程網(wǎng)

第十二步:添加對于顯示的縮略圖的描述在圖層縮略圖圖中按住Ctrl點擊縮略圖圖層,激活縮略圖選區(qū),新建圖層并填充顏色為#000000,然后運用矩形選框工具選取新建圖層頂部部分按delete刪除;

Photoshop設(shè)計黑色大氣的網(wǎng)頁模板,PS教程,16xx8.com教程網(wǎng)

改變圖層的不透明度為75%,最后選咋橫排文字工具在此圖層上方添加對圖片的描述文字;

Photoshop設(shè)計黑色大氣的網(wǎng)頁模板,PS教程,16xx8.com教程網(wǎng)

第十三步:在特色區(qū)域的下方添加一個分隔區(qū)域特色區(qū)域的最后一步是在其下方添加一個橫排的分隔區(qū),方法同第二步和第三步,然后給該圖層添加內(nèi)陰影。

Photoshop設(shè)計黑色大氣的網(wǎng)頁模板,PS教程,16xx8.com教程網(wǎng)

Photoshop設(shè)計黑色大氣的網(wǎng)頁模板,PS教程,16xx8.com教程網(wǎng)

第十四步:給網(wǎng)頁主體區(qū)域添加背景顏色你可能已經(jīng)猜到了,主體區(qū)域是如圖那樣設(shè)計為三列,選擇矩形選框工具在下方空白區(qū)域新建一個合適尺寸的矩形選區(qū),填充顏色為#FBF5EA.

Photoshop設(shè)計黑色大氣的網(wǎng)頁模板,PS教程,16xx8.com教程網(wǎng)

第十五步:添加列標(biāo)題對于列的標(biāo)題,我們需要從素材中選擇可以代表列內(nèi)容的標(biāo)識符,并放在左列中。設(shè)置字體為Georgia,字體顏色為#323232,下一步使用鋼筆工具在列標(biāo)題下方添加一個邊界,樣式如圖所示:

Photoshop設(shè)計黑色大氣的網(wǎng)頁模板,PS教程,16xx8.com教程網(wǎng)

設(shè)置前景顏色為#323232,然后選擇一個合適的筆刷并設(shè)置直徑為3px,新建圖層,利用筆刷描邊路徑。設(shè)置圖層樣式如下:

Photoshop設(shè)計黑色大氣的網(wǎng)頁模板,PS教程,16xx8.com教程網(wǎng)

Photoshop設(shè)計黑色大氣的網(wǎng)頁模板,PS教程,16xx8.com教程網(wǎng)

Photoshop設(shè)計黑色大氣的網(wǎng)頁模板,PS教程,16xx8.com教程網(wǎng)

復(fù)制此圖層并向下移動圖層4px或5px,設(shè)置不透明度為24%左右。

Photoshop設(shè)計黑色大氣的網(wǎng)頁模板,PS教程,16xx8.com教程網(wǎng)

第十六步:在左列中添加內(nèi)容標(biāo)題文字設(shè)置為#323232,主體文字顏色設(shè)置為#2A2A2A。(其它顏色也可以)。使用同步驟8一樣的方法添加”Read More”按鈕。中間行文字顏色設(shè)置為#484848。

Photoshop設(shè)計黑色大氣的網(wǎng)頁模板,PS教程,16xx8.com教程網(wǎng)

學(xué)習(xí) · 提示

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

關(guān)注大神微博加入>>

網(wǎng)友求助,請回答!