見鬼!轉轉轉轉轉轉轉轉轉轉轉沒了……
萬圣節(jié),圖文就要玩起來!
還有不到兩周就是萬圣節(jié),之前為大家整理了萬圣節(jié)的案例合集,戳:《萬圣節(jié)SVG交互圖文案例合集》
在 iPaiban Pro 黑科技編輯器中目前有將近2000個交互效果組件/組合,很多大家可能都沒有發(fā)現(xiàn)或者發(fā)現(xiàn)了覺得用不到。
而在萬圣節(jié),各種稀奇古怪的效果正是登場的好機會。
今天給大家推薦2個特別的效果,點擊圖片感受一下:
組合:點擊順時針旋轉放大切換+展開(可設置圈數(shù)、有觸發(fā)區(qū))
編號:11049(組合)
再次點擊試試:
組合:點擊逆時針旋轉放大切換+展開(可設置圈數(shù)、有觸發(fā)區(qū))
編號:11050(組合)
點擊后圖片旋轉放大消失,切換為另一張圖片,同時圖文展開顯現(xiàn)更多內容。
這就是「點擊順時針旋轉放大切換+展開」組合(編號:11049)和「點擊逆時針旋轉放大切換+展開」組合(編號:11050)效果。
旋轉見鬼,嚇人又有意思,最后展開的內容可以容納更多的產(chǎn)品或品牌介紹,萬圣節(jié)營銷效果拉滿!
下面以以第1個效果為例,一起來看看如何實現(xiàn)吧。
詳細教程:
工具:iPaiban Pro 黑科技編輯器,網(wǎng)址:SVG.iPaiban.com
組合:點擊順時針旋轉放大切換+展開(可設置圈數(shù)、有觸發(fā)區(qū))
編號:11049(組合)
第1步:選擇組合
登錄 iPaiban Pro 編輯器后,點擊編輯器右側「組合」按鈕,在「花樣展開」-「特殊效果+展開」分類中找到「點擊順時針旋轉放大切換+展開」組合,或者直接在搜索框中搜索組合編號11049,點擊選擇。
第2步:進入組合編輯模式
如下所示,點擊「點擊此處配置」,進入組合編輯模式。
在組合編輯模式中,我們需要設置展開前和展開后的內容。
第3步:設置展開前的內容
①點擊展開前區(qū)域,在右側分別上傳「點擊前」、「點擊后」2張圖片。2張圖片尺寸需保持一致。本文案例對應2張圖片如下:
②雙擊展開前區(qū)域上傳的圖片,調整觸發(fā)區(qū)域。
第4步:設置展開后的內容
「展開后」的內容支持嵌套各種組件,需要什么效果就在左側「組件」分類中找到相應的組件拖動到組件位中,然后上傳需要的素材即可。
添加組件位-拖動組件到組件位中-上傳圖片,每需要一個樣式就按照這3步操作。
這里我們拖動一個「無縫圖」組件到組件位中,并上傳圖片。如下所示:
第5步:設置動畫參數(shù)
點擊頁面右側紅色小三角,可設置圖片「切換時長」、「旋轉圈數(shù)」和圖文「展開時長」。
展開高度一般無需調整,但當大家在手機上預覽時,如果發(fā)現(xiàn)展開后有多余的空白或者沒有展現(xiàn)出全部內容,這時候可以通過「加減展開高度」使其恰好展開。
第6步:導入公眾號后臺
內容編輯完畢后,點擊左上角「保存并退出」退出組合編輯模式回到編輯器主頁面。
繼續(xù)點擊最右側「預覽草稿」,效果滿意后點擊「同步至微信后臺」就可以了。
使用同步功能無需頻繁在編輯器和微信后臺切換,同步成功后可以立即掃描二維碼查看。
轉載請在文章開頭和結尾顯眼處標注:作者、出處和鏈接。不按規(guī)范轉載侵權必究。
未經(jīng)授權嚴禁轉載,授權事宜請聯(lián)系作者本人,侵權必究。
本文禁止轉載,侵權必究。
授權事宜請至數(shù)英微信公眾號(ID: digitaling) 后臺授權,侵權必究。
評論
評論
推薦評論
暫無評論哦,快來評論一下吧!
全部評論(0條)