公眾號排版技巧：愛彼迎同款SVG效果教程
想要讓你的公眾號內容脫穎而出嗎？本文詳細介紹了如何利用愛彼迎風格的SVG動畫效果，為你的公眾號排版增添互動性和吸引力。掌握這些創新技巧，讓你的推文在眾多公眾號中脫穎而出，提高用戶參與度和閱讀體驗。
嗨嘍，各位寶子們，三兒來了，最近是不是苦于推文排版平平無奇，想做一些新的創意了，這不，今天我就要為大家帶來一種新的SVG玩法，此玩法來自于最近我刷到的一篇愛彼迎的創意推文，這款效果很吸睛，適用性廣，話不多說，趕緊跟著三兒一起來復刻吧！
（來自Airbnb愛彼迎公眾號）
這是一條關于世界讀書日的推文內容，其創意靈感源自諺語“讀萬卷書，行萬里路”。推文巧妙地利用了一些書名中蘊含的地名元素，自然地融入了自己品牌旗下的民宿宣傳。在設計層面，他們模仿了書籍的樣式，并加入了可反復點擊切換的SVG動畫效果，使得內容的展現方式更加栩栩如生，帶給用戶一種沉浸式的閱讀享受。
此效果名稱為點擊封面圖-無限選擇器，ID：913，它可以幫助我們優化推文排版布局，同時還能確保用戶可以反復瀏覽內容。除了用在這種讀書日的主題外，我們還可以將其用在人物介紹、產品功能介紹、新品上新推薦的主題中。
點擊135編輯器頁面左側，選擇SVG編輯器進入界面，在【互動效果】中搜索ID：913，找到該效果，點擊放入編輯界面。
這里需要添加三個部分的素材，即背景圖、封面圖、切換圖。注意：這三個部分圖片需要寬高保持一致。
① 分別上傳背景圖、封面圖。
封面圖設計小tips：由于所有圖片的寬高要求一致，所以在設計封面圖部分時需要將封面圖右側的一小部分區域做成鏤空透明的狀態，以便能顯示出底部切換圖部分的標簽。
方向調整：大家可以根據自己圖片的情況設置封面圖移出的方向是左還是右。
② 接著將切換圖上傳到組件中。并為每張圖的標簽部分都添加上控制熱區。
組件全部設置完畢后，就可以選擇右上角的【導出】【同步】到公眾號后臺。
以上就是本次三兒
分享的全部內容了
如果你還有什么想看想學的
歡迎在評論區留言哦
如果覺得還不錯
記得點贊+在看
*以上素材僅供學習交流使用，侵聯刪
立即登錄
