1. 首頁 > 生活百科 > >

h5怎么做從四大角色帶你了解H5制作流程？( 二 )

生活百科

在做的過程中一定不要盲目做也不要一次性做完全部的頁面 ， 正確的做法是先溝通確認需求 ， 然后出demo確認風格再進行下一步 ， 這樣可提高整體的工作效率 。demo可以選擇首頁或較為重要的頁面優先進行視覺設計 ， 設計風格上要契合產品調性和受眾喜好 ， 同時也需要考慮公司品牌文化展示的一些需求 。
除了視覺的展示 ， 一個優秀的H5還包含動效和音樂 。動效部分如果非視頻植入 ， 建議繪制逐幀給到開發實現 ， 繪制也需和開發提前溝通實現效果 。如果頁面動畫的呈現是由設計師自己把控 ， 那么在設計結束后 ， 建議撰寫動畫頁面展示效果說明 ， 一起交給開發 ， 避免反復的溝通 。
同時很多同學對H5設計尺寸還抱有疑惑 ， 首先給大家看看這一年多我自己作圖尺寸的變化 。
最開始我的制作尺寸是640*1008PX ， 后來為了適應全面屏設計尺寸改為640*1240PX ， 安全高度為1040PX ， 安全高度之外的畫僅為主體畫面的延伸 。很多人會想問UI一般不是按照iPhone6設計尺寸（750*1334PX）來進行設計嗎 。
是的 ， 你也可以使用該尺寸 ， 其實對于尺寸沒有定論 ， 很多公司也用iPhone6或X的尺寸進行設計 ， 這些可以和開發溝通根據實際情況進行設計 。
隨著科技不斷發展 ， 智能設備不斷更新 ， 設計尺寸還是會變的 ， 所以需要與時俱進 。
四、開發、測試、上線、數據監控反饋設計稿確認后就需要交付給技術進行開發 ， 開發過程這里不作過多描述 。當制作完成 ， 大家可以一起進行測試 。
測試維度主要是以下三個方面：

  1. 視覺還原度；
  2. 音效、動效配合及實現；
  3. 體驗是否流暢 。
這是一個反復確認的過程 ， 當一切準備完畢 ， H5就完成了 ， 就可以靜靜等待上線 。
不過 ， 上線了就結束了嗎？
當然不是 ， 費了這么大力氣做的H5上線就是結束 ， 那豈不是太可惜 。這個時候就要回到我之前提到的5WH中的WHY：想要解決什么問題 ， 平臺導流or品牌營銷？
所以上線后還需要對H5數據監測 ， 了解該H5的打開率、轉換率等 ， 對用戶的行為數據進行一個分析 。在開發時需要對H5埋點 ， 一般可以選擇CNZZ友盟、神策等在線工具 。當整個活動結束后 ， 可對數據進行分析復盤 ， 是否達到最開始我們提到的why ， 是否達到最開始策劃的預期 。
h5怎么做從四大角色帶你了解H5制作流程？

文章插圖
△友盟平臺數據分析截圖
通過對項目經理、策劃、設計、開發 。
四個角色進行分析 ， 我們可以得到下列圖表：
h5怎么做從四大角色帶你了解H5制作流程？

文章插圖
△H5制作工作流程
看到這里 ， 相信你對H5的制作流程已經有一定的了解 ， 具體的工作流程和職能劃分也可結合自己的實際情況進行調整 。但是萬變不離其宗 ， 做任何項目都需要理清制作需求、把控好項目進度、積極溝通反饋 ， 更要學會總結復盤 ， 對項目進行回顧反思 ， 總結經驗 。
h5怎么做從四大角色帶你了解H5制作流程？

文章插圖
△摘自陳中《復盤》
一個H5完整的制作流程講到這里就結束了 ， 希望你看后能夠有所收獲 。
如果你是負責自家的產品 ， 則需要在一開始就策劃好整個推廣流程 。比如：是單獨推H5還是結合活動進行推廣、什么時間推、推廣渠道等等 ， 這些就需要更加詳細的策劃方案 。而今天講述的只是針對在H5制作這個部分的流程 ， 希望你看后能夠有所收獲 。
【h5怎么做從四大角色帶你了解H5制作流程？】 好了 ， 這篇文章的內容金華號就和大家分享到這里！

推薦閱讀