下圖中帶有環形的圖示是怎麼做的?

時間 2021-05-12 05:05:23

1樓:徐曉聲

做了其中乙個的教程先放到了UI中國上,沒有什麼基礎的同學也參考下。UI中國教程

1,橢圓工具畫乙個400*400的圓(按住shift畫圓),複製該橢圓圖層. 選中其中乙個圓,按住ctrl+t,再按住alt+shift,將圓縮小到200*200

2,同時選中兩個圓圖層,按住ctrl+e合併圖層,用路徑選擇工具選中兩個圓,做布林運算排除重疊形狀,然後單擊合併形狀元件(此步重要,不然會影響到下一步)。

3,矩形工具畫200*200的矩形,對準圓環的右上角

4,合併矩形和圓環圖層,單擊「相交」,再單擊「合併」

5,橢圓工具畫乙個100*100的圓,複製乙份,單擊如圖「合併」

6,將另外乙個圓放好,合併圖層,路徑選擇工具單擊圓(不能都選中),再單擊「減去」,再單擊合併形狀元件

7,圓角矩形500*500,圓角值為80,漸變色值如下

8,將1/4「圓環」的填色改為透明,新增顏色疊加

9,複製三份,旋轉-90,對齊的方法我還只能用手動的對齊哈

2樓:「已登出」

交一波作業。本人零AI基礎,跟著@丘樂 教程做的。

步驟:1、使用簡單幾何工具;

2、使用路徑查詢器和形狀模式將簡單幾何組合成複雜幾何3、旋轉工具,按住alt鍵精確輸入旋轉角度4、漸變對話方塊修改漸變顏色和透明度,漸變工具控制漸變方向5、效果-高斯模糊做陰影

遇到的幾個問題:

1、旋轉複雜後得到的兩個幾何形狀,凹頭和凸頭無法完美吻合如下圖,放大N倍後,看到邊緣是沒有完全對齊的。

我是手動對齊的,請教主(教程主)指點一二。

2、為了幾何形狀首尾過渡得自然一點,凹頭我使用了20%的透明度,凸頭用了90%的透明度。

但是這樣的後果是,後來做的陰影顏色會透一點在幾何形狀上面。

求教主指點。@丘樂

3樓:HoNooD

誰給乙個用 Sketch 製作的詳細教程?新手。已有的漸變好像都不合適,Angular Gradient 怎麼設定中心點呢?

4樓:

我做的是第乙個:

圓角矩形,引數自己調節,圓角半徑要調節到合適給圓角矩形新增漸變

畫荷葉的一瓣,這個我一開始畫橢圓,然後調節,發現效果不好,因為花瓣的角不是尖的,於是畫兩個圓,取交集部分

然後,乙個花瓣,選取旋轉中心,旋轉角度30度,重複最難的部分,就是如何表現花瓣之間重疊,因為按照以上步驟,出現的是這樣的,效果很差。我的思路是路徑查詢器-分割,然後給各個部分設定不透明度引數(20%,50%,80%),效果如下:把這個放在新增了漸變的圓角矩形上,完成。

5樓:丘樂

先畫個同心圓

裁掉多餘的部分

再加個小圓,合併

同理把右下角裁掉

填充個漸變色,一邊為白色透明,一邊為白色不透明開啟輪廓,複製四份,旋轉

再來畫底圖,用圓角矩形工具

填充漸變色,可以用PS檢視RGB數值

完成6號

先畫個三角形

三邊導圓角,旋轉

再複製乙個出來,裁掉

旋轉120度,剪裁

剩下的就簡單了,旋轉複製填充

4號先畫個橢圓

把下邊改為尖角

新增兩個錨點,拉伸成合適的形狀

再裁剪出需要的部分

最後再補個圓,填色

鑑於有人說漸變是曲線型的,那就來試試曲線型的要怎麼做吧先取圓的1/4線段

將描邊改粗再改漸變

好像不夠大,用鋼筆工具延長

然後兩個選中,右鍵-建立剪下蒙版,就是曲線漸變了那麼問題來了,下面四幅圖中哪些才是曲線漸變呢?

更新一下第乙個的做法:

先畫個橢圓,左右兩邊導成尖角

由於原圖中兩邊並沒有那麼尖,所以我們調整錨點控制軸,使它變得圓潤一點接下來便是填充徑向漸變,旋轉,映象

需要注意的是中間的花瓣要比其他的長一點

接下來複製下面兩片花瓣製作陰影

填充上邊的顏色,高斯模糊

完成2號:

先畫個幾個圓角矩形

將最小的分割成兩半

對上面的一半使用3D旋轉

引數如下,注意透視不為零

做到這一步就基本完成了

再調整一下圓角,加個陰影

5號:應該是最簡單的乙個,就不多說什麼了,直接看圖吧

6樓:聶渲南

用橢圓工具畫一對同心圓,為了後面處理,一定要用黑白兩色。白色部分將變為最終的環,半徑一定在這裡定好。

橢圓工具畫乙個白圓,直徑等於環半徑,對齊(我現在用的CC2015自帶對齊,更早版本可能要靠手動微調)

複製背景,漸變疊加,角度。保證漸變部分只佔90度,剩下3/4全白。

新建蒙版,按alt點蒙版,把這個漸變圖複製進去。

接下來只要複製旋轉就好了~

最後一步要去掉多餘的黑色,改變圖層效果為變亮即可。

注:四角沒切(圓角矩形工具可一步到位)。

再注:我只會PS。這個圖示原始檔應該是向量圖,還請題主留意使用AI作圖的答案。

請問這種磨砂玻璃的圖示怎麼做的?

黑馬程式設計師 最近很多朋友都有發一些磨砂玻璃質感的UI介面,在設計表現過程中,方法多種多樣,但同樣要注意以下幾個點 懸浮感 帶有明顯懸浮感的多個層級表現,可通過投影新增 顏色鮮明 使用鮮豔色彩作為強調色並且從半透明層中透出 邊緣質感 使用輕薄高亮的1畫素邊框來強化物理質感 我們會先使用繪圖軟體得到...

碰到像以下圖中的情況該怎麼辦

廷非延 這件事從兩個角度講 男生 哇,美女啊。第一眼 男生 衣品不錯啊 第二眼 男生 身材也不錯 第三眼 男生 多看幾眼,不然就虧了。第N眼 假裝有分割線 biubiu 女生 他竟然看了別的女生 第一眼 女生 他還看!女生 他死定了!男生是視覺動物,而且也總覺得新奇的更有吸引力,但是你要分清是欣賞還...

我是電工零基礎的新手,請問下圖中的電機正反轉電路圖是不是有互鎖?是不是有按鈕 接觸器雙重互鎖?

踏歌行 這個圖是題主的原圖,咱們通過看主電路就能看出來,這是乙個最基本的電機正反轉控制電路。接觸器KM1吸合時,電機正轉執行,KM2吸合時,電機反轉執行。而這時就需要注意乙個很重要的問題,那就是這兩個接觸器不能同時吸合,如果同時吸合,主電路就會短路,發生嚴重的事故,造成不可估量的嚴重後果。我們怎麼避...