日韩小视频-日韩久久一区二区三区-日韩久久一级毛片-日韩久久久精品中文字幕-国产精品亚洲精品影院-国产精品亚洲欧美云霸高清

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

軟件下載吧

當(dāng)前位置:軟件下載吧 > 圖形圖象 > PHOTOSHOP > UI圖標(biāo),模仿擬物風(fēng)格的SIRI圖標(biāo)

UI圖標(biāo),模仿擬物風(fēng)格的SIRI圖標(biāo)

時(shí)間:2024-03-07 21:47作者:下載吧人氣:17

今天跟大家一起來練習(xí)一下怎么設(shè)計(jì)一枚擬物風(fēng)格的UI圖標(biāo),整個教程難度是麥克風(fēng)中的發(fā)光鏤空圖案,教程十分詳細(xì),新手也能跟著一起做出來。做完交作業(yè)。

這是我們的最終效果:

UI圖標(biāo),模仿擬物風(fēng)格的SIRI圖標(biāo)

這個是原圖:

UI圖標(biāo),模仿擬物風(fēng)格的SIRI圖標(biāo)

下面開始我的制作過程。為了后面的工作更加輕松便捷,所以我把新建的畫布尺寸設(shè)成一個比較好計(jì)算的整數(shù)~

UI圖標(biāo),模仿擬物風(fēng)格的SIRI圖標(biāo)

原圖的背景過于簡單,我畫蛇添足,制作一個iOS風(fēng)格的背景。新建一層純黑色填充層。

UI圖標(biāo),模仿擬物風(fēng)格的SIRI圖標(biāo)

新建一層,填充白色。執(zhí)行“濾鏡-雜色-添加雜色”,參數(shù)如圖~

UI圖標(biāo),模仿擬物風(fēng)格的SIRI圖標(biāo)

“濾鏡-模糊-動感模糊”

UI圖標(biāo),模仿擬物風(fēng)格的SIRI圖標(biāo)

把這個動感模糊層的透明度調(diào)到45%。

UI圖標(biāo),模仿擬物風(fēng)格的SIRI圖標(biāo)

復(fù)制一層,CTRL+T自由變化旋轉(zhuǎn)90度,把透明度調(diào)回100%,圖層混合模式改為“疊加”。

UI圖標(biāo),模仿擬物風(fēng)格的SIRI圖標(biāo)

畫布四周的“毛邊”看著很不和諧,選中這兩個動感模糊層,CTRL+T自由變化,放大一些,直至毛邊不見為止,背景完成。

UI圖標(biāo),模仿擬物風(fēng)格的SIRI圖標(biāo)

ctrl+r開啟標(biāo)尺,在標(biāo)尺上右鍵選擇百分比。按ALT+V+E快速布置水平和垂直兩條處于中心位置的參考線。

UI圖標(biāo),模仿擬物風(fēng)格的SIRI圖標(biāo)

為了圖層欄的簡潔以及照顧到以后臨摹方便起見,我把屬于背景的三個圖層打包成組且隱藏。選擇“編輯-首選項(xiàng)-參考線.網(wǎng)格和切片”,把間隔單位設(shè)為20個像素,子網(wǎng)格設(shè)為2,單純設(shè)為10像素的話覺得密密麻麻的不舒服。

UI圖標(biāo),模仿擬物風(fēng)格的SIRI圖標(biāo)

用“橢圓工具”畫一個直徑為840像素的圓形。為了讓它跟白色的背景區(qū)分開來,我給它設(shè)了一個85%的灰色。

UI圖標(biāo),模仿擬物風(fēng)格的SIRI圖標(biāo)

按ctrl+’隱藏網(wǎng)格。雙擊這個形狀層,添加投影。我稍微調(diào)整了一下“等高線”,讓這個投影是邊緣收縮一些,再加一點(diǎn)點(diǎn)雜色。

UI圖標(biāo),模仿擬物風(fēng)格的SIRI圖標(biāo)

再加一個人見人愛的角度漸變,用它來模擬圓形金屬是最好用了~

UI圖標(biāo),模仿擬物風(fēng)格的SIRI圖標(biāo)

最后是這個金屬圓盤的倒角,斜面浮雕是不二之選~

UI圖標(biāo),模仿擬物風(fēng)格的SIRI圖標(biāo)

我仔細(xì)觀察了原圖,金屬圓盤上似乎有“拉絲”的效果,但不是我們大家習(xí)慣使用的雜色+徑向模糊的那種。而是類似于很細(xì)很密的同心圓。按D恢復(fù)前景色和背景色。新建一層填充白色。選擇濾鏡素描中的半調(diào)圖案。

UI圖標(biāo),模仿擬物風(fēng)格的SIRI圖標(biāo)

然后極坐標(biāo),一個同心圓的拉絲效果出來了。

UI圖標(biāo),模仿擬物風(fēng)格的SIRI圖標(biāo)

如果你對上面的半調(diào)圖案有異議我認(rèn)為很正常,因?yàn)榘胝{(diào)圖案里有“圓形”的選項(xiàng),可以直接制作同心圓。但是直接制作出來的同心圓的線條比較粗,我想要一個線條很細(xì),很精致的同心圓,所以選擇直線選項(xiàng)再用極坐標(biāo)后它的效果比較符合我的要求。最后把這個同心圓的透明度調(diào)到8%左右,隱隱約約能看到就行,繼續(xù)把它剪切蒙版到金屬圓盤?;蛘呓o它一個蒙版也行。

UI圖標(biāo),模仿擬物風(fēng)格的SIRI圖標(biāo)

接著我要用圖形工具制作圖標(biāo)中間的麥克風(fēng),按ctrl+’開啟網(wǎng)格,先用橢圓工具畫一個15%灰色,比“金屬圓盤”小1.5個網(wǎng)格單位的圓形。

UI圖標(biāo),模仿擬物風(fēng)格的SIRI圖標(biāo)

繼續(xù)用“減去”模式再畫一個小1.5間隔單位的圓,這樣我得到一個邊寬為1.5間隔單位的圓環(huán)。

UI圖標(biāo),模仿擬物風(fēng)格的SIRI圖標(biāo)

制作里面的麥克風(fēng)。打開網(wǎng)格,選用圓角矩形工具,把圓角的直徑盡可能的設(shè)得大一些,比如現(xiàn)在我就是500,用“添加”模式以膠囊狀下半圓直徑為中心畫一個的麥克風(fēng)支架。

UI圖標(biāo),模仿擬物風(fēng)格的SIRI圖標(biāo)

繼續(xù)用“減去”模式再畫一個小1.5間隔單位的膠囊,因?yàn)榫W(wǎng)格的“吸附”功能,精確的完成這些都不叫事。

UI圖標(biāo),模仿擬物風(fēng)格的SIRI圖標(biāo)

用鋼筆裁去上半部的膠囊。不要用矩形工具去裁剪,那樣會把外圍的圓環(huán)也破壞掉。

UI圖標(biāo),模仿擬物風(fēng)格的SIRI圖標(biāo)

在裁斷的位置再布置一條參考線作為話筒的中心點(diǎn)。畫一個小1.5網(wǎng)格單位的膠囊作為麥克風(fēng)的話筒。

UI圖標(biāo),模仿擬物風(fēng)格的SIRI圖標(biāo)

還有下面的底座。

UI圖標(biāo),模仿擬物風(fēng)格的SIRI圖標(biāo)

添加“內(nèi)陰影”。

UI圖標(biāo),模仿擬物風(fēng)格的SIRI圖標(biāo)

以及白色的投影~

UI圖標(biāo),模仿擬物風(fēng)格的SIRI圖標(biāo)

用“創(chuàng)建”模式畫一個小于麥克風(fēng)話筒半個單位間隔的膠囊。

UI圖標(biāo),模仿擬物風(fēng)格的SIRI圖標(biāo)

添加圖層樣式中的漸變。

UI圖標(biāo),模仿擬物風(fēng)格的SIRI圖標(biāo)

淺粉色的投影。

UI圖標(biāo),模仿擬物風(fēng)格的SIRI圖標(biāo)

最后斜面浮雕是必須的,不過我選用外斜面。

UI圖標(biāo),模仿擬物風(fēng)格的SIRI圖標(biāo)

畫一個25%灰色大小適中的圓形,ctrl+alt+t移動一段距離后,ctrl+shift+alt+t垂直方向復(fù)制一組。

UI圖標(biāo),模仿擬物風(fēng)格的SIRI圖標(biāo)

橫向錯開一段距離復(fù)制一組。

UI圖標(biāo),模仿擬物風(fēng)格的SIRI圖標(biāo)

繼續(xù)移動復(fù)制。

UI圖標(biāo),模仿擬物風(fēng)格的SIRI圖標(biāo)

不用理會下面的鏤空孔,重新安排一下上面的鏤空孔的位置,多余的可以刪除掉,逐個移動位置不科學(xué)的孔,使它們位置符合話筒的半圓形。

UI圖標(biāo),模仿擬物風(fēng)格的SIRI圖標(biāo)

框選右邊的三排鏤空。把中心點(diǎn)移到垂直參考線上水平復(fù)制。

UI圖標(biāo),模仿擬物風(fēng)格的SIRI圖標(biāo)

雙擊這個圓圈鏤空層,進(jìn)入圖層樣式,把混合模式改為正片疊底,透明度調(diào)到65%左右。把“圖層蒙版隱藏效果”打鉤。

UI圖標(biāo),模仿擬物風(fēng)格的SIRI圖標(biāo)

簡單的斜面浮雕。

UI圖標(biāo),模仿擬物風(fēng)格的SIRI圖標(biāo)

給這個鏤空層添加一個蒙版,讓下半部分漸隱。

UI圖標(biāo),模仿擬物風(fēng)格的SIRI圖標(biāo)

新建一層,按ctrl點(diǎn)擊鏤空層的矢量蒙版獲得選區(qū),用畫筆涂抹上面一小部分。

UI圖標(biāo),模仿擬物風(fēng)格的SIRI圖標(biāo)

取消選區(qū),ctrl+t自由變化,把中心點(diǎn)設(shè)在話筒的中心水平位置,垂直翻轉(zhuǎn)。

UI圖標(biāo),模仿擬物風(fēng)格的SIRI圖標(biāo)

高斯模糊1.0,感覺不夠的話可以稍微增大這個數(shù)值。

UI圖標(biāo),模仿擬物風(fēng)格的SIRI圖標(biāo)

漸漸調(diào)小畫筆的大小和硬度,在鏤空孔的位置點(diǎn)幾下,模擬燈光逐級減弱的效果。

UI圖標(biāo),模仿擬物風(fēng)格的SIRI圖標(biāo)

新建一層,添加矢量蒙版,把下面的麥克風(fēng)話筒的路徑復(fù)制進(jìn)來,再用鋼筆刪去一部分,填充白色,減少透明度。模擬玻璃鏡面反光的效果。如果你覺得矢量蒙版麻煩的話完全可以用圖層蒙版。

UI圖標(biāo),模仿擬物風(fēng)格的SIRI圖標(biāo)

最后一步,新建一層,用硬度為0的400像素大小的畫筆在中心位置點(diǎn)一下,把混合模式改為“濾色”,透明度調(diào)到50。

UI圖標(biāo),模仿擬物風(fēng)格的SIRI圖標(biāo)

完成!

UI圖標(biāo),模仿擬物風(fēng)格的SIRI圖標(biāo)

標(biāo)簽麥克風(fēng),擬物圖標(biāo),P大點(diǎn)S,ps網(wǎng)頁設(shè)計(jì),UI教程,SIRI

相關(guān)下載

查看所有評論+

網(wǎng)友評論

網(wǎng)友
您的評論需要經(jīng)過審核才能顯示

熱門閱覽

最新排行

公眾號

主站蜘蛛池模板: 国产成视频 | 午夜黄色毛片 | 国产欧美日韩在线人成aaaa | a级成人高清毛片 | 国产精品特级毛片一区二区三区 | 2021国产精品系列一区二区 | 国产成人高清一区二区私人 | 日本免费一区尤物 | 精品手机在线 | 国产精品亚洲欧美日韩一区在线 | 亚洲精品久久一区二区无卡 | 伊人精品视频 | 在线观看免费亚洲 | 伊人22综合 | 国产欧美日韩精品一区二 | 日韩美香港a一级毛片 | 国产精品亚洲欧美日韩久久 | 国产深夜福利 | 国产日产亚洲精品 | 欧美在线1 | 日本午夜vr影院新入口 | 另类一区二区三区 | 在线观看不卡一区 | 一 级 黄 色 片生活片 | 成人午夜在线播放 | 免费看成人毛片 | 久久精品国内偷自一区 | 性欧美高清极品xx | 国产成人精品一区二区视频 | 怡红院亚洲红怡院天堂麻豆 | 欧美一级成人毛片影院 | 国产第一福利影院 | 日韩欧美日本 | 国产99久久亚洲综合精品 | 亚洲成人福利 | 色偷偷女男人的天堂亚洲网 | 国产综合在线观看 | 亚洲午夜大片 | 香港台湾经典三级a视频 | 亚洲精品日韩在线一区 | 亚洲一区二区三区首页 |