李佳琦超愛用的交互，又出新玩兒法啦！
如果你想讓一篇圖文在手機一屏就能完全展示，最簡單的方法就是用連續點擊切換圖片的交互來呈現。
李佳琦公眾號中就經常用。
在 iPaiban Pro 黑科技編輯器中有很多連續點擊的效果，今天為大家推薦3個，它們有個共同點是效果都類似翻頁，并且簡單直接。
效果1：連續點擊開門切換圖片
*素材來自李佳琦Austin《一周超級預告 | 李佳琦超級618……》
組件：連續點擊-開門切換圖片(翻頁、左下、有觸發區)
編號：11385（組件）
效果2：連續點擊飄落切換圖片
*素材來自李佳琦Austin《一周早餐日歷妥妥安排……》
組件：連續點擊-飄落切換多張圖片(左)
編號：10841（組件）
效果3：連續點擊移出切換圖片
*素材來自我要WhatYouNeed《這幾天建議沖動點。》
組件：連續點擊-切換圖片(向下水平移出)
往往就是這樣一些簡單直接的效果，配合適合的文案和設計，能讓人有種一直想要點下去的感覺。
效果1和2大家可通過交互下的教程了解更多。
效果3除了向下移出切換的，還包括點擊向上、向左、向右移出3個方向：
組件：連續點擊-切換圖片(向上水平移出)
編號：10462（組件）
組件：連續點擊-切換圖片(向左水平移出)
編號：10460（組件）
組件：連續點擊-切換圖片(向右水平移出)
編號：10461（組件）
這里我們以連續點擊向下移出為例，一起看下教程：
詳細教程：
工具：iPaiban Pro 黑科技編輯器，網址：SVG.iPaiban.com
組件：連續點擊-切換圖片(向下水平移出)
編號：10463（組件）
第1步：選擇組件
登錄 iPaiban Pro 編輯器后，點擊編輯器左側「組件」按鈕，在「點擊」-「 水平移入移出」分類中找到「連續點擊-切換圖片(向下水平移出)」組件，或者直接搜索組件編號10463，點擊選擇。
第2步：上傳圖片素材
點擊頁面右側「+」號按鈕，上傳要切換的圖片。至少上傳2張，至多沒有數量限制，所有圖片的尺寸需保持一致。
第3步：調整動畫參數
在右側圖片位置的下方，滑動滑桿可調整圖片移出的動畫時間。
第4步：導入公眾號后臺
點擊最右側「預覽草稿」預覽效果，效果滿意后點擊「同步至微信后臺」就可以了。
使用同步功能不用頻繁在編輯器和微信后臺切換，同步成功后可以立即掃描二維碼預覽在公眾號的效果。
如需局部導入可參考：《iPaiban Pro小助手安裝和使用教程》
制作SVG交互圖文認準 iPaiban Pro 黑科技編輯器，網址：SVG.iPaiban.com，復制網址在 PC 端 Chrome（谷歌）瀏覽器打開，即可注冊，編輯器1500+組件/組合現已全部支持免費試用了。
新用戶在「新手禮包」可領取3天企業標準版會員免費商用，以及22個常用必備組件的大禮包（1年）。隨禮包附贈千元優惠券，每單最高立降500元。
轉載請在文章開頭和結尾顯眼處標注：作者、出處和鏈接。不按規范轉載侵權必究。
未經授權嚴禁轉載，授權事宜請聯系作者本人，侵權必究。
本文禁止轉載，侵權必究。
授權事宜請至數英微信公眾號(ID: digitaling) 后臺授權，侵權必究。
評論
評論
推薦評論
暫無評論哦，快來評論一下吧！
全部評論（0條）