H5设计案例分享丨奥迪线上工厂

---

案例：奥迪线上工厂

品牌：奥迪

技术实现：html5

识别，进入奥迪线上工厂

1. 创意定位

 奥迪以“线上工厂”为题，让用户参与进奥迪的产品生产线流程。在展示奥迪充满高科技感的生产线的同时，让用户以通关的形式，一步步解锁汽车的各种配件，最后生成自己参与制作的奥迪汽车，形成品牌传播。

2. 策划逻辑

主题页→奥迪全球生产基地→AUDI亮点技术→静谧空间（冲压车间）→火花走廊（焊接车间）→秘密花园（涂装车间）→魔术城堡（总装生产线）→生成汽车

①　主题页

主题采用几何线描的形式，将品牌名称、logo和汽车零部件排布在背景中。大标题采用品牌口号“突破科技，启迪未来”，副标题则是“欢迎来到奥迪线上工厂”，一种服务的态度，让用户即使进入到线上工厂中，也不会觉得自己是工人，而是参观者，抱着好奇心的参观者。

②　生产基地

在地图上以文字标注的形式介绍奥迪在全球生产基地。

③　亮点技术

④　静谧空间

冲压中心，用向左滑屏的方式向用户展示静谧空间各种系统的特点。

⑤　火花走廊

焊接空间，火花四溅，是激光熔焊的溅射。

⑥　秘密花园

涂装空间，为汽车涂装上属于你的颜色。

⑦　魔术城堡

装配生产线，将零件组装成一辆车。

⑧　生成汽车

3. 交互设计

以简单的几何线条为表现形式，配合黑白的线描，和红色的提示框，简单又不失深意。

在交互上，也如生产流水线一般，一步只有一种操作，让你从头到尾体验奥迪汽车从0到1的生产过程。

虽然是如流水线般的交互操作，但也不会感觉到无趣，在涂装车间中，用户可以根据自己的喜好，选择自喜欢的颜色，流水线也有自己的差异可以选择。

 每个步骤都有红色框提示引导，让用户不会在一个页面里不知所措。操作指引，让用户更能体验出生产线的智能与流畅。

4. 体验

奥迪的“线上工厂”更像是一种科普，但比科普更有趣，里面各个环节的技术介绍，在展示奥迪各种先进技术的同时，还让奥迪的科技黑箱向用户打开了一条缝隙，增强了用户的好奇心理，好想去看看真实的汽车生产线。

新视频丨带你走进光怪陆离的世界

新视频，未来与野蛮的交融