適合母親節(jié)的SVG模版
寶藏模版
往期推薦（點(diǎn)擊閱讀）：
趣味效果｜高大上｜可愛風(fēng)｜年終總結(jié)I｜年終總結(jié)II｜循環(huán)特效｜情人節(jié)I｜情人節(jié)II｜情人節(jié)IIII｜婦女節(jié)I｜婦女節(jié)II｜兒童節(jié)I｜兒童節(jié)II｜兒童節(jié)III｜618I｜618II｜父親節(jié)｜絲滑動(dòng)畫｜端午節(jié)I｜端午節(jié)II｜滑動(dòng)妙用｜圖片輪播I｜圖片輪播II｜又紅又專｜中秋節(jié)I｜中秋節(jié)II｜雙十一I｜雙十一II｜世界杯｜感恩節(jié)｜圣誕節(jié)I｜圣誕節(jié)II｜新年｜兔年春節(jié)｜元宵I ｜元宵節(jié)II｜愚人節(jié)I｜愚人節(jié)II｜雜志范兒｜520/521I｜520/521II｜五一I｜五一II｜五一III｜母親節(jié)I｜母親節(jié)I｜多巴胺｜微博｜夏日氛圍｜大唐國(guó)風(fēng)｜反詐宣傳｜七夕節(jié)｜CityWalk｜開學(xué)季II｜開學(xué)季II｜校園主題｜揭露丑惡真相｜運(yùn)動(dòng)會(huì)I｜運(yùn)動(dòng)會(huì)II｜十一｜萬(wàn)圣節(jié)I｜萬(wàn)圣節(jié)II｜冬季氛圍｜新聞宣傳｜春節(jié)紅包I｜春節(jié)紅包II｜龍年春節(jié)｜開工新品｜地球日｜問(wèn)答題｜人工智能｜踏青出行｜五四青年節(jié)
各位 E2.COOL 的會(huì)員，編輯器內(nèi) 1700+ 的 SVG 正版組件你們都用過(guò)嗎？母親節(jié)即將到來(lái)，各大關(guān)聯(lián)品牌的產(chǎn)品推廣和節(jié)日祝福都少不了 SVG 交互設(shè)計(jì)的加持。
無(wú)限選擇器
基于@科蚪 大神發(fā)明的 SVG 無(wú)限選擇器，《把愛都給她》實(shí)現(xiàn)了圖文內(nèi)分類菜單的功能化設(shè)計(jì)，每個(gè)選項(xiàng)內(nèi)又支持多個(gè)產(chǎn)品圖滑動(dòng)，并可以點(diǎn)擊下方按鈕跳轉(zhuǎn)電商頁(yè)面；而《好個(gè)奇，你的「小號(hào)」練到哪了》則利用無(wú)限選擇器，結(jié)合像素風(fēng)設(shè)計(jì)組合成了一個(gè)萬(wàn)能媽媽的互動(dòng)模塊：
這種 H5 感的 SVG 信息展示方法，我們已經(jīng)多次通過(guò)授課為廣大 E2 編輯器用戶解析，這里可以查看由 Ceep 老師錄制的一期視頻專題進(jìn)行學(xué)習(xí)。
標(biāo)簽抽拉
基于@GL 大神發(fā)明的 SVG 標(biāo)簽抽拉，《來(lái)自花園的禮物》通過(guò)卡片組呈現(xiàn)了另一種產(chǎn)品廣告的多選展示策略：
這種抽拉 SVG 黑科技排版還有更多豐富的公眾號(hào)排版應(yīng)用，點(diǎn)擊視頻學(xué)習(xí) Ceep 老師錄制的專題課程。
一條線軌跡運(yùn)動(dòng)
E2 編輯器的 SVG「一條線」模式在絕大多主題場(chǎng)景下都可圈可點(diǎn)，《母親節(jié) | 她是世界上平凡而偉大的存在》正是采用了該方法講述了屬于母親的溫暖故事：
它的具體排版實(shí)現(xiàn)方法我們也錄制了專門的視頻課程進(jìn)行講解。
填字特效（橫向頂層滑動(dòng)）
把偏見化為理解——《張雨綺：今天別叫我媽媽》通過(guò)文案層面的變化巧思，構(gòu)建了 SVG 填字互動(dòng)的「頂層滑動(dòng)」排版：
頭條新聞（連續(xù)撕紙）
把媽媽的好告訴全世界！《我的媽呀，太酷了！》以“母親節(jié)頭條”為主題，通過(guò)「連續(xù)撕紙」SVG 模版將愛與祝福以極具張力的方式呈現(xiàn)：
在 E2.COOL 內(nèi)可以搜索功能內(nèi)查找「連續(xù)撕紙」組件即可使用！當(dāng)然要注意素材的尺寸需保持統(tǒng)一喔！
禮盒滑動(dòng)（頂層滑動(dòng)）
同樣是基于 SVG「頂層滑動(dòng)」，《母親節(jié)特輯丨媽媽搖身一變，居然變成了···》將這一交互轉(zhuǎn)變?yōu)榛_禮物盒的場(chǎng)景：
這種滑動(dòng)的設(shè)計(jì)思路其實(shí)并不復(fù)雜，只需要在第二個(gè)滑動(dòng)模塊上傳透明的空?qǐng)D素材即可。此外，還可以采用「層層滑動(dòng)」SVG 模版實(shí)現(xiàn)更連續(xù)的開盒互動(dòng)，參考《紅包在哪里？（第一彈）》案例的效果和其他第三方的案例分析：
無(wú)限往返刷新器+縱向錯(cuò)層滑動(dòng)
《媽媽，人生是______》以 E2 編輯器的「無(wú)限往返刷新器」開場(chǎng)，銜接精彩的縱向錯(cuò)層吸附滑動(dòng)設(shè)計(jì)，也實(shí)現(xiàn)了一種文字互動(dòng)式的 SVG 交互創(chuàng)意：
關(guān)于這種 SVG 交互的特效制作方法，可以瀏覽另一期相似案例解析進(jìn)行學(xué)習(xí)：
自動(dòng)層層伸長(zhǎng)
如果你準(zhǔn)備了大量文案內(nèi)容，那么也可以參考《聽，媽媽的話》、《全國(guó)母親今天最想聽到的是這個(gè)！》案例，采用 SVG 層層伸長(zhǎng)的方式排版：
在 E2.COOL 內(nèi)請(qǐng)選擇組件「層層伸長(zhǎng)」，并且在篩選器中選擇你偏好的具體形式，制作時(shí)僅需對(duì)應(yīng)上傳每層切圖即可。
伸長(zhǎng)套伸長(zhǎng)
《這個(gè)母親節(jié)，WSLS人格火了》、《母親節(jié)丨給媽媽的三行情書》則采用「伸長(zhǎng)套伸長(zhǎng)」這種層次豐富的 SVG 互動(dòng)，展示多面母親與多樣祝福：
在 E2.COOL 內(nèi)使用「伸長(zhǎng)套伸長(zhǎng)」時(shí)，務(wù)必仔細(xì)閱讀《黑科技編輯器｜伸長(zhǎng)套伸長(zhǎng)SVG教程（合集更新）》教程并注意其中的參數(shù)計(jì)算規(guī)則：
逆向擦出伸長(zhǎng)
針對(duì)具有轉(zhuǎn)折性的劇情表現(xiàn)，很多運(yùn)營(yíng)人當(dāng)下熱衷于通過(guò)全文刷新的方式進(jìn)行 SVG 設(shè)計(jì)，正如《我媽呢？？？》：
這種自下而上全文刷新的黑科技排版有多種在 E2 編輯器中的實(shí)現(xiàn)手法，你可以參考一下兩期教程選擇適合的方式實(shí)現(xiàn)：
1）「點(diǎn)擊-收縮」實(shí)現(xiàn)逆向全文刷新SVG教程
2）逆向擦出伸長(zhǎng)（含附件畫面）SVG教程
更多海量模板，平均不足 1 元！
E2.COOL 秉持著讓行業(yè)“人均 SVG”的生態(tài)理念，由多位黑科技排版設(shè)計(jì)的頭部資深開發(fā)者共同打造，斬獲包括法國(guó)設(shè)計(jì)獎(jiǎng)、美國(guó)繆斯創(chuàng)意設(shè)計(jì)獎(jiǎng)等諸多國(guó)際賽事大獎(jiǎng)，幫助更多品牌以可視化形式完成互動(dòng)式圖文創(chuàng)作。如有任何特效靈感和建議，也歡迎通過(guò)客服向我們提出，E2 將竭誠(chéng)思考代碼轉(zhuǎn)化的可行性。
E2 平臺(tái)官網(wǎng)
https://www.e2.cool/
會(huì)的比別人多一點(diǎn)
轉(zhuǎn)載請(qǐng)?jiān)谖恼麻_頭和結(jié)尾顯眼處標(biāo)注：作者、出處和鏈接。不按規(guī)范轉(zhuǎn)載侵權(quán)必究。
未經(jīng)授權(quán)嚴(yán)禁轉(zhuǎn)載，授權(quán)事宜請(qǐng)聯(lián)系作者本人，侵權(quán)必究。
本文禁止轉(zhuǎn)載，侵權(quán)必究。
授權(quán)事宜請(qǐng)至數(shù)英微信公眾號(hào)(ID: digitaling) 后臺(tái)授權(quán)，侵權(quán)必究。
評(píng)論
評(píng)論
推薦評(píng)論
暫無(wú)評(píng)論哦，快來(lái)評(píng)論一下吧！
全部評(píng)論（0條）