Photoshop設(shè)計(jì)藍(lán)色風(fēng)格的網(wǎng)頁登陸框(3)
本教程主要使用Photoshop設(shè)計(jì)藍(lán)色風(fēng)格的網(wǎng)頁登陸框,整體的設(shè)計(jì)簡潔,主要使用到PS的圓角矩形工具和圖層樣式等工具來完成,下面就讓我們一起來學(xué)習(xí)吧
先看效果圖。
新建文檔1280x1024像素,背景白色,建新層,填充黑色,添加圖層樣式。
效果如下。
建新層,畫一個(gè)白色圓角矩形,添加圖層樣式。
建新層,畫一個(gè)黑色圓角矩形。
添加圖層樣式。
效果如下。
建新層,畫一個(gè)小的白色圓角矩形,輸入一些白色文字,排列位置如下。
建新層,畫一個(gè)白色圓角矩形,位置如下。
添加圖層樣式。
效果如下。
前景色#878787輸入文字,添加圖層樣式。
建新層,調(diào)出上面的圓角矩形選區(qū),填充白色,選擇矩形工具按alt減選底部,添加蒙版,圖層模式改為柔光。
同樣的方法做出Register按鈕,建新層,前景色#636363畫一個(gè)圓角矩形。
添加圖層樣式。
復(fù)制一個(gè),效果如下。
百度搜一個(gè)鎖頭圖標(biāo),導(dǎo)入,底部建新層,用黑色柔角畫筆添加一些陰影。
建新層,畫一個(gè)白色圓角矩形,右擊柵格化圖層,用直線套索做一選區(qū),刪除,圖層模式柔光,不透明度38%。
最終效果如下。
學(xué)習(xí) · 提示
相關(guān)教程
- 陰影效果,教你制作各類陰影教程
- banner教程,設(shè)計(jì)一個(gè)簡單的母親節(jié)Banner教程
- 陰影效果,制作網(wǎng)頁常見的圖片投影效果
- 網(wǎng)頁圖片,設(shè)計(jì)一個(gè)網(wǎng)頁登陸框圖片教程
- 設(shè)計(jì)知識(shí),新手詳情頁制作誤區(qū)
- 界面設(shè)計(jì),設(shè)計(jì)音樂播放器界面圖片
- 圖片教程,教你怎么做圓形圖表
- 圖片設(shè)計(jì),教你設(shè)計(jì)扁平化404錯(cuò)誤頁面圖片
- 圓角教程,教你制作網(wǎng)頁常用的圓角矩形邊角
- 進(jìn)度條,設(shè)計(jì)一個(gè)彩色進(jìn)度條
推薦教程
- Photoshop教程:像素化細(xì)節(jié)設(shè)計(jì)技巧
- 陰影效果,教你制作各類陰影教程
- PS教程:設(shè)計(jì)導(dǎo)航鼠標(biāo)懸停狀態(tài)小效果
- banner教程,用ps制作960*90的廣告圖片
- Photoshop制作網(wǎng)站導(dǎo)航圖
- Photoshop設(shè)計(jì)網(wǎng)站用的藍(lán)色導(dǎo)航圖框
- 界面設(shè)計(jì),設(shè)計(jì)音樂播放器界面圖片
- Photoshop精細(xì)制作Vista風(fēng)格網(wǎng)站導(dǎo)航條
- 用ps制作豎列導(dǎo)航
- Photoshop制作網(wǎng)頁搜索條