這里我為大家找了一篇塔斯汀公眾號的推文內容來進行案例拆解。在推文中他們的長圖設計都與SVG效果巧妙的結合起來，將領優(yōu)惠券與產品宣傳做成游戲的形式，讓用戶在帶著好奇心瀏覽完全文。

點擊圖片跳轉閱讀

這篇推文中用到多種SVG效果進行組合，再配上卡通的版面設計，可愛十足。首先進入到推文后映入眼簾的就是連續(xù)翻頁再展開SVG效果，ID：152：在整體設計上，首圖和翻頁圖以卡通風格為主，視覺效果上模擬了游戲界面的樣式，比如游戲進度條、gif圖，與正文的闖關設置相呼應，讓原本直白普通的領券過程變得很有意思。

正文內容部分，通過3個版塊串連在一起，做成了闖關的形式，前兩個部分都用到了多區(qū)域彈出海報自動收回SVG效果，ID：195，通過該效果分別介紹了周二會員日的詳情，以及漢堡系列產品，而在第三部分則是利用多區(qū)域觸發(fā)引導跳轉SVG，ID：233，引導用戶跳轉小程序領優(yōu)惠券。

整體上看這篇文章并沒有用到特別酷炫的SVG效果，都是一些我們常見的SVG組件，但是他們卻能巧妙地將SVG與領券嘗鮮的主題相結合，讓每個SVG組件都能恰到好處發(fā)揮其價值。從中我們也可以看出，一篇優(yōu)秀的推文內容，不是光靠厲害的SVG組件來堆砌，而是要將SVG組件與主題、版面設計相結合來完成的，畢竟我們的推文最終目的還是在于向用戶傳遞實質性的價值。

在創(chuàng)意設計上來看，明確主題后，可以將推文內容分版塊以SVG來呈現，比如像上述文章圍繞領券嘗鮮主題，以闖關形式呈現，做了多組不同的游戲內容設計，或者是圍繞時下流行話題，比如：MBTI、年輕人奇葩的購物習慣等展開話題，通過對比方式，運用滑動、點擊換圖等SVG，做相應的版塊設計。正文內容要始終圍繞主題而展開，這樣才能形成一篇完整的推文。

在SVG頁面的【互動效果】的搜索框輸入195或者是“多區(qū)域彈出”關鍵詞，放入到編輯頁面。