2020年度微信SVG互動排版案例TOP10!

微信SVG互動圖文創意開發;可跳轉公眾號:「野生符號」檢視最新互動式創意圖文案例。

互動圖文是透過SVG+HTML程式碼實現的一種高階排版方式,透過基於微信SVG AtributeName白名單下的原生動畫在微信圖文中實現互動效果。

本文盤點 2020 年符號互動為各品牌交付的互動案例 Top 10。

入選的品牌有小米手機、榮耀手機、中國華能、滴滴出行、沙丘研究所、共青團中央、GQ實驗室、悅遊。

01 小米手機

2020年度微信SVG互動排版案例TOP10!

本文設計互動均由符號互動操刀,整體開發秉持「剋制」哲學,一切操作圍繞「凸顯產品力」展開。

同時本文貫徹了小米CSR理念,在圖文中隱藏大段富文字結構,使視障人群也可以透過讀屏功能獲取文章資訊。

而「開場動畫-頁面伸長-分節滑動」經典結構在2021也將仍是產品介紹類圖文的主流。

02 榮耀手機

2020年度微信SVG互動排版案例TOP10!

千篇一律的「點選」互動不免令人審美疲勞,本文采用相對少見的「長按」、「鬆手」觸發形式。也是業內首篇「正序、倒序」控制結構。

03 中國華能

2020年度微信SVG互動排版案例TOP10!

大型互動長卷,包含「多級滑動伸長」「頁面放大」「音訊觸發」「直線移動」「曲線移動」「序列幀播放」「旋轉動畫」「底層滑動」「GIF控制器」等互動效果。

此類互動裝置在「情境化」內容傳達上具有無可比擬的優勢。不難看出,將文字難以傳達的資訊透過情境化圖文來展現是值得嘗試的選擇。

04 GQ實驗室

2020年度微信SVG互動排版案例TOP10!

2020下半年難得的出圈圖文,成功刷屏多個圈層。

05 共青團中央

2020年度微信SVG互動排版案例TOP10!

“十四五”規劃關乎國計民生,與人們生活殷切相關,為了讓重大資訊能夠更有效的傳達,我們「建構」了一系列具象化的情境,如「醫院」「文化廣場」「學校」等場景,透過具象化、場景化的場景建構,讓內容變得更容易理解,使“十四五”規劃的內容傳達到千家萬戶。

同時,我們力求讓圖文具有「遊戲感」,解構傳統黨宣刻板印象,積極引入新思路與新技術,賦予黨宣新活力與新風貌。

06 滴滴出行

2020年度微信SVG互動排版案例TOP10!

開創性的背景滑動變色結構令人眼前一亮,同時也是基於認知工效學與色彩心理學研究可變背景下文字可讀性與情感暗示的一次前沿探索。

07 沙丘研究所

2020年度微信SVG互動排版案例TOP10!

與來自哈佛大學、麻省理工學院的藝術家合作完成的互動藝術裝置,每一次展示一種互動的方式的同時也在思考這種方式的能力。

08 悅遊

2020年度微信SVG互動排版案例TOP10!

公眾號生態下超文字敘事的一次大膽嘗試,共2個分支劇情15個分支結局,你的每次選擇都會帶來不同的反饋。正如互動影視逐漸成熟,我們堅信超文字敘事將是未來媒介發展的趨勢。

09 GQ實驗室

2020年度微信SVG互動排版案例TOP10!

包含「開門滑動」「前景滑動」「背景滑動」「漸變切圖」「長按鬆開」「伸長」「序列幀」等多種互動效果。

而點選對話方塊即可「輸入文字」傳送訊息,快來試試吧。

10 榮耀手機

2020年度微信SVG互動排版案例TOP10!

點選拍照即可獲取專屬聖誕老人,將「人們天生對隨機事物充滿好奇」的心理特性與產品賣點巧妙地結合了起來,新穎有趣。點選拍照即可獲取專屬聖誕老人,將「人們天生對隨機事物充滿好奇」的心理特性與產品賣點巧妙地結合了起來,新穎有趣。

微信SVG互動圖文創意開發;可跳轉公眾號:

「野生符號」

檢視最新互動式創意圖文案例。

TAG: 圖文互動滑動微信