地球上最無厘頭腦洞SVG交互圖文，們！
莫名其妙，又極致上癮……本期為大家?guī)戆ㄓ晌覀兘桓兜亩嗫?SVG 交互設(shè)計(jì)領(lǐng)域無厘頭腦洞創(chuàng)意作品介紹。這里是 JZ Creative Studio，中華人民共和國《融媒體 SVG 交互設(shè)計(jì)技術(shù)規(guī)范》起草單位之一，Social Beta 年度四大 SVG 交互設(shè)計(jì)廠牌，也歡迎接洽（WeChat：Zhuoya_Work）咨詢更多合作事宜。
1.敲木魚
釘釘 x JZCreative《電子木魚》
《???? 電 子 木 魚 . e x e》可能是新年微信紅包封面最無厘頭的發(fā)放形式，連續(xù)擊打畫面中的釘釘 IP 頭像，可不斷彈出 +1 提示和文案，經(jīng)過極多次點(diǎn)擊后才能最終展示出紅包封面入口。該作中我們核心采用了 <touchstart> 與 <click> 雙層觸發(fā) SVG 機(jī)制，由此實(shí)現(xiàn)了木魚的無限打擊反饋和下層內(nèi)容連續(xù)切換。此后我們還與 M Stand 合作《工作壓力大？進(jìn)來「捶捶」樂一下！限定周邊福利套餐》，在開場部署連續(xù)敲錘交互：
M Stand x JZCreative《錘錘樂》
因而，包括敲鼓、拍球等均可通過該 SVG 形式轉(zhuǎn)化，歡迎通過（WeChat：Zhuoya_Work）咨詢定制設(shè)計(jì)與開發(fā)。
2.捏泡泡
網(wǎng)易《絕 對 の 無 聊 挑 戰(zhàn)》
泡泡紙都捏過嗎？網(wǎng)易《絕 對 の 無 聊 挑 戰(zhàn)》在 2019 年率先將這種生活中的既無趣又有趣的互動搬到了公眾號 SVG 交互設(shè)計(jì)的舞臺之上。其布局方式甚是簡單，但效果可謂出奇制勝，大量的點(diǎn)擊切換平鋪堆疊，彩蛋無處不在。同理，近期《「送你一張泡泡紙」》亦如是：
局部氣候調(diào)查組《送你一張泡泡紙》
關(guān)于這種簡單粗暴的大量點(diǎn)擊切換布局，你可以基于 E2 編輯器的分欄和切換型 SVG 特效進(jìn)行高效排版。
3.割韭菜
局部氣候調(diào)查組 x JZCreative《韭菜的一生》
在《韭菜的一生大約可以被收割50次》中，我們通過 discrete 值的 calcMode 位移，實(shí)現(xiàn)可重復(fù)執(zhí)行的序列動畫，將韭菜的快速重復(fù)生長特性淋漓盡致展現(xiàn)，歡迎通過（WeChat：Zhuoya_Work）咨詢定制設(shè)計(jì)與開發(fā)。
4. 鯊魚玩具
橡子屋 x JZCreative《鯊魚玩具》
前不久，我們創(chuàng)造性地以音畫同步開發(fā)策略，將童年陰影鯊魚牙齒玩具復(fù)現(xiàn)在公眾號圖文內(nèi)?！?a target="_blank" textvalue="???? 鯊 魚 玩 具.svg" linktype="text" imgurl="" imgdata="null" data-itemshowtype="0" tab="innerlink" class="normal_text_link" data-linktype="2">???? 鯊 魚 玩 具.svg》不僅每次刷新頁面 SVG 都會隨機(jī)鎖定結(jié)果，還能在按下牙齒時播放機(jī)關(guān)音效，交互結(jié)果頁自然引導(dǎo) APP 廣告，著實(shí)妙趣橫生。
5.消消樂
JZCreative《麻將消消樂》
過年期間，計(jì)育韜老師結(jié)合麻將消消樂的游戲概念，基于 SVG 行業(yè)前沿的 mouseover/mouseout 組合技術(shù)，打造了公眾號圖文版 SVG 消消樂完美運(yùn)行邏輯《?????麻將消消消消消消消消消消消消消消樂》。目前該 SVG 特效也同步上架了 E2 編輯器《UGC 原創(chuàng)設(shè)計(jì)介紹｜消消樂》，開發(fā)者也可以通過我們的視頻課學(xué)習(xí)其關(guān)鍵 SVG 代碼技術(shù)：
6.塞爾達(dá)傳說、魷魚游戲、開端等劇情復(fù)現(xiàn)
JZCreative《塞爾達(dá)傳說》
作為塞爾達(dá)系列愛好者，JZ Creative Studio 曾將荒野之息和王國之淚兩作的所有無厘頭梗集中在一篇公眾號 SVG 交互圖文中，推出《點(diǎn) 開 即 玩 ← ↑ → ↓ 塞 爾 達(dá) 傳 說》。具有挑戰(zhàn)性的是，我們決定采用中國三大 SVG 編輯器之一的 E2 編輯器（https://www.e2.cool/）完全零代碼開發(fā)，獲得了極佳的創(chuàng)作成果！
我們也結(jié)合過《魷魚游戲》，設(shè)計(jì)了將經(jīng)典闖關(guān)融入 SVG 交互的黑科技排版作品《????點(diǎn)開即玩????魷魚游戲????》：
JZCreative《魷魚游戲》
以及循環(huán)流電視劇《開端》的公交車劇情 SVG 復(fù)現(xiàn)《????點(diǎn)開即玩????№45公交車????》：
JZCreative《№45公交車》
可見對于藝術(shù)/游戲/影視等作品的推廣，也可以結(jié)合 SVG 演繹劇情來在推廣中提升用戶的參與感。歡迎通過（WeChat：Zhuoya_Work）咨詢定制設(shè)計(jì)與開發(fā)。
那么，你還想讓 JZ Creative Studio 來實(shí)現(xiàn)哪些無厘頭創(chuàng)意的 SVG 互動體驗(yàn)？歡迎在文末評論區(qū)留言你的愿望！
轉(zhuǎn)載請?jiān)谖恼麻_頭和結(jié)尾顯眼處標(biāo)注：作者、出處和鏈接。不按規(guī)范轉(zhuǎn)載侵權(quán)必究。
未經(jīng)授權(quán)嚴(yán)禁轉(zhuǎn)載，授權(quán)事宜請聯(lián)系作者本人，侵權(quán)必究。
本文禁止轉(zhuǎn)載，侵權(quán)必究。
授權(quán)事宜請至數(shù)英微信公眾號(ID: digitaling) 后臺授權(quán)，侵權(quán)必究。
評論
評論
推薦評論
暫無評論哦，快來評論一下吧！
全部評論（0條）