輕輕一劃~圖文展開啦~
還記得前不久給大家介紹的滑動拼圖展開嗎?
今天用里面同樣接聽電話的素材再來看一個效果——劃動消失展開。
體驗一下:
*素材來自MLB美妝《? 點擊接聽潮人熱線》
組合:劃動消失+展開
編號:11911(組合)
這個效果比之前《????拼拼拼拼拼拼拼拼拼圖????》中介紹的拼圖展開更簡單一些。在圖片指定位置手指劃一下,圖片便消失切換為另一張,接著圖文展開顯現更多內容。
同樣實現滑動接聽電話的效果,這次在素材制作切圖上也更簡單,只是效果不如拼圖展開的細膩。
因為素材需求簡單,它的排版創意靈活性也會更高一些。
比如卷宗的上滑展開:
*素材來自卷宗Wallpaper《在琉璃中遇見生活的“萬相”》
組合:劃動消失+展開
編號:11911(組合)
奔馳的下滑展開:
*素材來自梅賽德斯-奔馳《危機不可預知,TA給你的保護面面俱到》
組合:劃動消失+展開
編號:11911(組合)
以上案例使用 iPaiban Pro 黑科技編輯器的「劃動消失+展開」組合(編號:11911)即可實現。
下面以以第1個效果為例,一起來看看如何實現吧。
詳細教程:
工具:iPaiban Pro 黑科技編輯器,網址:SVG.iPaiban.com
組合:劃動消失+展開
編號:11911(組合)
第1步:選擇組合
登錄 iPaiban Pro 編輯器后,點擊編輯器右側「組合」按鈕,在「花樣展開」分類中找到「劃動消失+展開」組合,或者直接在搜索框中搜索組合編號11911,點擊選擇。
第2步:進入組合編輯模式
如下所示,點擊「編輯組合」,進入組合編輯模式。
在組合編輯模式中,我們需要設置展開前和展開后的內容。
第3步:設置展開前的內容
點擊展開前區域,在右側上傳「滑動前」圖片:
第4步:設置觸發區域
雙擊編輯區底圖,出現設置觸發區域的窗口,窗口中的紅色色塊代表著觸發區域。
用鼠標拖動圖片調整色塊位置和大小。
第5步:設置展開后的內容
「展開后」的內容支持嵌套各種組件,需要什么效果就在左側「組件」分類中找到相應的組件拖動到組件位中,然后上傳需要的素材即可。
添加組件位-拖動組件到組件位中-上傳圖片,每需要一個樣式就按照這3步操作。
這里我們拖動一個「批量無縫圖」組件到組件位中,并上傳圖片。如下所示:
第6步:設置動畫參數
點擊頁面右側紅色小三角,可設置滑動后的圖片「消失時長」和圖文「展開時長」。
展開高度一般無需調整,但當大家在手機上預覽時,如果發現展開后有多余的空白或者沒有展現出全部內容,這時候可以通過「加減展開高度」使其恰好展開。
第7步:導入公眾號后臺
內容編輯完畢后,點擊左上角「保存并退出」退出組合編輯模式回到編輯器主頁面。
繼續點擊最右側「預覽草稿」,效果滿意后點擊「同步至微信后臺」就可以了。
使用同步功能無需頻繁在編輯器和微信后臺切換,同步成功后可以立即掃描二維碼查看。
轉載請在文章開頭和結尾顯眼處標注:作者、出處和鏈接。不按規范轉載侵權必究。
未經授權嚴禁轉載,授權事宜請聯系作者本人,侵權必究。
本文禁止轉載,侵權必究。
授權事宜請至數英微信公眾號(ID: digitaling) 后臺授權,侵權必究。
評論
評論
推薦評論
暫無評論哦,快來評論一下吧!
全部評論(0條)