簡(jiǎn)單6步用Axure繪制相機(jī)圖標(biāo)(附源文件)

2 評(píng)論 13349 瀏覽 150 收藏 5 分鐘

記錄這些內(nèi)容,只是覺(jué)得有趣,盡管可能看起來(lái)沒(méi)什么用,但很多事情換個(gè)視角總會(huì)有些不同。

151483-b675156ae4685e2f

步驟1:拖入一個(gè)矩形,寬高自定,設(shè)置圓角值、投影,填充類(lèi)型選擇為漸變,然后設(shè)置漸變開(kāi)始和結(jié)束的顏色(選中顏色指示浮標(biāo)就可以更換對(duì)應(yīng)位置的顏色),設(shè)置漸變角為90(即垂直方向的漸變)。

151483-92d441617986f3b2

步驟2:再拖入一個(gè)矩形,點(diǎn)擊右上角的灰色小圓點(diǎn),選擇圓形模式(或設(shè)置比較大的圓角值直到矩形變?yōu)閳A形);

填充類(lèi)型選擇為單色,#F2F2F2;

投影設(shè)置見(jiàn)右側(cè)示意,投影顏色為#000000,不透明值為15;

到樣式面板設(shè)置內(nèi)陰影,參數(shù)見(jiàn)右側(cè)示意,內(nèi)陰影顏色為#FFFFFF,不透明值為100。

151483-1707e68e9d11afbe

步驟3:復(fù)制兩個(gè)圓形,根據(jù)比例調(diào)整大寫(xiě),并分別填充#536383、#293448;

151483-6bec20b609b08206

步驟4:再繪制一個(gè)圓形,設(shè)置漸變填充,顏色依次為#FFFFFF(不透明值100)、#0099FF(不透明值11)、#00CCFF(不透明值0),位置距離及角度值見(jiàn)右側(cè)示意;

151483-45e8e21458d670a0

步驟5:復(fù)制一個(gè)前面的圓形圓形,更改漸變填充,顏色依次為#0099FF(不透明值100)、#0099FF(不透明值11)、#00CCFF(不透明值0),位置距離及角度值見(jiàn)右側(cè)示意;

151483-9d62c79152dd40fa

步驟6:再拖入一個(gè)矩形,點(diǎn)擊右上角的灰色小圓點(diǎn),選擇任意一個(gè)半開(kāi)口的矩形模式,設(shè)置圓角值得到一個(gè)半圓;

然后到樣式面板設(shè)置旋轉(zhuǎn)角度,為了方便,可以將其與步驟三繪制的矩形群組再旋轉(zhuǎn)。

對(duì)以上原色的大小位置進(jìn)行組合就可以得到一個(gè)簡(jiǎn)單相機(jī)圖標(biāo)了,也可以嘗試加一些其他元素進(jìn)行練習(xí),比如紅色心形的提示燈……

151483-abd558efd9d75a9e

相機(jī)圖標(biāo)

最后,Axure可以不僅僅只是用來(lái)進(jìn)行交互原型設(shè)計(jì),也可以在你需要的時(shí)候增加一點(diǎn)點(diǎn)趣味性,比如,這種扁平風(fēng)格的小插畫(huà)(這時(shí)候,工具已經(jīng)不是工具了^-^):

151483-ec427c2917036991

工位插畫(huà)

151483-73189f7c11cd1bf4

工位插畫(huà)圖形節(jié)點(diǎn)

相機(jī)圖標(biāo)源文件地址:

作者源:

http://pan.baidu.com/s/1qXFMLsS

官方下載:

http://pan.baidu.com/s/1bpx6Ggf

 

作者:lkl_ue(簡(jiǎn)書(shū)作者)

原文鏈接:http://www.jianshu.com/p/d455ecb51eb3#

本文由 @lkl_ue 授權(quán)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可,禁止轉(zhuǎn)載。

更多精彩內(nèi)容,請(qǐng)關(guān)注人人都是產(chǎn)品經(jīng)理微信公眾號(hào)或下載App
評(píng)論
評(píng)論請(qǐng)登錄
  1. 拿沒(méi)有圖層的Axure作畫(huà),實(shí)在是藝高人膽大(閑得d疼) ?? ?? ??

    來(lái)自浙江 回復(fù)
  2. ?? 學(xué)習(xí)了~

    來(lái)自廣東 回復(fù)