教程:0基礎(chǔ),三分鐘把文字變成炫酷動(dòng)畫(huà)

如果一個(gè)頁(yè)面上,文字遠(yuǎn)多于圖片,怎么才能讓整個(gè)構(gòu)成看起來(lái)不那么死板呢?

其實(shí)只要讓文字動(dòng)起來(lái)就ok啦~

錄屏沒(méi)有真實(shí)效果好,真正做完以后,盡享絲~滑~哦~

依然是0基礎(chǔ),不用下載軟件,一起在網(wǎng)頁(yè)做一份這樣的H5吧!【初心小太陽(yáng)出品~】

step1

首先,打開(kāi)自己習(xí)慣的H5制作工具。我一般用電腦自帶的wps H5,所以就用這個(gè)演示。大家隨意選擇習(xí)慣的就好,大同小異哈。

然后插入這樣一張圖:

并將背景調(diào)整為圖片底色:

RGB模式:2/9/27

得到如下圖片:

step2

將文案插入H5中,每句都要用一個(gè)單獨(dú)的文本框哦!


step3

到這里,頁(yè)面排版就結(jié)束了,開(kāi)始設(shè)置動(dòng)畫(huà)。

①將插入的圖片設(shè)置為:【縮小】 ? 開(kāi)始時(shí)間0.4,其他默認(rèn):

②【圓潤(rùn)有型·自如隨心】這句大標(biāo)題,動(dòng)畫(huà)設(shè)置為【從上淡入】,【與上一動(dòng)畫(huà)同時(shí)】,開(kāi)始時(shí)間0.6,持續(xù)時(shí)間2:

③將文案小字的第一行,動(dòng)畫(huà)設(shè)為【從下淡入】,【與上一動(dòng)畫(huà)同時(shí)】,開(kāi)始時(shí)間0.6,持續(xù)時(shí)間2

接下來(lái)的每行文案,其他項(xiàng)不變,開(kāi)始時(shí)間比上一行+0.2


ok,到這里就結(jié)束了,點(diǎn)擊預(yù)覽,看看是不是生成了絲滑的字幕文案呢?

如果喜歡,就贊一個(gè)吧~

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書(shū)系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • Android 自定義View的各種姿勢(shì)1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 178,820評(píng)論 25 709
  • 發(fā)現(xiàn) 關(guān)注 消息 iOS 第三方庫(kù)、插件、知名博客總結(jié) 作者大灰狼的小綿羊哥哥關(guān)注 2017.06.26 09:4...
    肇東周閱讀 15,087評(píng)論 4 61
  • 用Adobe的各種神器做動(dòng)圖這事兒,對(duì)我來(lái)說(shuō)實(shí)在有點(diǎn)難。所以說(shuō)如果制作簡(jiǎn)單又酷炫的動(dòng)圖,我一般都用H5。 今天想給...
    虎喵君閱讀 4,202評(píng)論 44 131
  • 停電停水,縫好沙包就去圖書(shū)館了,估計(jì)10點(diǎn)多到的。好喜歡圖書(shū)館,自由自在??磩⒂陆o的古典的那本《你的生命有什么可能...
    summerlight閱讀 354評(píng)論 0 0
  • 1. 最近,有位明星演員請(qǐng)兩位女粉絲吃飯,其中一位莫名其妙就火了。 細(xì)看才知道,原來(lái)她可不是簡(jiǎn)單的追星粉,而是江湖...
    西海跳蛙閱讀 392評(píng)論 0 4

友情鏈接更多精彩內(nèi)容