你有多久沒沉下心來，在微信里讀一篇長文了？
微信公眾號生態日趨飽和，這兩年的流行趨勢是條漫式寫作——這不僅僅指長圖推送，也包括“兩行字+一張圖”排版方式。
用戶的注意力被切得七零八落，沒時間沒耐心讀干巴巴的文字，只想呼喚閱讀更輕松、信息更豐富的展現形式，比如：圖文、視頻，以及互動內容。
我們此前已研究過“漫畫號”（點擊藍字可閱讀）這一風口。今天，我們把目光投向更小眾的互動內容，你將在接下來的文字中讀到：
相比長圖漫畫，互動內容還很小眾。雖然早在2016年，國內就有一些編輯器，推出“左滑”一類的模板，但大家使用它僅為節省空間，并未聯想到“互動”層面上。不過時隔三年，技術還是那個技術，但用法已經變了很多。
9月25日，GQ旗下公眾號「黑鳳梨實驗室」，推出一篇題為《脾氣再好的女孩，看到第5句必炸》的文章。推送由22個左滑文本框組成，里面是模擬刮獎場景的圖片。一張圖是完整的句子，一張圖是灰色的刮獎區。一句話分上下兩半，前一句天使，后一句魔鬼。讀者左滑，就能看到隱藏的后一句。
《脾氣再好的女孩，看到第5句必炸》
這是利用簡單模板，達到交互效果的典型案例。GQ實驗室內容總監Rocco稱，他們去年就開始做互動推文，有時自己做，有時外包，主要增加溝通成本。這類形式，部分讀者會覺得很新奇，但如果不是內容非常抓人，大家多看幾次也就審美疲勞了。
最近一篇互動推文爆款，應該是「網易王三三」9月12日發布的《絕對色感の挑戰：不瞎算你贏》。關于xx品牌是什么顏色，文中列出了20多道選擇題。比如，關于什么是“可口可樂紅”，題干會給出六種紅色選擇，讀者一一點開，就能得到對應顏色的名稱。
《絕對色感の挑戰：不瞎算你贏》
《絕對色感》推送兩周后，閱讀量達44萬，超過公眾號「網易王三三」平均閱讀水平。今年上半年開始，網易就陸續嘗試了很多互動玩法，比如點擊空白顯字、文字彈幕效果等，色塊挑戰的翻牌技術，也不是他們第一次做。
“色感挑戰成功之后，我們覺得SVG（Scalable Vector Graphics，可縮放的矢量圖形）交互是可行的，就開始嘗試別的新技術。”網易王三三工作室的蔡捷文說，原先點擊圖片都是顯字，但其實還可以顯圖。
在《絕對の無聊挑戰》中，滿屏都是模擬的氣泡袋，讀者可以挨個戳破，得到不同的字，還有機會抽到瓢蟲。
《絕對の無聊挑戰》
國慶期間，「網易王三三」陸續推出記憶挑戰、運氣挑戰、直男挑戰等多篇互動文章，除了答題、戳泡泡外，讀者還可以在手機上拍蚊子、捏易拉罐、找不同……
GQ和網易的嘗試，比較類似輕量級的H5。蔡捷文介紹，這種翻牌形式，比較適合做成4399小游戲。目前還有一種故事型思路，比如「不會畫出版社」，把長圖和互動結合，可以讓讀者選擇不同的故事線，得到不同的結局。
點擊A/B，顯示不同結局
不過，因為微信對代碼量有限制，超過2萬行后臺會卡死，「不會畫出版社」也沒有做太復雜的交互。多數時候，讀者的選擇只會改變中間一張圖片。最復雜的是《你真的很對不起自己》，結尾變換了多張圖片，讀者可以直接影響故事結局。
“這種交互可以讓讀者更好地代入，可以理解為是平面的、無聲效的游戲”。「不會畫出版社」創始人王澤鵬表示。
創作者最關心的，莫過于投入產出比。
據介紹，網易《絕對色感》是3個人用兩天時間做出來的。因為此前已有技術鋪墊，主要時間花在編輯和調試上。而《絕對の無聊挑戰》涉及的代碼量太大，雖然一早就在第三方編輯器里排好，但復制到微信后臺時頻繁報錯，作者解決bug到凌晨3點。
王澤鵬曾找過外包程序員，但對方報價偏高，因此選擇自己寫代碼。在他看來，更重要的是溝通太繁瑣，“程序員不懂內容，很多效果做不來，但其實有時磨一磨，是有其它解法的”。關鍵并非技術，而是想法，即怎么運用基礎工具，做成想要的效果。
至于最終效果，也是仁者見仁智者見智。蔡捷文說，交互圖片的閱讀數據比常規的好，再加上有爆款驗證，就更堅定了他們做交互圖文的決心。王澤迄今為止共做了3期交互圖文，增加了幾倍工作量，但傳播和平時沒有區別。
除了這些內容創作者，我們也找到了深耕SVG的程序員。他們主要接觸哪些客戶，做哪種交互？從他們的視角來看交互圖文，答案又有些不一樣。
GL之前是卓越工程師，2017年開始探索微信交互圖文。據他介紹，2016年，JZ多媒體解決方案與微信團隊合作制定了《微信HTML5環境下的SVG AttributeName白名單》，但當時僅應用在一些「點擊空白顯示文字」之類的編輯器模板中。
AttributeName 的對照表（圖源：JZH5）
時至今日，微信支持的交互技術代碼基本沒有升級，甚至在某些代碼層面增加了一些限制。也就是說，現在我們看到的交互圖文，其實2016年就可以制作，只是當時少有人研究罷了。
微信交互圖文沒有嚴格的分類，GL給客戶介紹時，一般分成兩種：模塊化交互圖文和沉浸式交互。前者只是在文章中插入一個互動模塊，其他內容還是普通圖文排版；后者則是通篇矢量插畫，通過一個或幾個固定元素，利用路徑位移動畫貫穿全文，文中通過交互動畫（例如答題互動）串聯情節。
另一位設計師荒村，也曾撰文對交互圖文進行分類，主要是兩大類：文本驅動和產品驅動。前者因為文字多，適用的交互形式少，開發難度較大；后者以產品為主，跟SVG交互結合的點多，趣味性強。這和GL的分類，其實差不多。
荒村表示，在目前技術被濫用的情況下，只能通過創意和設計實現差異化。成本上，簡單的交互圖文只需花幾百元定制，復雜的上千元。效果上，黑科技排版更直觀有趣，對閱讀量有帶動作用，個別會有爆點。但嘗鮮過后，公眾號整體內容和風格，才是影響用戶關注的決定因素。
而根據GL的介紹，僅技術開發，一篇推文的報價在1000~12000元不等，基本都能控制在3000元以內，制作周期1~2天。根據客戶反饋，閱讀量一般是之前的1.5~2倍，讀者留言會積極很多，暫時還沒碰到推送后傳播變差的案例。
我們發現一個現象：創作者對交互圖文多持觀望態度，真正有強烈意愿的是大企業。GL目前對接過十幾家廣告公司，合作過的品牌有大大小小上百個。Rocco卻表示，很多客戶執迷于形式，要前所未見的新形式，但他還是比較推薦打動人心的內容。
“七年過去，因為交互爆過的公眾號推文，兩只手都數得過來。”王澤鵬認為，交互是為了體驗，比如更好的代入感。網易《絕對色感》能火，是因為這種形式在H5時期就爆過，這個嘗試“非常穩”。
而且，其中不科學的地方在于：這件事技術門檻不高，有基礎的一天就能學會。雖然有可能研究出一種性價比高的交互方式，但這種形式一出現就會被復制，復制一百遍就變成了垃圾。
交互創意模板可以無窮多
既懂內容又懂技術的人不多，一般公眾號想嘗試可以去買，但這種訂單報價并不低——點擊圖片A顯示圖片B的技術，王澤鵬曾給人報價800元一組，他覺得其實不至于這么貴，現在主要是打一個信息差，畢竟甲方喜歡這種高端、罕見的形式。
關于為何創作者很少做交互內容，GL覺得主要有三點原因：一是技術門檻；二是制作周期長，不好追熱點；三是互動性取決于視覺效果，對文字創作者來說意義不大。
但對企業來說，交互圖文類似「閹割版」的H5，雖然很多效果還無法實現，但相對來說，交互圖文的制作周期和成本更低，同時可以直接推送給讀者，也具備轉化率高的優勢，因此廣受品牌歡迎。整體來說，有定制需求的用戶基本都是大企業/品牌。
GL接觸的客戶中，18年上半年手機品牌居多，18年下半年至今，汽車品牌占據了絕大多數，他們的需求從以前較多游戲類互動，逐漸演變成產品展示/內容呈現類互動。
部分合作品牌
“客戶不會為了交互而交互，交互始終是為內容服務的。點擊觸發并不只是為了呈現一個動畫效果，最重要的是為用戶獲取信息增設門檻，通過一次點擊，讓用戶更專注地注意到點擊后呈現的信息。”
荒村也表示，在企業周年、大事件、新品上市、節日熱點等關鍵節點，品牌會制作交互圖文。目前嘗試交互圖文的品牌數量，逐年遞增。預測以后的交互圖文，會集中在競爭激烈，且注重品牌區隔力的行業里，比如車企、電子產品、奢侈品等。
他還提到，目前微信支持SVG矢量交互動畫，未來可能放開位圖交互、支持參數傳遞，圖文的整體效果類似H5。也可能增加軌跡動畫（比如耐克廣告打對勾；麥當勞廣告畫M）、重力感應（比如金典投放的廣告：北京大興機場）、AR等新玩法——前兩者已經在朋友圈廣告試用了。
示例：軌跡動畫
新內容形態對數據庫、服務器、流量的挑戰都比較大，微信官方也會考慮運維成本。
受制于技術，微信交互圖文還達不到游戲的效果。一旦技術開放，H5、游戲、網頁能實現的功能都可以實現，甚至可以攜帶病毒。這對微信來說又是個考驗。不過王澤鵬認為，鑒于目前公眾號的視頻呈現不夠友好，或許直接沖向維度更高的互動內容，反而會有所突破。
如果還是延續2016年的能力，微信互動內容恐怕一時半刻不會成為主流，只會是小眾潮流。不過，根據我們得到的消息，微信將來會在內容呈現上有新嘗試。不少同行期待的是，如果微信能將常見的交互產品功能化，不需要代碼實現，交互內容創作的門檻會降低很多。
屆時，交互圖文爆款會越來越多。但隨著技術普及，工具使用只會變成基礎能力。而創意和內容，永遠是第一生產力。
