《H5制作》課件-5.H5的設(shè)計(jì)與制作流程

第5講H5的設(shè)計(jì)與制作工具H5的元素設(shè)計(jì)工具PARTONE功能強(qiáng)大的設(shè)計(jì)工具——PhotoshopPhotoshop簡(jiǎn)稱(chēng)“PS”，它是平面設(shè)計(jì)、建筑裝修設(shè)計(jì)、三維動(dòng)畫(huà)制作、網(wǎng)頁(yè)設(shè)計(jì)的必備軟件之一，具有使用方便、功能強(qiáng)大的特點(diǎn)，可以高效地進(jìn)行圖片處理與制作。A常用來(lái)制作H5頁(yè)面中的視頻、音頻和簡(jiǎn)單的動(dòng)效等內(nèi)容。簡(jiǎn)稱(chēng)“AI”，它是一款矢量繪畫(huà)軟件，具有矢量動(dòng)畫(huà)設(shè)計(jì)、頁(yè)面設(shè)計(jì)、網(wǎng)站制作、位圖編輯和網(wǎng)頁(yè)動(dòng)畫(huà)制作等多種功能，適合設(shè)計(jì)小型項(xiàng)目或大型的復(fù)雜項(xiàng)目。專(zhuān)業(yè)的矢量圖繪制工具——Illustrator廣告設(shè)計(jì)商標(biāo)設(shè)計(jì)網(wǎng)頁(yè)制作排版輸出插圖繪制AfterEffects：簡(jiǎn)稱(chēng)“AE”，是一款圖形視頻處理軟件，具有視頻處理、動(dòng)畫(huà)制作、多層剪輯等多種功能?？犰乓曨l特效制作工具——AfterEffects酷炫視頻特效制作工具——AfterEffects幫助用戶(hù)高效且精確地創(chuàng)建動(dòng)態(tài)圖形和動(dòng)畫(huà)特效。與其他Adobe軟件可完成2D和3D合成，以及動(dòng)畫(huà)的特效制作。常用AE進(jìn)行酷炫視頻特效的制作，使整個(gè)頁(yè)面更具動(dòng)感，更吸引用戶(hù)注意。A使用及特點(diǎn)音效設(shè)計(jì)制作工具——Audition即AdobeAudition，是多音軌編輯工具，支持128條音軌、多種音頻格式和特效，并且可對(duì)音頻文件進(jìn)行修改、合并。功能強(qiáng)大，可輕松創(chuàng)建音樂(lè)、制作廣播短片等音頻的錄制音頻的混合音頻的編輯音頻的裁剪音頻的合成H5的動(dòng)效設(shè)計(jì)工具PARTTWOMAKA（碼卡）是一款H5在線(xiàn)創(chuàng)作及創(chuàng)意工具，使用該工具可進(jìn)行形象宣傳、活動(dòng)邀請(qǐng)、產(chǎn)品展示、活動(dòng)報(bào)名等方面的設(shè)計(jì)。定制推廣H5制作工具——MAKAMAKA的模板商城提供了針對(duì)不同行業(yè)和場(chǎng)景的模板，同時(shí)提供視頻、新媒體、電商等不同類(lèi)型的素材供用戶(hù)使用。MAKA（碼卡）定制推廣H5制作工具——MAKAMAKA的模板商城支持翻頁(yè)H5、長(zhǎng)頁(yè)H5、手機(jī)海報(bào)、視頻、公眾號(hào)、微信紅包封面、簡(jiǎn)歷、畫(huà)冊(cè)、微信朋友圈、社交名片等內(nèi)容的在線(xiàn)創(chuàng)作功能；用戶(hù)只需簡(jiǎn)單拖曳即可完成邀請(qǐng)函、促銷(xiāo)廣告、活動(dòng)宣傳、招聘招生、節(jié)日賀卡等H5的設(shè)計(jì)。H5企業(yè)營(yíng)銷(xiāo)H5制作工具——易企秀輕設(shè)計(jì)互動(dòng)視頻易企秀是一款基于智能內(nèi)容創(chuàng)意設(shè)計(jì)的數(shù)字化營(yíng)銷(xiāo)工具。長(zhǎng)頁(yè)易表單支持PC、App、小程序等多種端口的使用主要用于：易企秀操作簡(jiǎn)單，只需使用模板或素材添加即可制作各種形式的創(chuàng)意作品，并支持快速分享到社交媒體平臺(tái)開(kāi)展?fàn)I銷(xiāo)活動(dòng)。可用于企業(yè)活動(dòng)邀約、品牌宣傳、數(shù)據(jù)搜集、電商促銷(xiāo)、人才招聘等多媒體多場(chǎng)景的音效需求。企業(yè)營(yíng)銷(xiāo)H5制作工具——易企秀快速制作H5工具——兔展定位普通用戶(hù)，是微信H5頁(yè)面、微場(chǎng)景、微頁(yè)、微雜志、微信邀請(qǐng)函、場(chǎng)景應(yīng)用的專(zhuān)制作工具。A兔展A少部分模板免費(fèi)，大部分模板需要付費(fèi)購(gòu)買(mǎi)。注意微場(chǎng)景H5制作工具——人人秀人人秀是一款基于H5的微場(chǎng)景制作工具，具有免費(fèi)、簡(jiǎn)單易用、發(fā)布迅速等特點(diǎn)。A人人秀功能和模板比較單一，適合初學(xué)者使用照片故事H5制作工具——初頁(yè)邀請(qǐng)函微信公號(hào)歡迎頁(yè)電視電影初頁(yè)是一款面向個(gè)人用戶(hù)的H5設(shè)計(jì)工具，其作品可在微信、微博、移動(dòng)端社交媒體展示與傳播。團(tuán)隊(duì)照片頁(yè)新品發(fā)布海報(bào)普通用戶(hù)可用來(lái)制作生活旅行、偶像海報(bào)、微雜志、生日賀卡、周年紀(jì)念冊(cè)、喜帖等內(nèi)容。H5的創(chuàng)意開(kāi)發(fā)工具PARTTHREE專(zhuān)業(yè)H5工具——意派Epub360意派Epub360是一款專(zhuān)業(yè)級(jí)H5制作工具。A豐富的動(dòng)畫(huà)設(shè)定B觸發(fā)器設(shè)定功能C強(qiáng)大的交互作用專(zhuān)業(yè)H5工具——意派Epub360全景360拖曳交互搖一搖手勢(shì)促發(fā)畫(huà)板涂鴉畫(huà)中畫(huà)一鏡到底關(guān)聯(lián)控制重力感應(yīng)碰撞檢測(cè)意派Epub360功能組件設(shè)計(jì)人員可以自由制作H5互動(dòng)游戲和多種場(chǎng)景宣傳，適合企業(yè)設(shè)計(jì)人員、新媒體運(yùn)營(yíng)、市場(chǎng)營(yíng)銷(xiāo)等用戶(hù)。一個(gè)生動(dòng)的H5頁(yè)面，應(yīng)具有一定的動(dòng)畫(huà)展示。意派Epub360除了提供基本的動(dòng)畫(huà)展示外，還支持路徑動(dòng)畫(huà)、序列幀動(dòng)畫(huà)、組合動(dòng)畫(huà)等方式。動(dòng)畫(huà)展示01意派Epub360針不同的模板，提供高度自由度的交互設(shè)計(jì)。針對(duì)不同模板，提供高自由度的交互設(shè)計(jì)，如頁(yè)面觸發(fā)、組件觸發(fā)、動(dòng)畫(huà)觸發(fā)、手勢(shì)及搖一搖觸發(fā)等交互，增強(qiáng)用戶(hù)的交互體驗(yàn)。觸發(fā)交互02專(zhuān)業(yè)H5工具——意派Epub360意派Epub360支持微信高級(jí)接口，支持微信拍照、錄音、身份認(rèn)證等功能，可提升用戶(hù)的參與感，增加互動(dòng)性。用戶(hù)互動(dòng)03支持參數(shù)賦值、交互式表單、評(píng)論、投票等功能，讓設(shè)計(jì)人員無(wú)須編寫(xiě)代碼，即可完成輕游戲及數(shù)據(jù)應(yīng)用的H5設(shè)計(jì)。數(shù)據(jù)應(yīng)用04專(zhuān)業(yè)H5工具——意派Epub360iH5是一款操作較為復(fù)雜的H5制作工具，初學(xué)者應(yīng)用難度較大。A應(yīng)用難度較大，能制作出復(fù)雜的頁(yè)面邏輯交互、動(dòng)效、3D等效果；特點(diǎn)在線(xiàn)編輯H5工具——iH5通過(guò)代碼的形式對(duì)H5頁(yè)面的內(nèi)容和動(dòng)畫(huà)進(jìn)行展示和制作。優(yōu)勢(shì)iH5增加繪畫(huà)、物理引擎、時(shí)間軸動(dòng)畫(huà)、設(shè)備相應(yīng)、數(shù)據(jù)庫(kù)、跨屏互動(dòng)等新功能，能實(shí)現(xiàn)H5頁(yè)面的制作，游戲、網(wǎng)站、交互等設(shè)計(jì)。綜合性能強(qiáng)iH5官網(wǎng)提供了使用說(shuō)明、免費(fèi)視頻教程等內(nèi)容供用戶(hù)學(xué)習(xí)和提升。平臺(tái)開(kāi)放iH5具備交互性強(qiáng)、功能豐富、效果多樣等特點(diǎn)，可用于日常宣傳推廣、品牌營(yíng)銷(xiāo)、企業(yè)活動(dòng)宣傳，對(duì)企業(yè)端用戶(hù)和個(gè)人用戶(hù)分別設(shè)置了不同的使用途徑。應(yīng)用領(lǐng)域廣泛在線(xiàn)編輯H5工具——iH5H5的輔助工具PARTFOUR音視頻壓縮工具——格式工廠(chǎng)格式工廠(chǎng)是一款免費(fèi)的格式轉(zhuǎn)換軟件，可將音頻、視頻、圖片等素材進(jìn)行格式的轉(zhuǎn)換，以滿(mǎn)足設(shè)計(jì)人員的需求。格式工廠(chǎng)可將所有類(lèi)型的音頻轉(zhuǎn)換為MP3、WMA、FLAC、AAC、MMF、AMR、M4A、M4R、OGG、MP2、WAV等格式。音頻轉(zhuǎn)換格式工廠(chǎng)可將所有類(lèi)型的圖片轉(zhuǎn)換為JPG、PNG、ICO、BMP、GIF、TIF、PCX、TGA等格式。圖片轉(zhuǎn)換格式工廠(chǎng)可將所有類(lèi)型的視頻轉(zhuǎn)換為MP4、3GP、AVI、MKV、WMV、MPG、VOB、FLV、SWF、MOV，新版的格式工廠(chǎng)還支持RMVB、xv等格式。視頻轉(zhuǎn)換音視頻壓縮工具——格式工廠(chǎng)手機(jī)預(yù)覽設(shè)計(jì)稿——PSPlayPSPlay是一款通過(guò)Wi-Fi網(wǎng)絡(luò)，能在終端設(shè)備上預(yù)覽、調(diào)試、保存PSD文件，并可實(shí)現(xiàn)即時(shí)分享的跨終端應(yīng)用。ATinyPNG簡(jiǎn)介T(mén)inyPNG是一款免費(fèi)的圖片壓縮工具，具有圖片保真率高、文件量小的特點(diǎn)。圖片壓縮工具——TinyPNGBTinyPNG特點(diǎn)壓縮強(qiáng)度高，保真度高。相對(duì)于JPG格式的圖片，對(duì)透明PNG圖片的壓縮率更高。為