打分、劃重點、字幕滾動……這種巧妙的模擬式排版怎么做的？
要是咱們希望制作出的圖文不復雜但又有意思，不妨轉換一下思路，把生活中常見的一些操作搬進給圖文里。
但想要在圖文中通過排版模擬日常生活中習以為常的效果，會不會很難哇？
今天給大家舉3個有趣好玩的小例子就知道了，分別為：打分、劃重點、字幕滾動
3個案例分別來自用我要WhatYouNeed、戴爾、我是FARMER BOB 3個公眾號。
下面一起簡單拆解一下。
一
模擬評分
*素材來自我要WhatYouNeed《好人微瑕，我們都做過的26件壞事。》
將前景中的星星區域做成鏤空的，背景中設計填充星星的顏色，這樣「背景右滑」就可以讓用戶在微信文章中為不同的行為打分。
素材如下：
該效果可使用 iPaiban Pro 黑科技編輯器中的「雙層滑動-背景右滑」組件（編號：10140）制作。
前景和背景圖片上傳如下：
想要實現同款效果可以在編輯器（SVG.iPaiban.com）搜索使用：
組件：雙層滑動-背景右滑
編號：10140（組件）
二
模擬劃重點
*素材來自戴爾《Buff疊滿，戴爾官網福利真的強！》
換個思路，還是雙層圖片，這次是背景不動，前景滑動。
在前景的重要文字處做鏤空效果，在背景圖的相應設計彩色的顏色條，這樣在滑動過程中前景圖鏤空處就有了色彩的變化。
素材如下：
該效果使用 iPaiban Pro 黑科技編輯器中的「雙層滑動-前景左滑」組件（編號：10018）即可制作。
選擇組件后，在頁面右側依次點擊「換圖」和「+」號上傳準備好的圖片素材。滑動圖尺寸和底圖保持一致，本文案例中的素材上傳效果如下：
想要實現同款效果可以在編輯器（SVG.iPaiban.com）搜索使用：
組件：雙層滑動-前景左滑
編號：10018（組件）
三
模擬電影結尾字幕滾動
*素材來自我是FARMER BOB《新品｜以搖滾之名，與BOB一起高唱浪漫的詩》
自動向上滾動播放不同的名字。簡單的效果賦予了推文如同電影般的儀式感。
這個效果由3層圖片組成：背景層、中間層和前景層。
前景層的滾動圖是多張圖拼接而成的，需要使用 iPaiban Pro 黑科技編輯器中的「自動-向上滾動條」組件（編號：10891），支持設置滾動時間。
固定不動的背景和前景圖，分別使用「零高圖片」組件（編號：10224）和「遮罩」組件（編號：10829）進行配置。
3個組件的放置順序如下，然后分別上傳準備好的圖片素材即可。每層圖片尺寸都保持一致。
想要實現同款效果可以在編輯器（SVG.iPaiban.com）搜索使用：
組件：自動-向上滾動條
編號：10891（組件）
組件：零高圖片 | 萬能背景圖
編號：10224（組件）
組件：遮罩
編號：10829（組件）
制作SVG交互圖文認準 iPaiban Pro 黑科技編輯器，網址：SVG.iPaiban.com，復制網址在 PC 端 Chrome（谷歌）瀏覽器打開，即可注冊，編輯器所有組件/組合現已全部支持免費試用了。
轉載請在文章開頭和結尾顯眼處標注：作者、出處和鏈接。不按規范轉載侵權必究。
未經授權嚴禁轉載，授權事宜請聯系作者本人，侵權必究。
本文禁止轉載，侵權必究。
授權事宜請至數英微信公眾號(ID: digitaling) 后臺授權，侵權必究。
評論
評論
推薦評論
暫無評論哦，快來評論一下吧！
全部評論（0條）