各位同學(xué)們大家好,昨天我給大家講解這個(gè)漸變風(fēng)格的螺旋交錯(cuò)式logo做法。今天給大家講解下面這個(gè)負(fù)空間三角形漸變logo的做法。他們?cè)诓僮鞴ぞ呱嫌泻芏囝愃浦帯5撬尸F(xiàn)的效果確實(shí)不一樣的。我們先看下放大圖,然后大家思考利用昨天分享的那些AI工具呢?
首先,我們先觀察一下這個(gè)LOGO
關(guān)于教程:通過我們觀察之后發(fā)現(xiàn)這個(gè)LOGO的特點(diǎn)是一個(gè)漸變并且循環(huán)旋轉(zhuǎn)的圖形。
但我們這種以結(jié)果去倒推過程的方式是不妥的。如果我把另外兩個(gè)基本形和參考線隱藏掉,你就會(huì)覺得用旋轉(zhuǎn)大法做出來簡直是不可思議的,如下:
沒有人會(huì)無緣無故把旋轉(zhuǎn)軸心點(diǎn)設(shè)在這么一個(gè)奇怪的位置,且復(fù)制旋轉(zhuǎn)后剛好對(duì)齊。實(shí)際上,這個(gè)漸變欺騙了我們的眼睛,如下:
接下來我們來講解這個(gè)圖形的真正的做法。
第一步
畫正三角形。正三角形的畫法很多,多邊形工具、星形工具都可以實(shí)現(xiàn),而我最習(xí)慣用的還是shape工具(shift+N)。
用法非常簡單,只需要按住鼠標(biāo)左鍵大致畫出你想要的幾何圖形,軟件將自動(dòng)識(shí)別并生成形狀,看下動(dòng)圖操作。
以上是第一步最終效果圖
畫好后,將填充去掉,只保留描邊(默認(rèn)1pt,可適當(dāng)加粗,小編設(shè)置的是4pt),并順時(shí)針旋轉(zhuǎn) 90°,如下:
第二步
①對(duì)三角形執(zhí)行 對(duì)象-路徑-偏移路徑 命令,我這里偏移的數(shù)值是24px,共偏移2次,如下:
以上是第二步第一步最終效果圖
②將內(nèi)部2個(gè)三角形的每條邊做延長,如下:
以上是第二步第二步最終效果圖
延長方法之前也講過多次,這里再演示一下。
以上是第二步最終效果圖這個(gè)我直接給大家一個(gè)GIF演示圖
第三步
①用形狀生成器工具(shift+M)將形狀合并,這個(gè)工具昨天的文章有詳細(xì)的介紹,如下:
看下動(dòng)圖操作:
②刪掉多余的路徑(中間生成的小三角也刪掉,一共有2個(gè)),如下:
③倒圓角。藍(lán)色和紅色錨點(diǎn)位置的倒角數(shù)值分別為8px和32px,如下:
第四步
將描邊轉(zhuǎn)換成填充(shift+X),然后打開漸變窗口(ctrl+F9),漸變類型選第一個(gè)線性即可,如下:
看下漸變控制桿的位置和參數(shù)設(shè)置。兩個(gè)顏色滑塊都是同樣的顏色,只是位置和不透明度不同。
換個(gè)底色就得到了我們最終的圖形,如下:
好了今天的教程案例就講到這里,是不是很簡單啊?喜歡鉆研的小伙伴一定要去嘗試操作一下,看會(huì)不會(huì)遇到一些問題我們一起研究討論。更多關(guān)于UI培訓(xùn)的問題,歡迎咨詢千鋒教育在線名師。千鋒教育擁有多年IT培訓(xùn)服務(wù)經(jīng)驗(yàn),采用全程面授高品質(zhì)、高體驗(yàn)培養(yǎng)模式,擁有國內(nèi)一體化教學(xué)管理及學(xué)員服務(wù),助力更多學(xué)員實(shí)現(xiàn)高薪夢想。
注:本文部分文字和圖片來源于網(wǎng)絡(luò),如有侵權(quán),請(qǐng)聯(lián)系刪除。版權(quán)歸原作者所有!