非常感謝朋友們長期以來的支持，這期間給大家分享了不少的案例和基礎知識，想必大家更想知道更具有技術含量的案例，那么我接下來會給大家分享一些關于網(wǎng)頁設計方面的知識內(nèi)容，希望大家能夠喜歡，本期我們主要使用Photoshop設計立體風格的圖片上傳對話框，各種各樣的對話框，對于我們來說，太常見了。發(fā)微博和在網(wǎng)站上上傳圖片，我們都會遇到圖片上傳的對話框。今天，參考了網(wǎng)上的一個圖片，我們制作了一個超級簡單的圖片上傳對話框。先看看效果圖

首先，這里做了一個簡單的背景，相信這么簡單的背景大家都很熟悉了。

畫一個圓角矩形框框，添加圖層樣式。(框框的顏色無所謂，等會我們并不會用到)

添加一個紋理素材，創(chuàng)建剪貼蒙版。

顏色不大好，我們創(chuàng)建了一個色相/飽和度調(diào)整層，一樣的剪貼蒙版。

以剪貼蒙版形式，創(chuàng)建一個曲線調(diào)整層，參數(shù)如下：

添加文本和右側的關閉按紐，我用的是白色，關閉按紐沒什么難度吧，兩個矩形來構成。

用直線工具，畫一條直線，顏色我設置的是#121415，添加一個投影樣式。添加文本和圖像，圖像我有做了一個近背景色的1像素描邊。

接下來，用圓角矩形工具來畫一個進度條，顏色為#121415，添加一個投影樣式。

接下來做進度的呈現(xiàn)，這個不用多說吧，復制一層剛才的進度條，清除掉圖層樣式，用矩形減去一段就OK了，添加一個漸變疊加。

下面，做進度框，一個矩形，加一個三角形，然后跟疊加一個跟剛才進度一樣的漸變。

添加進度的文本75%，然后添加一個投影樣式。

添加右側的關閉按紐，以及垃圾桶按紐，簡單的布爾運算就可以搞定了。

在右下側畫一個圓角矩形，添加圖層樣式。

添加加號圖標按紐和文本，添加一個投影樣式。

添加右側的取消上傳按紐，跟前面一步是一樣的，改變的只是漸變顏色而已。

完成最終效果

分享標題：網(wǎng)頁設計中如何用photoshop設計立體風格的教程
轉(zhuǎn)載源于：http://www.rwnh.cn/news/101273.html

成都網(wǎng)站建設公司_創(chuàng)新互聯(lián)，為您提供網(wǎng)頁設計公司、網(wǎng)站設計、電子商務、品牌網(wǎng)站建設、標簽優(yōu)化、動態(tài)網(wǎng)站

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源： 創(chuàng)新互聯(lián)