近幾年，制作方H制作流H5快速普及，法和應用于節日和一些品牌活動(dòng)營(yíng)銷(xiāo)場(chǎng)景。步驟??
為什么大家會(huì )選擇使??用H5作為營(yíng)銷(xiāo)傳播方式(′▽?zhuān)?呢？從大程
如果你ヽ(′▽?zhuān)?ノ或你的角色公司也想做一個(gè)H5，該如何下手呢？制作方H制作ヽ(′▽?zhuān)?ノ流今天筆者將從角色分工的角度帶你了解H5制作的制作流程。
在一個(gè)完整的法和H5制作項(′?ω?`)目中，主要包含以下4個(gè)角色：項目經(jīng)理、步驟策劃、從大程設計、角色開(kāi)發(fā)。
△H5制作角色及分工
那么在實(shí)際項目中該如何扮演好這些角色呢？
對接需求，把控項目進(jìn)度。
項目經(jīng)理是一個(gè)統籌全局的角色，當有制作需求時(shí)，項目經(jīng)理會(huì )(hui)負責溝通對接。然后將需求傳達給負責項目的成員ヽ(′ー｀)ノ，同時(shí)把(ba)控整體項目進(jìn)度。
首先從拆分需求講起，我們可以從5WH的維度拆分需求：
該維度同時(shí)適用于策劃、設計、開(kāi)發(fā)。
通過(guò)這6個(gè)維度，項目經(jīng)理在此基礎上了解到具體需求，同時(shí)規劃好項目周期，安排好時(shí)間節點(diǎn)，對項目進(jìn)行把控。在項目的過(guò)程中，項目經(jīng)理應積極與策劃、設計、開(kāi)發(fā)溝通，協(xié)調好上下游，推動(dòng)項目的進(jìn)度、做好項目管理、完成項(╬ ò﹏ó)目目標。
構思創(chuàng )意方案，產(chǎn)出交互原型。
策劃在制作(zuo)的過(guò)程中，常使用下列??工具：
△H5策劃常(chang)用工ヾ(′▽?zhuān)??具
在常規的制作(′ω｀*)中，H5策劃更多的是以PPT作為工具進(jìn)行繪制原型，因為H5對原型圖的需求并不高，而PPT上手簡(jiǎn)??單、便于演示和(he)修改。但是當H5設計邏輯較為復雜對原型圖要求較高時(shí)(shi)，可優(yōu)先考慮使用axure、墨刀進(jìn)行繪制，方便與設計及開(kāi)發(fā)演示及溝通。
還有一些H5是純動(dòng)畫(huà)展示，就需要策劃出分(??ヮ?)?*:???鏡腳本，這時(shí)候就需要和設計配合輸出方案，不過(guò)如??果要求不高，也?可以找一些相(╯‵□′)╯關(guān)的圖進(jìn)行替代，重要還是闡述清楚想表達的思路。
策劃在創(chuàng )意輸出的時(shí)候，需要和設計、開(kāi)發(fā)積極溝通，比如：場(chǎng)景如何構思展示，技術(shù)(′ω｀*)上是否能夠實(shí)現，這樣才能夠確保后續方案的落地。
根據方案，進(jìn)行視覺(jué)實(shí)現。
當方案確認后，就是設計開(kāi)始執行。一般H5設計根據需求來(lái)大致分為插畫(huà)、真人合成、視頻、3D四個(gè)方向（個(gè)人分類(lèi)，僅供參考）。
但是很多人接到需求就不知道如何下手了，那么你需要先做2點(diǎn)：
在做的過(guò)程中一定不要盲目做也不要(yao)一次???性做??完全部的頁(yè)面，正確的做法是先溝通確認需求，然后出demo確認風(fēng)格再進(jìn)行下一步，這樣可提高整體的工作效率。demo可以選擇首頁(yè)或較為重要的頁(yè)面優(yōu)先進(jìn)行視覺(jué)設計，設計風(fēng)格上要契合產(chǎn)品調性和受眾喜好，同時(shí)也需要考慮公司品牌文化展示的一些需求。
除了視覺(jué)的展示，??一個(gè)優(yōu)秀的H5還包含動(dòng)效和音樂(lè )。動(dòng)效部分如果非視頻植入，建議繪制逐幀給到開(kāi)發(fā)實(shí)現，繪制也需和開(kāi)發(fā)提前溝通實(shí)現效果。如果頁(yè)面動(dòng)畫(huà)的呈現是由設計師自己把控，那么在設計結束后，建議撰寫(xiě)動(dòng)畫(huà)頁(yè)面展示效果說(shuō)明，一起交??給開(kāi)發(fā)，避免反復的溝通。
同時(shí)很多同學(xué)對還抱有疑惑，首先給大家看看這一年多我自己作圖尺寸的變化。 H5設計尺寸
最開(kāi)始我的制作尺寸是640*1008PX，后(hou)來(lái)為了適應全面屏設計尺寸改為640*1240PX，安全高度為1040PX，安全高度之??外的畫(huà)僅為主體畫(huà)面的延伸。很多人會(huì )想問(wèn)UI一般不是按照iPhone6設計尺寸（750*1334PX）來(lái)進(jìn)行設計嗎。
是的，你也可以使用該尺寸，其實(shí)對于尺寸沒(méi)有定論，很多公司也用iPhone6或X的尺寸進(jìn)行設計，這些可以和開(kāi)發(fā)溝通根據實(shí)際情況進(jìn)行設計。
隨著(zhù)科技不斷發(fā)展，智能設備不斷更新，設計尺寸還是會(huì )變的，所以需要與時(shí)(shi)俱進(jìn)。
設計稿確認后就需要交付給技術(shù)進(jìn)行開(kāi)發(fā)，開(kāi)發(fā)過(guò)程這里不作過(guò)多描述。當制作完成，大家可以一起進(jìn)行測試。
測試維度主要是以下三個(gè)方┐(′?｀)┌面：
不過(guò)，上線(xiàn)了就結束了嗎？
當然不是，費了這么大力氣做的H5上線(xiàn)就是結束，那豈不是太可惜。這個(gè)時(shí)候就要回到我之前提到的5WH中的WHY：想要解決什么問(wèn)題，平臺導流or品牌營(yíng)銷(xiāo)？
所以上線(xiàn)后還需要對H5數據監測，了(le)解該H5的打開(kāi)率、轉換率等，對用戶(hù)的行為數據(°□°)進(jìn)行一個(gè)分析。 在開(kāi)發(fā)時(shí)需要對H5埋點(diǎn)，一般可(′?｀)以選擇CNZZ友盟、神策等在線(xiàn)工具。當整個(gè)活動(dòng)結束后，可對數據進(jìn)行分析復盤(pán)，是否達到最開(kāi)始我們提到的why，是否達到最開(kāi)始策劃的預期。
△友盟平臺數據分析截圖
通過(guò)對項目經(jīng)理、策劃、設計、開(kāi)發(fā)。
四個(gè)角色進(jìn)行分析，我們可以得到下列圖表：
△H5制作工(′?_?`)作流程
看到這里，相信你對H5的制作流程已經(jīng)有一定的了解，具體的工作流程和職能劃分也可結合自己的實(shí)??際情況進(jìn)行調整。但是(?_?;)(shi)萬(wàn)變不離其宗??，做任何項目都需要理清制作需求、把控好項目進(jìn)度、積極溝通反饋，更要學(xué)會(huì )總結復盤(pán)，對項目進(jìn)行回顧反思，總結經(jīng)驗。
△摘自陳中《復盤(pán)》
一個(gè)H5完整的制作流程講到這里就結束了，希望你看后能夠有所收獲。
如果你是負責自家(jia)的(de)產(chǎn)品，則需要在一開(kāi)始就策劃好整個(gè)推廣流程。比如：是單獨推H5還是結合活動(dòng)進(jìn)行推廣、什么時(shí)間推、推廣渠道等等，這些就需要更加詳細的策劃方案。而今天講述的只是針對在H5制作這個(gè)部分的流程，希望你看后能夠有所收獲。
版(╯°□°)╯權聲(?????)明(ming)：本文內容由互聯(lián)網(wǎng)用戶(hù)自發(fā)貢獻，該文觀(guān)點(diǎn)僅代表作者本人。本站僅提供信息存儲空間服務(wù)，不擁有所有權，不承擔相關(guān)法律責任。如發(fā)現本站有涉嫌抄襲侵權/違法違規的內容， 請發(fā)(fa)送郵件至 [email protected] 舉報，一經(jīng)查實(shí)，本站將立刻刪除。
（作者：SEO診斷）