新華社公眾號中國航天日推文怎么做的？
如何利用135編輯器的SVG編輯器功能，無需任何代碼知識，也能制作出新華社刷屏朋友圈的雙層上滑視差滑動效果。本教程詳細指導您如何上傳素材圖、調(diào)整滑動速度和位置，以及如何將炫酷的交互效果同步至微信公眾號后臺。無論是設計新手還是老手，都能快速上手，創(chuàng)造出沉浸式閱讀體驗。抓住五一特惠，立即動手實踐，讓你的公眾號文章脫穎而出！
朋友們大家好，我是三兒
前兩天是中國航天日。
相信不少朋友被新華社這篇推文刷屏了??
??點擊遙遠璀璨星空
有朋友搶答道：這不是三兒之前給大家講過成都發(fā)布利用三層上滑，完成了一篇科技感十足的【流浪地球】嗎??點我回顧
不過當你仔細對比后，你就能發(fā)現(xiàn)新華社這篇文章和成都發(fā)布還是有差異的。
新華社沒有中間固定圖，他只有背景和前景圖所以他只是一個雙層上滑，加上滑動時每個前景圖在滑動過程中視覺上更有立體感，閱讀沉浸體驗更佳，所以新華社這篇文章本質(zhì)上是使用了視差滑動和成都發(fā)布的三層滑動是有質(zhì)的區(qū)別的。
前面鋪墊了這么多，相信大家迫切想要知道這個炫酷的效果如何制作？
那咱們閑話少敘，進入今天的重頭戲。
在135編輯器左側(cè)找到【SVG編輯器】
我們可以搜索：背景雙層變速視差滑動（豎向）或是組件ID：267
在使用組件前，我們一定要記得先看看素材要求，這樣在作素材圖的時候就能按照要求制作，也能避免后續(xù)因為素材原因返工。
這里我們借用新華社的圖為例，我們利用135插件提取文章素材（注意：提取別人素材僅作教學使用，不能擅自商用！?。。?/span>
根據(jù)素材圖，我們能很輕松找到背景圖，是由璀璨星空點綴的黑色背景圖。
我們在SVG編輯器中上傳背景圖。
接下來就添加滑動畫面，每一屏添加的素材內(nèi)容數(shù)量視情況而定，你可以添加3-5個素材然后多添加幾個滑動畫面，也可以在一個滑動畫面中多添加幾個素材，這個沒有固定要求。
*不過并不建議大家圖方便把所有素材放在一個滑動畫面中，拆分越細，效果越佳。
上傳好滑動圖后，就需要調(diào)整各個滑動圖之間滑動速度，位置。
接下來就是不斷地重復這個工作，上傳圖片，調(diào)整滑動速度，以及素材之間的位置，這是一個非?？简災托牡倪^程，因為每一次調(diào)整最后的呈現(xiàn)效果都可能不同，我們多一點耐心，多一點嘗試，最后就能讓素材呈現(xiàn)效果達到完美。
在制作完成后，我們就可以選擇【同步】到微信公眾號后臺，或者【導出】到135編輯器。
三兒說：
不少朋友看了，給三兒反饋：你這個看起來是【設計】難度更大呀，反而操作難度降低了，可是親愛的朋友你有沒有想過，正因為135編輯器將交互效果制作成組件，降低了操作難度0代碼，能讓所有朋友都快速上手，過去要操心圖片素材，效果制作現(xiàn)在只需要完成素材，整個交互效果的制作自己就能輕松搞定，再也不用去找人幫忙完成交互效果了。正因為整個交互操作變得簡單了讓大家漸漸忽略了它，這正是我們135SVG編輯器的初衷，讓人人都能輕松完成SVG交互排版。
以上就是本次
新華社視差滑動的全部內(nèi)容了
相信聰明的你已經(jīng)學會了
眼睛學會了
記得要動手練練哦
五一將至
三兒也準備了五一特惠好禮
可別錯過哦
立即登錄
