2021-02-16 分類: 網(wǎng)站建設(shè)
非常感謝朋友們長期以來的支持,這期間給大家分享了不少的案例和基礎(chǔ)知識,想必大家更想知道更具有技術(shù)含量的案例,那么我接下來會給大家分享一些關(guān)于網(wǎng)頁設(shè)計方面的知識內(nèi)容,希望大家能夠喜歡,本期我們主要使用Photoshop設(shè)計立體風格的圖片上傳對話框,各種各樣的對話框,對于我們來說,太常見了。發(fā)微博和在網(wǎng)站上上傳圖片,我們都會遇到圖片上傳的對話框。今天,參考了網(wǎng)上的一個圖片,我們制作了一個超級簡單的圖片上傳對話框。先看看效果圖
首先,這里做了一個簡單的背景,相信這么簡單的背景大家都很熟悉了。
畫一個圓角矩形框框,添加圖層樣式。(框框的顏色無所謂,等會我們并不會用到)
添加一個紋理素材,創(chuàng)建剪貼蒙版。
顏色不大好,我們創(chuàng)建了一個色相/飽和度調(diào)整層,一樣的剪貼蒙版。
以剪貼蒙版形式,創(chuàng)建一個曲線調(diào)整層,參數(shù)如下:
添加文本和右側(cè)的關(guān)閉按紐,我用的是白色,關(guān)閉按紐沒什么難度吧,兩個矩形來構(gòu)成。
用直線工具,畫一條直線,顏色我設(shè)置的是#121415,添加一個投影樣式。添加文本和圖像,圖像我有做了一個近背景色的1像素描邊。
接下來,用圓角矩形工具來畫一個進度條,顏色為#121415,添加一個投影樣式。
接下來做進度的呈現(xiàn),這個不用多說吧,復(fù)制一層剛才的進度條,清除掉圖層樣式,用矩形減去一段就OK了,添加一個漸變疊加。
下面,做進度框,一個矩形,加一個三角形,然后跟疊加一個跟剛才進度一樣的漸變。
添加進度的文本75%,然后添加一個投影樣式。
添加右側(cè)的關(guān)閉按紐,以及垃圾桶按紐,簡單的布爾運算就可以搞定了。
在右下側(cè)畫一個圓角矩形,添加圖層樣式。
添加加號圖標按紐和文本,添加一個投影樣式。
添加右側(cè)的取消上傳按紐,跟前面一步是一樣的,改變的只是漸變顏色而已。
完成最終效果
網(wǎng)站欄目:網(wǎng)頁設(shè)計中如何用photoshop設(shè)計立體風格的教程
URL地址:http://jinyejixie.com/news23/101273.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供App開發(fā)、網(wǎng)站策劃、外貿(mào)網(wǎng)站建設(shè)、營銷型網(wǎng)站建設(shè)、品牌網(wǎng)站制作、Google
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時需注明來源: 創(chuàng)新互聯(lián)
猜你還喜歡下面的內(nèi)容