【2018春节特辑】H5 案例分析 | 拜年了

一、基本信息

1、主题：拜年了

2、来源：简豆

3、类型：游戏类-合成

4、 技术实现：jQuery + Swiper

二、内容策划

简豆的这个H5以“拜年”为主题设计制作个人专属拜年帖。

H5分为男女两个版本，以下图片显示的是进入女生版本后的界面。

拜年换装共有汉朝、唐朝、宋朝、明朝、民国、现代6个朝代可以选择。

选择好朝代后，上传自己的照片进行合成；然后选择拜年对象和祝福语，当然也可以自己进行编辑。祝福语在最后的合成页面以“春联”的形式显示，同时也将祝福语进行了语音合成，共同组成最后的拜年帖，发送给朋友。

三、交互设计

左右切换朝代的时候，左右箭头不是很明显，没有设有相应的引导。

语音合成的进度条，按照用户往常的操作习惯，语音播放是可以人为控制开始和停止的，在该H5中则是持续的播放，播放条不能点击。

四、视觉设计

红色和黄色的结合，再配上背景音乐，很符合过年的气氛，简单也不失年代感。在“汉朝”的界面，画面有些粗糙，没有与其他五个朝代的界面保持一致。

同时，建议每个朝代的背景在大体风格不变的情况下，保持差异化，体现出该朝代下的新年元素。

每个朝代的新装最好也与该朝代下新年期间人们的着装打扮有关。

五、参考亮点

H5中不仅用了人脸合成，也加入了语音合成，可以考虑将机器的声音，直接换成用户自己按照祝福语录入。

---