腾讯：欢乐茶馆可以绣苗绣啦

2020-08-31 H5案例分享 H5案例分享

案例演示，请长按/扫描以下二维码 ->

识别图中二维码

欢乐茶馆可以绣苗绣啦-查阅二维码

完整欣赏此案例大约需要1分09秒

案例：欢乐茶馆可以绣苗绣啦

品牌：腾讯

技术实现： pixi.js + zepto + video

亮点：

1、创意定位

腾讯新文创和多家媒体及创意机构联合，将苗绣具有代表性的元素进行了重新包裝，让苗绣图腾们有了新的社会解读，更符合年轻人的态度表达。

2、策划上

① 点击首屏的“开启苗绣之旅”按钮，播放一段41秒的视频，一只苗绣的蝴蝶，飞过苗乡、飞过绣娘，飞到绣帛；

② 进入苗绣图腾页面中，选择绣帛的颜色，有3种颜色：深蓝、天蓝、黑；选择两个不同纹样，组合苗绣图案，6个苗绣图案可以供选择；苗绣图案可以翻转、旋转、缩放；也可以随机生成，点击“完成”按钮，生成苗绣图腾；

③ 用户可以保存苗绣图腾；也可以装饰茶馆，会有3张茶馆一角的海报图，滑动切换观看，或长按保存；也可以点击支持绣娘，进入绣品的购买页面。

3、设计上

还原苗族特色的插画风格，在元素和颜色上参考了非常多的苗绣作品，构图上也贴合苗绣的风格化。

4、交互上

让用户diy，高度还原了真实苗绣的制作场景，让用户更深度地沉浸体验苗绣制作。

以上为“H5案例分享”团队原创文章，转载请注明出处！

标签