H5的具体设计部分虽然只占整个流程的一个小分支，但作为设计师却要贯穿始终，了解这5个分支。而流程也会从一个侧面告诉了你，想要做出一个好的H5，究竟需要经历哪些环节，会涉及到哪些因素。

了解需求

  选好方向每支H5的设计都是建立在具体需求之上的，当你拿到需求时，需要先搞清楚做这个网站设计目的是什么？每个项目追求的目的都不同。例如：推广新产品、促销活动、为网站引流、传播品牌形象等。要从不同的需求来挖掘目标背后的特点和优势。假如说，我们现在需要推广一次免费看电影的活动，那么免费和电影就是特征，而围绕免费我们可以发散出很多相关的点子，比如说“省钱、机会难得、很有意义”等等，都是可以继续深入洞察的方向，这需要结合自身产品的优势和活动目的来进行发散，这是设计的第一步，也是最重要的一步。目的性模糊的H5项目的启动是盲目的，它会给你带来麻烦，并且最后会难以客观评估项目效果。

确定表现形式

  当定位和内容方向明确后，下一步就是要围绕定位构思表现形式了，H5的表现方式目前已经非常多了，并且还在不断创新，我们究竟选什么样的表现形式好呢？是要讲故事卖情怀？还是要强调功能，去陈述内容，做陈述页面？还是说做个小游戏拼用户粘性？

  在互联网公司，多数团队会采用头脑风暴的形式来确定项目主题，而设计师必然是参与者之一。所以，对于表现形式的认识和Web网页技术的了解就必不可少了，天马行空固然重要，但能够落地实现的才是有效的想法。常规来说，这个表现形式一定是最能发挥内容特征和团队优势的，你要去寻找合适的形式表现合适的内容。当预算充足，项目又需要借助明星效应时，我们可以采用拍摄视频并且制作特效合成的方式来执行项目。

设计表现

  到了具体设计表现阶段了，这就需要确定美术风格了。如果选择了伪装朋友圈形式，那么必然你要奔着这个方向去做得更像朋友圈的页面，去研究微信内部的页面和UI细节，这样的执行就特别强调临摹和还原。

设计师需要去判断用哪种表现形式，需要什么调性，搭配何种元素、配乐和动效的跟进。搭配究竟应该是什么样子的？往往常规的设计师是应付不了这些的，这个阶段对于设计的整体把控能力要求较高，不是说你能做平面设计、能做UI设计，你就是H5设计师了，一位H5设计师需要综合能力，他应该能敏感地意识到多种表象形式，包括音乐、动效、甚至说视听蒙太奇的融合……

开发执行阶段

  设计师把做好的分层图，这里包含了psd文件、png切图、适量文件、mp3音频、视频文件等等，一起打包给前端工程师同事，他会将这些内容放置到服务器，用代码编辑的方式将元素合并成我们平时看到的那些H5网页，前端也是H5的最终执行者，他们对设计效果的还原至关重要，一个好的前端往往决定了一个作品的最终命运，前端工程师可以说是设计师最好的行业导师，我们一定要向他们虚心学习网页代码技术。整个H5网页在代码编辑完成和测试无误后，就会上线推送到互联网。有时，前端工程师的工作量要远远高于设计，而这取决于项目的具体表现形式和难度。

数据总结分析

  实际前面4个过程的设计打法和传统互联网设计类似，但数据总结阶段是H5特有的，各类数据会告诉你网站的受欢迎程度和不足之处，我们现在的数据统计已经比较强大了，服务器甚至能够监控到每一个页面各个位置的点击情况，即使数据没有那么详细，通过PV、UV量和跳出率你也会对作品的效果有大概的认识。

  而在整个设计过程中，创意和技术是贯穿始终的，参与者随时可以打破这个常规流程，对于一个新兴的事物来说，不存在完善的流程，只存在优秀的案例，而H5的设计流程，也会随着互联网的发展不断被完善。