HTML5多媒體作品以其對各種平臺的兼容而見長,目前已獲得了廣泛的應(yīng)用。如果我們需要制作自己的HTML5多媒體作品,一個(gè)方便之選就是利用現(xiàn)成的在線制作工具“百度H5”。
首先訪問“百度H5”網(wǎng)頁(https://h5.baidu.com/),可以看到非常簡單的頁面,僅有“我的H5”和“我的模板”兩個(gè)選項(xiàng)。其中“我的模板”是通過套用模板的方式來制作HTML5作品,而“我的H5”則可以完全靠自定義各種參數(shù)來自由創(chuàng)作,制作好的作品也會(huì)顯示在這里(圖1)。

1. 通過創(chuàng)意模板輕松制作
在首頁中選擇“我的模板”,隨后會(huì)進(jìn)入一個(gè)模板展示頁面,這些都是設(shè)計(jì)者們分享的模板。根據(jù)你所要設(shè)計(jì)的作品的類別,可以按類選擇一個(gè)類似的作品作為制作的模板,然后在此基礎(chǔ)上進(jìn)行修改,即可快速形成自己的多媒體作品(圖2)。

比如要制作一個(gè)招生方面的媒體作品,選擇如圖所示的秋季班招生模板,然后點(diǎn)擊右下角的“使用模板”按鈕(圖3)。

接下來先要為作品命名,例如“我們的幼兒園招生了”。輸入完畢點(diǎn)擊“確定”按鈕(圖4)。

隨后進(jìn)入實(shí)質(zhì)性的模板修改編輯階段。對于不合適的內(nèi)容,可先刪除頁面元素再添加。點(diǎn)擊“文本”菜單插入所需文本內(nèi)容。同理,可使用右邊的“媒體”按鈕插入圖片、音頻、視頻、嵌入視頻、全景圖等內(nèi)容。如果是PSD圖片,則直接用PSD菜單載入。若版面中需要插入一些圖標(biāo)或形狀,則點(diǎn)擊“圖形”菜單選擇添加(圖5)。

此外,對于作品中所要用到的展示數(shù)據(jù),可以通過插入圖表、表單等方式,非常輕松地完成數(shù)據(jù)展示制作(圖6)。如果要實(shí)現(xiàn)更多的效果,可通過“插件”菜單,選擇添加頁面加載套件和加載進(jìn)度、添加計(jì)數(shù)器、添加幀動(dòng)畫、添加相冊或地圖等。

對于需要修改的屬性,可通過窗口右側(cè)的分類屬性窗口選擇設(shè)置。通過窗口下方的編輯區(qū)域,可控制動(dòng)畫、加載頁、全局全景和背景、當(dāng)前頁等參數(shù)設(shè)置。例如,要定制個(gè)性化的加載頁面效果,點(diǎn)擊“加載頁”選項(xiàng)卡,然后通過下方的滑塊,對加載頁中的圖片和進(jìn)度進(jìn)行自定義編輯(圖7)。

對頁面上的各種元素進(jìn)行修改和編輯完成之后,點(diǎn)擊工具欄左上角的磁盤按鈕將作品保存在網(wǎng)上。注意,編輯過程中產(chǎn)生的內(nèi)容軟件會(huì)自動(dòng)保存,但為了防止丟失,還是要養(yǎng)成勤于手動(dòng)保存的習(xí)慣。
最后,就可以發(fā)布作品了。點(diǎn)擊工具欄上的“發(fā)布”按鈕執(zhí)行發(fā)布操作(圖8)。

由于作品是保存在網(wǎng)絡(luò)服務(wù)器中的,因此作品的共享是以網(wǎng)址的形式體現(xiàn)的。發(fā)布時(shí)要填寫作品分享的標(biāo)題,設(shè)置個(gè)人域名。我們只需在“個(gè)性化域名”中填寫自己命名的作品個(gè)性域名地址,發(fā)布后其他人就可以用這個(gè)域名來訪問HTML5作品了(圖9)。

小提示:使用上述服務(wù)需要使用自己的百度賬號登錄。為維護(hù)網(wǎng)絡(luò)安全,目前發(fā)布信息需先經(jīng)過用戶實(shí)名制認(rèn)證方可進(jìn)行。
2. DIY 完全自己設(shè)計(jì)制作
套用模板適合于初學(xué)者或設(shè)計(jì)能力不強(qiáng)的用戶。其實(shí),不用套用模板,完全可以從頭全部由自己來設(shè)計(jì)作品。

制作時(shí),在主頁中選擇“我的H5”,然后點(diǎn)擊空白頁上印有圓圈套加號圖標(biāo)的按鈕,向?qū)?huì)詢問創(chuàng)建什么樣的布局。從“分頁布局”或“整頁布局”中選擇一種布局方式。如果是分頁布局,則依靠頁面間的前后滑動(dòng)實(shí)現(xiàn)簡單跳轉(zhuǎn);如果是整頁布局,則將整個(gè)頁面分為不同區(qū)域,各部分還可創(chuàng)建鏈接,實(shí)現(xiàn)不同的功能(圖10)。
隨后其他步驟與第1部分的添加和設(shè)置操作方法相當(dāng),只是全要親自設(shè)計(jì),不能套用現(xiàn)成的組件而已。在創(chuàng)作過程中,只要善于使用系統(tǒng)提供的文本工具編排文字內(nèi)容,用媒體和圖形工具添加圖片、圖形、音視頻,數(shù)據(jù)相關(guān)的內(nèi)容使用圖表、表單等工具,借助于“插件”擴(kuò)展來補(bǔ)充完善,發(fā)揮自由想象的創(chuàng)作空間,一定能創(chuàng)作出更具個(gè)性化的作品。
|