《SVG撕拉片/拍立得/放映機/照片打印模版合集》
寶藏模版
E2 編輯器往期推薦（點擊閱讀）：
趣味效果｜高大上｜可愛風｜年終總結I｜年終總結II｜循環(huán)特效｜情人節(jié)I｜情人節(jié)II｜情人節(jié)IIII｜婦女節(jié)I｜婦女節(jié)II｜兒童節(jié)I｜兒童節(jié)II｜兒童節(jié)III｜兒童節(jié)IV｜618I｜618II｜父親節(jié)｜絲滑動畫｜端午節(jié)I｜端午節(jié)II｜端午節(jié)III｜滑動妙用｜圖片輪播I｜圖片輪播II｜又紅又專｜中秋節(jié)I｜中秋節(jié)II｜雙十一I｜雙十一II｜世界杯｜感恩節(jié)｜圣誕節(jié)I｜圣誕節(jié)II｜新年｜兔年春節(jié)｜元宵I ｜元宵節(jié)II｜愚人節(jié)I｜愚人節(jié)II｜雜志范兒｜520/521I｜520/521II｜520/521Ⅲ｜五一I｜五一II｜五一III｜母親節(jié)I｜母親節(jié)I｜母親節(jié)III｜多巴胺｜微博｜夏日氛圍｜大唐國風｜反詐宣傳｜七夕節(jié)｜CityWalk｜開學季II｜開學季II｜校園主題｜揭露丑惡真相｜運動會I｜運動會II｜十一｜萬圣節(jié)I｜萬圣節(jié)II｜冬季氛圍｜新聞宣傳｜春節(jié)紅包I｜春節(jié)紅包II｜龍年春節(jié)｜開工新品｜地球日｜問答題｜人工智能｜踏青出行｜五四青年節(jié)｜建黨日
各位 E2.COOL 的會員，編輯器內 1800+ 的 SVG 正版組件你們都用過嗎？當撕拉片的銀鹽在相紙上暈開褶皺，拍立得的白邊框住瞬間的呼吸，這些帶著膠片顆粒的時光碎片，或許也能以 SVG 的形式融入圖文設計中喔！
撕拉片/手帳翻頁效果
這是一種由著名交互設計師@計育韜 老師發(fā)明的互動特效，可最佳體現(xiàn)撕拉片的操作邏輯，點擊畫面右下角體驗：
以下提供「撕拉片/手帳翻頁」組件的排版布局示意，尤其注意「背面材質」應設計成撕拉片反面的負片效果，以更符合撕拉片操作時的實際體驗：
拍立得效果
在 E2 編輯器中同樣包含原生的「拍立得」SVG 模版，它是一種結合了 CSS 3D 傾斜的立體黑科技排版，點擊下方畫面體驗：
可以點擊《黑科技編輯器｜拍立得教程》查看其具體使用規(guī)則，照片素材本身無需傾斜。
照片連續(xù)打?。ㄒ来芜M場）
通過巧妙的布局組合，將「依次進場」與「浮層」疊加，我們就可以在 E2 編輯器中制作出了一臺連續(xù)打印機，點擊下方畫面體驗：
它的實際布局形式和組裝方法請參考：
連續(xù)撕紙
在 E2 編輯器中，「連續(xù)撕紙」也是處理連續(xù)畫面撕下效果的常用選擇：
照片跌落變化（單圖跌落）
除了連續(xù)的照片變化，E2 編輯器用戶也可以采用「單圖跌落」制作簡潔的照片切換 SVG。請點擊下方畫面感受：
在 E2.COOL 的組件搜索功能內查找「單圖疊落」組件即可使用！操作方法為「背景圖片」結合「單圖疊落」，且疊落動畫的速度、偏移量、方向均可自主通過速度控制器、自定義參數(shù)、篩選器調整。
如果想銜接伸長效果，那么也可以如喜茶《中秋禮盒預售｜偷顆月亮送給你》圖文案例，選擇「旋轉式撤場接伸長」SVG 模版銜接展開內容。
傾斜滑動
《生日快樂，我的黨！》將縱向滑動進行小角度 3D 傾斜，構成膠片的滑動質感：
在E2.COOL 中可以參考《黑科技編輯器｜傾斜跑道滑動（傾斜盒子）SVG教程》，利用「傾斜盒子」組件的 3D 能力旋轉滑動布局，由此產(chǎn)生案例中的效果，并可額外添加懸浮在表面的元素。這里推薦第三方制作的優(yōu)質教程以供參考。
放映機（排隊進場）
在 E2 編輯器中利用「排隊進場」SVG 組件可以產(chǎn)生長卷連續(xù)播放的效果：
這種類似放映機體驗的 SVG 黑科技排版，主要依托于對「浮層」組件的巧妙應用。只要設計素材得當，就能按如下排版形式實現(xiàn)：
照片畫廊（視差卡片/3D畫廊/全局視差）
利用 E2 編輯器強大的 3D 組件，我們還可以將照片懸停于立體空間中，隨滑動而差速移動。以下分別展示：
1）視差卡片布局｜E2 編輯器
2）3D畫廊｜E2 編輯器
3）全局視差｜E2編輯器
視差相冊（橫向/縱向）
這是一類 E2 編輯器經(jīng)典的獨家原創(chuàng) SVG 模版，你可以選擇橫向或縱向方式進行自由排列組合，滑動時主圖和縮略圖會形式呼應關系，差速移動：
在 E2.COOL 搜索功能內查找「視差相冊」組件即可使用！注意該組件偶發(fā)導入時圖片丟失問題，可參考《視差相冊替換圖片教程》解決。
滾動相冊
我們在《大開眼界：SVG輪播圖創(chuàng)意組合設計》還介紹過幾種在 E2 編輯器中 DIY 的滾動相冊組合方式：
通過「滾動廣告」、「分欄」等組件的巧妙復合，你就可以完全基于自己創(chuàng)作思路在編輯器內制作特色的照片相冊自動動畫。
相冊翻閱（翻頁定格）
如果你想重點聚焦相冊組中的某一張照片，那么還可以考慮以「翻頁定格」SVG 模板呈現(xiàn)，點擊下方右側畫面體驗：
此外還有更多翻頁模式可在 E2 編輯器中選擇使用：
黑科技編輯器 | 日歷翻頁教程
黑科技編輯器 | 計分牌翻頁教程
黑科技編輯器 | 雙面翻轉教程
黑科技編輯器｜雙面傾斜翻轉（左右）教程
黑科技編輯器｜翻花燈猜謎教程
黑科技編輯器 | 點擊翻頁-伸長教程
黑科技編輯器｜互斥翻牌教程
黑科技編輯器｜圖書翻頁接伸長
UGC 原創(chuàng)設計介紹｜手帳翻頁
三維六折頁
這是一款由著名交互設計師@2H 老師發(fā)明的高級感 3D 模版，隨滑動呈現(xiàn)出強烈的立體效果：
你可以在此基礎上添加懸浮的小圖、文案等信息，讓照片以折頁方式精美呈現(xiàn)。作為一款 UGC 組件，E2 平臺用戶可點擊該組件單獨購買，有效期為購買后一年時間。
鏡頭游走（任意點放大-消失）
《這次，就出發(fā)》以新春假期為契機，將全球風景與酒店廣告巧妙結合，形成鏡頭連續(xù)游走的感官：
這種在「舷窗-照片」直接的 SVG 穿梭效果的制作主要基于「任意點放大-消失」組件不斷疊加實現(xiàn)，這里推薦第三方制作的優(yōu)質教程以供參考。
當然在資深交互設計團隊手中，通過定制開發(fā)還能實現(xiàn)更令人嘆為觀止的鏡頭游走特效——參考案例《這是AI眼中，復旦大學的120年》。它由 JZ Creative Studio 結合 AIGC 創(chuàng)意設計，推薦咨詢微信 Zhuoya_Work 洽談深度合作。
更多海量模板，平均不足 1 元！
E2.COOL 秉持著讓行業(yè)“人均 SVG”的生態(tài)理念，由多位黑科技排版設計的頭部資深開發(fā)者共同打造，斬獲包括法國設計獎、美國繆斯創(chuàng)意設計獎等諸多國際賽事大獎，幫助更多品牌以可視化形式完成互動式圖文創(chuàng)作。如有任何特效靈感和建議，也歡迎通過客服向我們提出，E2 將竭誠思考代碼轉化的可行性。
E2 平臺官網(wǎng)
https://www.e2.cool/
會的比別人多一點
轉載請在文章開頭和結尾顯眼處標注：作者、出處和鏈接。不按規(guī)范轉載侵權必究。
未經(jīng)授權嚴禁轉載，授權事宜請聯(lián)系作者本人，侵權必究。
本文禁止轉載，侵權必究。
授權事宜請至數(shù)英微信公眾號(ID: digitaling) 后臺授權，侵權必究。
評論
評論
推薦評論
暫無評論哦，快來評論一下吧！
全部評論（0條）