Xiaomi：Redmi Note 11 Series Showroom

2022-05-27 H5案例分享 H5案例分享

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

识别图中二维码

Redmi Note 11 Series Showroom-查阅二维码

完整欣赏此案例大约需要3分钟

案例：Redmi Note 11 Series Showroom

品牌：Xiaomi

技术实现： GSAP + Three.js

亮点：

1、创意定位

小米在国外为Redmi手机和智能家居产品做的宣传H5，将发布活动创建一个品牌虚拟展厅，用户以虚拟人物的角度，在展厅里观看产品并购买。

2、策划上

① 进入案例后，首先输入昵称，可以是中文，也可以是英文，或其他外文，确认后进入发布会的虚拟展厅；

② 用户可以按下方的虚拟控制球，在场馆中随意跑动，用户会看到4款Redmi手机，每碰到一款，左侧手机图标就加1，从4分之0到4分之4，当4款手机都看过，屏幕中的小人就发出闪光散花；

③ 左侧按钮从上到下，分别是设置（设置昵称等），音乐控制（2种音乐+静音），看到手机数提示；

④ 右侧按钮是用户动作控制，最下方是评论。

3、设计上

3D虚拟场景，虚拟的新品发布会展厅，用户自己创意3D形象；

4、交互体验上

① 当用户停留在某个位置时，用户可以滑动屏幕，720°旋转；

② 用户拖动下方的虚拟控制球，控制虚拟人前后左右移动，根据用户拖动离中心的远近，控制人物跑的快慢；

③ 用户点击右侧的图标，虚拟人会有不同的动作。

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

标签