新媒體顏色SVG排版教程
胖友們大家好啊，我是三兒。后臺(tái)問爆的SVG教程來啦！事情是這樣的，昨天三兒在135平臺(tái)發(fā)了一篇文章《新媒體人の顏色挑戰(zhàn)》，喜歡的小伙伴超級(jí)多，留言都都都都都是要這個(gè)SVG教程。
甚至還有兇我的
有求必應(yīng)的三兒今天就來給大家還原一下這篇SVG的制作過程！不要怕學(xué)不會(huì)，文末還有詳細(xì)的視頻教程噢~
（ps：沒看過文章的寶戳下面標(biāo)題看原文）
每一個(gè)色塊都需要準(zhǔn)備兩張圖片，分別是點(diǎn)擊前的圖，和點(diǎn)擊后的圖。注意每張圖片的寬高尺寸要一致。
通過135編輯器左側(cè)入口進(jìn)入svg編輯器；
或者直接在瀏覽器輸入svg編輯器網(wǎng)址進(jìn)入：
http://www.vrlw.com.cn/svgeditor/
在『互動(dòng)效果』欄目下的『組合』分類里，下滑找到『基礎(chǔ)布局-一行三列』效果，將其添加到編輯區(qū)域；
將布局的寬度比例設(shè)置為1:1:1；
點(diǎn)擊『編輯基礎(chǔ)布局』按鈕或雙擊編輯區(qū)域的組件，進(jìn)入基礎(chǔ)布局編輯界面。
進(jìn)入基礎(chǔ)布局編輯頁后，在左側(cè)點(diǎn)擊『點(diǎn)擊翻轉(zhuǎn)卡片-自定義觸發(fā)』，分別為每一列布局添加點(diǎn)擊翻轉(zhuǎn)的效果；
接下來，在右側(cè)點(diǎn)擊『添加圖片』按鈕，分別上傳點(diǎn)擊前后的圖片；
上傳好圖片之后，鼠標(biāo)點(diǎn)擊組件，可以設(shè)置觸發(fā)點(diǎn)擊翻轉(zhuǎn)效果的熱區(qū)；
點(diǎn)擊『完成』，回到主編輯界面即可。
如果要做成三兒這種6個(gè)色塊的效果，再按以上步驟添加一個(gè)『基礎(chǔ)布局-一行三列』布局，添加好素材就可以了。
制作好的SVG文章可以通過使用『同步』或『導(dǎo)出』功能，保存到微信公眾號(hào)平臺(tái)。
好啦，以上就是今天的全部內(nèi)容啦，想要使用這款SVG組件的胖友們可以升級(jí)年費(fèi)超級(jí)會(huì)員免費(fèi)使用噢！
如果你還不是年費(fèi)超級(jí)會(huì)員，來三兒的雜貨鋪，花99元就能任選5個(gè)你心儀的SVG效果，趕快掃描下方二維碼，帶走它們吧！
看在三兒努力碼教程的份上
來個(gè)在看唄~
·END·
文章排版由135編輯器提供技術(shù)支持
■ ■ ■ ■
立即登錄
- 2023霜降節(jié)氣海報(bào)合集，給你專屬秋天的靈感！
- 寒露節(jié)氣免費(fèi)手機(jī)海報(bào)模板分享
- 2023中秋節(jié)精美海報(bào)大放送，尊的都很好看！
- 不看會(huì)后悔系列！2023國慶節(jié)精美海報(bào)模板分享！
