下載吧 - 綠色安全的游戲和軟件下載中心

          軟件下載吧

          當前位置:軟件下載吧 > 圖形圖象 > PHOTOSHOP > UI教程,設計電視機主題UI圖標

          UI教程,設計電視機主題UI圖標

          時間:2024-03-07 22:30作者:下載吧人氣:29

          運用圖層樣式設計出來的圖標,效果挺好看的,提供了PSD文件,適合新手學習,喜歡的可以練習一下。做完交作業。

          這里再次強調一點,圖層樣式中的參數設置是對應其相應圖層的,受圖層大小尺寸影響,在不同尺寸下,效果呈現是不同的。

          比如說,同樣一個5像素的描邊的圖層樣式,在10像素的圓和100像素的圓下,其表現效果肯定是不一樣的。

          所以,四個字:活學活用。

          源文件鏈接:http://pan.baidu.com/s/1qW06AGs 密碼:kfbm

          首先,我們看看原圖,一個400*300的小圖。

          UI教程,設計電視機主題UI圖標

          新建一個1000*800的文檔,添加一個漸變調整層,做一個#b4b097到#4e473a的90度的徑向漸變,設置縮放為150%,勾選仿色,防止出現色塊。

          UI教程,設計電視機主題UI圖標

          我想大家一定很好奇,我的截圖徑向漸變中的淺色為何不居中,而是位于中部居上,看我們的GIF演示。

          在漸變填充的狀態下,我們把鼠標指針放置到屏幕上,出現那個移動工具的圖標時,我們拖動,漸變的位置也跟著動,這一個操作方法,在圖層樣式中一樣可用。

          UI教程,設計電視機主題UI圖標

          使用圓角矩形工具畫一個600*600像素的圓角矩形,設置圓角為140像素,設置水平居中,垂直居中。

          UI教程,設計電視機主題UI圖標

          我將這個圓角矩形命名為“主體”,并為其添加了一個圖層樣式。

          UI教程,設計電視機主題UI圖標

          UI教程,設計電視機主題UI圖標

          UI教程,設計電視機主題UI圖標

          UI教程,設計電視機主題UI圖標

          UI教程,設計電視機主題UI圖標

          復制一層“主體”圖層,更改圖層名為“投影”,將“投影”圖層置于“主體”圖層下層,將圖層填充設置為0,再添加一個圖層樣式,我們來增強一下投影效果。

          UI教程,設計電視機主題UI圖標

          UI教程,設計電視機主題UI圖標

          原圖畫的是一個類似橢圓的形狀,我這里偷懶一下,還是畫的圓角矩形,大小為500X360像素,圓角半徑為130像素,添加一個圖層樣式。

          UI教程,設計電視機主題UI圖標

          UI教程,設計電視機主題UI圖標

          UI教程,設計電視機主題UI圖標

          下面,我們創建屏幕,設置前景色為#b4b097,使用圓角矩形工具,畫一個大小為420*280像素,圓角半徑為100像素的圓角矩形。

          UI教程,設計電視機主題UI圖標

          為這個“屏幕”圖層添加一個圖層樣式。

          UI教程,設計電視機主題UI圖標

          UI教程,設計電視機主題UI圖標

          UI教程,設計電視機主題UI圖標

          UI教程,設計電視機主題UI圖標

          UI教程,設計電視機主題UI圖標

          復制一層“屏幕”圖層,轉智能對象,添加一個雜色,并將圖層混合模式更改為“柔光”。

          UI教程,設計電視機主題UI圖標

          用兩個屏幕的那個圓角矩形相減,得到我們需要的屏幕下部的高光形狀,將這個形狀的顏色設置為#eaead2,在屬性面板中設置一個1像素的羽化,并將圖層混合模式更改為“柔光”,不透明度34%。

          UI教程,設計電視機主題UI圖標

          設置前景色為#eaead2,用屏幕的那個圓角矩形和一個橢圓相交,得到我們需要的屏幕頂部的高光形狀,同樣的將圖層混合模式更改為“柔光”,不透明度34%,并添加一個圖層蒙版,適當的擦拭左右兩側。

          UI教程,設計電視機主題UI圖標

          下面,我們來制作按紐,設置前景色為#b4b097,畫一個正圓,并添加一個圖層樣式。

          UI教程,設計電視機主題UI圖標

          UI教程,設計電視機主題UI圖標

          設置前景色為#d9d0ca,畫一個小一點的圓,并添加一個圖層樣式。

          UI教程,設計電視機主題UI圖標

          UI教程,設計電視機主題UI圖標

          UI教程,設計電視機主題UI圖標

          UI教程,設計電視機主題UI圖標

          復制一層“按紐”圖層,更改圖層名為“投影”,將圖層填充設置為0,再添加一個圖層樣式,我們來增強下投影效果。

          UI教程,設計電視機主題UI圖標

          UI教程,設計電視機主題UI圖標

          選擇住按紐的這三個圖層,CTRL+G,創建圖層組,命名為“按紐1”,復制圖層組,得到四個按紐,最右側的一個按紐,我將顏色更改了,這里不再給參數了,如果你不懂得如何改,那么你看教程就是只是單純的看,并沒有真正的理解。真不會的話,下載我們的PSD看看。

          UI教程,設計電視機主題UI圖標

          最后我添加了我們P大點S的LOGO和圖標,設置了一個內陰影和投影,這個圖層樣式太經常用到了,我們的教程里太經常看到了,這里就不說了。

          UI教程,設計電視機主題UI圖標

          我們的最終效果:

          UI教程,設計電視機主題UI圖標

          標簽P大點S,UI教程,ps網頁設計,UI圖標,電視機

          相關下載

          查看所有評論+

          網友評論

          網友
          您的評論需要經過審核才能顯示

          公眾號

          主站蜘蛛池模板: 国产福利电影一区二区三区久久老子无码午夜伦不 | 在线观看免费视频一区| 国精产品一区一区三区有限公司| 波多野结衣一区视频在线| AA区一区二区三无码精片| 色久综合网精品一区二区| 中文字幕av日韩精品一区二区| 蜜桃传媒一区二区亚洲AV| 国内自拍视频一区二区三区 | 国产一区二区不卡在线播放| 国产SUV精品一区二区88L | 国产免费av一区二区三区| 99偷拍视频精品一区二区| 免费看无码自慰一区二区| 精品91一区二区三区| 亚洲成人一区二区| 日本高清成本人视频一区| 国模少妇一区二区三区| 中文字幕一区一区三区| 成人免费一区二区无码视频| 国产一区内射最近更新| 国内国外日产一区二区| 无码乱人伦一区二区亚洲| 国产午夜精品一区二区三区极品 | 亚洲一区二区三区偷拍女厕| 午夜福利一区二区三区在线观看 | 亚洲av区一区二区三| 国产自产V一区二区三区C| 亚洲宅男精品一区在线观看| 日韩精品一区二区三区中文3d | 一区二区三区视频在线| 久久伊人精品一区二区三区| 精品日韩一区二区| 亚洲一区二区三区在线观看精品中文 | 无码人妻久久一区二区三区| 奇米精品视频一区二区三区| 人妻无码久久一区二区三区免费| 亚洲熟妇无码一区二区三区| 一区二区三区免费精品视频 | 国产熟女一区二区三区四区五区 | 国产SUV精品一区二区88|