《2024年10月品牌SVG交互圖文Top30》
在剛剛過去的2024年10月，有哪些值得關(guān)注的優(yōu)秀SVG交互圖文？
今天為大家整理10篇10月的優(yōu)秀SVG交互圖文，分別來自中科院之聲、央視新聞、人民日?qǐng)?bào)、波司登、長(zhǎng)安汽車、新世相、百達(dá)翡麗Patek Philippe、阿斯頓馬丁中國、NewBalance中國、HERMES，這些使用了交互效果的圖文不僅讓人眼前一亮，更是讓數(shù)據(jù)得到有效提升！
往期月份：9月Top30 | 8月Top30 | 7月Top30 | 6月Top30 | 5月Top30 | 4月Top30 | 3月Top30 | 2月Top30 | 1月Top30
01
中科院之聲
《六十載豐碑永存！今天，向他們致敬！》
▲GIF演示
在中國第一顆原子彈爆炸60周年紀(jì)念日，中科院通過「自動(dòng)展開」和「SVG軌跡移動(dòng)」相結(jié)合的交互徐徐展開長(zhǎng)圖，為大家講解“兩彈一星”的故事，借此傳承并弘揚(yáng)“兩彈一星”精神和科學(xué)家精神。
該交互需定制
02
央視新聞
《今天，我們一起升國旗》
▲GIF演示
絕大多數(shù)人都沒機(jī)會(huì)升國旗，央視新聞在圖文用「點(diǎn)擊播放音頻同時(shí)圖片移動(dòng)」的交互排版模擬奏國歌升國旗，在國慶節(jié)這天滿足了大家的愿望，激發(fā)大家的愛國熱情。
該交互需定制
03
人民日?qǐng)?bào)
《喜歡你！》
▲GIF演示
人民日?qǐng)?bào)用「三層穿透式滑動(dòng)」的交互向祖國表達(dá)愛意。三層內(nèi)容，中間的愛心不動(dòng)，前景和背景跟隨手指的滑動(dòng)而移動(dòng)，在滑動(dòng)過程中，愛心不斷與前景內(nèi)容形成各種互動(dòng)。
交互對(duì)應(yīng)編輯器組件/組合
組件：三層滑動(dòng)-上滑(多張)
編號(hào)：10803（組件）
04
波司登
《感謝寒冷｜走進(jìn)風(fēng)雪，奏響極地之歌》
▲GIF演示
「點(diǎn)擊播放SVG軌跡移動(dòng)動(dòng)畫」依次帶大家回顧中國極地考察40周年歷程尋跡極地探索背后的故事，借此宣傳波司登品牌服裝，吸引讀者前往購買。
該交互需定制
05
長(zhǎng)安汽車
《第四屆長(zhǎng)安汽車科技生態(tài)大會(huì)到底講了什么？》
▲GIF演示
「點(diǎn)擊切換」后「自由滑動(dòng)」帶大家查看新汽車新生態(tài)，借此宣傳長(zhǎng)安汽車的各個(gè)細(xì)節(jié)與創(chuàng)意。
該交互需定制
06
新世相
《建議你在萬圣節(jié)穿這個(gè)去上班：》
▲GIF演示
新世相通過引導(dǎo)大家「點(diǎn)擊答題」的交互方式吸引讀者參與調(diào)查問卷，最后生成年度人物，吸引大家測(cè)試并傳播。
該交互需定制
07
百達(dá)翡麗Patek Philippe
《首發(fā) | 大方無隅》
▲GIF演示
「自動(dòng)播放GIF后消失展開」百達(dá)翡麗Patek Philippe的全新手表的細(xì)節(jié)與創(chuàng)意，「點(diǎn)擊切換選擇」查看不同款式的腕表，借此吸引讀者前往購買。
交互對(duì)應(yīng)編輯器組件/組合
組合：自動(dòng)消失+展開
編號(hào)：11887（組合）
組合：無限選擇切換內(nèi)容(三組)
編號(hào)：11707（組合）
08
阿斯頓馬丁中國
《請(qǐng)進(jìn)，阿斯頓·馬丁影院》
▲GIF演示
「點(diǎn)擊展開」介紹阿斯頓馬丁汽車的各個(gè)細(xì)節(jié)，「點(diǎn)擊橫向展開」DB12《金手指》版汽車，借此吸引讀者賞車預(yù)約。
交互對(duì)應(yīng)編輯器組件/組合
組合：點(diǎn)擊展開(可嵌套展開)
編號(hào)：10875（組合）
組合：點(diǎn)擊-橫向展開
編號(hào)：11501（組合）
09
NewBalance中國
《niko and ... 合作系列鞋款全新上市》
▲GIF演示
New Balance通過「左滑」展示和niko and ...攜手推出的全新合作系列鞋款，借此宣傳New Balance，吸引讀者前往購買。
交互對(duì)應(yīng)編輯器組件/組合
組合：長(zhǎng)屏左滑組合(自動(dòng)對(duì)齊)
編號(hào)：10868（組合）
組件：點(diǎn)擊-圖片放大
編號(hào)：11365（組件）
10
HERMES
《尋找埃米爾·愛馬仕的珍藏》
▲GIF演示
愛馬仕通過「長(zhǎng)按」的交互模擬觸發(fā)線索，一探愛馬仕之物的究竟，借此宣傳HERMES，吸引更多客戶購買愛馬仕之物。
交互對(duì)應(yīng)編輯器組件/組合
組件：長(zhǎng)按-長(zhǎng)按淡入,松手淡出
編號(hào)：10026（組件）
如果以上案例還沒有看夠，可以到「品牌時(shí)光機(jī)」交互圖文案例庫（網(wǎng)址：brandtime.cn）中點(diǎn)擊「時(shí)間篩選」選擇「2024年10月」查看更多相關(guān)案例。
目前案例庫總案例數(shù)已達(dá)70W+，其中7W+案例支持一鍵還原，制作同款效果非常方便。
轉(zhuǎn)載請(qǐng)?jiān)谖恼麻_頭和結(jié)尾顯眼處標(biāo)注：作者、出處和鏈接。不按規(guī)范轉(zhuǎn)載侵權(quán)必究。
未經(jīng)授權(quán)嚴(yán)禁轉(zhuǎn)載，授權(quán)事宜請(qǐng)聯(lián)系作者本人，侵權(quán)必究。
本文禁止轉(zhuǎn)載，侵權(quán)必究。
授權(quán)事宜請(qǐng)至數(shù)英微信公眾號(hào)(ID: digitaling) 后臺(tái)授權(quán)，侵權(quán)必究。
評(píng)論
評(píng)論
推薦評(píng)論
暫無評(píng)論哦，快來評(píng)論一下吧！
全部評(píng)論（0條）