当我们在装修一个美好的家时，通常一套直观的搭配方案，成为一次消费的起点。而货架式的陈列方式，较难满足将他们组合在一起看商品搭配的诉求。所以我们基于购买家具、主材、全屋智能，结合2D/3D的展陈与互动技术，设计了几款家居导购产品，营造购物的搭配感、场景感、沉浸感，帮助用户弥补对未来家的想象，提升消费者的购买决策，为淘宝购物带来新体验。
▲ 主要场景
#01
选购家具
多商品搭配体验
当我们在购买家具时，主要是关注两点，搭配和体验。买家具没法像买衣服一样，不满意就退，线上购买解决不了真实触摸的体验问题，但可以增加搭配的确定性，用户比较关心“这款家具怎么搭配？放在我家的效果怎么样？”，能预先看到家具放进自己家的效果，是每个装修用户的核心诉求。
▲ 用户需求场景
为解决搭配问题，我们在商品详情页中，设计了一款在线搭配产品。在界面上，设计了上看下选的结构，上半部分为场景搭配区域，下半部分为商品选购区域，选中的商品可直接替换上半部分场景中的商品图，通过此结构，可实现效果、参数、价格三重对比。用户也可将背景替换成自己的家，看到商品放到家中的真实效果。
▲ 软装搭配流程
如果您家是精装修，可以看不同软装的搭配效果；反之，您有心仪的软装搭配，也可看这套搭配在不同硬装下的效果。
▲ 换硬装与换软装起初我们是想用3D模型来解决搭配问题，但商家需要将所有商品数字化，需要付出较高的模型成本，且需要对用户的家进行3D还原，成本更高，这将不利于产品的推广。后来我们在调研用户时，发现装修用户会自己P图看搭配效果，其原理就是设计师每天做图时，使用的叠图思路，所以我们果断采取2D叠图来解决搭配问题，也解决了商品规模化的问题。
▲ 叠图搭配原理使用该种方式，用户可以生成数以万计的搭配方案，最终为用户带来可视化的搭配决策体验，对加购与成交转化都带来提升。
#02
选购主材
更直观的商品对比看完了软装，我们再看硬装选购。同样利用上看下选的结构，我们在上半部分开了“小天窗”，用户可在该区域内，自由移动视角，下半部分为商品选购，选中的商品可直接替换上方场景中的效果，很直观地感受到地板在全屋的铺贴效果。
▲ 主材替换可将心仪的几种主材，进行同空间、同搭配、同视角、同尺寸等维度的3D效果对比，为用户带来高效的选购决策。
▲ 主材的同纬度对比#03
选购智能家居
多维度的信息传递全屋智能属于新型行业，需做深度用户教育，通过3D互动视频完成用户对“全屋解决方案”的理解。设计尝试将搜索结果顶部的“图文导航”进行升级，通过3D视频重塑场景，该场景会用视频的方式介绍该空间的代表功能，在场景中切换空间后，下方商品列表随之更新至新空间的具体商品列表。此方式同时也可降低原3D互动内容，对搜索链路带来的性能损耗。
▲ 智能家居视频在互动场景中，首次增加语音引导，通过语音讲解，试图增强信息传递的有效性，和用户场景的带入感。 fill=%23FFFFFF%3E%3Crect x=249 y=126 width=1 height=1%3E%3C/rect%3E%3C/g%3E%3C/g%3E%3C/svg%3E)
▲ 语音引导
我们分别对门厅、客厅、卧室、厨房、阳台、卫生间等空间的进行3D建模与渲染，并在各个空间中标记商品跳转锚点，以便提升商品搜索结果的点击率。
▲ 各空间视频引导
#04
3D样板间的导购探索
3D样板间是通过3D建模与渲染技术，为消费者在购买家居过程中，构建场景感、真实感和沉浸感。但样板间的渲染效果是由算法生成，整体略显高冷，我们希望借用人格化设计，通过客服助手和3D评价弹幕，增添虚拟空间的“烟火气”。▲ 人格化设计客服助手：他的造型来源于三条腿的小板凳，可在样板间中穿梭，配合语音播报，为用户讲解全屋智能方案。为了更好地展现效果，我们增加了横屏模式，扩大了视域，用户可在两种模式间自由切换。▲ 客服助手引导3D评价弹幕：为了增加商品的真实感，我们用弹幕的形式引入真实用户评价，且创造性的让弹幕变成3D样式，从而更好地依附于3D空间中的墙面，营造场景的丰富性与氛围感。▲ 3D弹幕如今，基于3D化的商品导购产品已层出不穷，而我们在时刻关注技术进展的同时，首先需要用一些低成本的方案，如2D/3D的技术结合，互动视频等，同时满足当下用户对购物新体验的诉求，与降低商家的运营成本；其次也需要通过一些人格化的设计，增加科技产品的产品的氛围与人气。最后，在家装家居的3D化设计中，我们需要不断寻找体验、技术、成本的契合点，螺旋式的探索与前进。////// END //////淘宝设计，一个服务于全球亿万消费者体验的设计团队，致力于让设计触动人心，让商业美而简单。欢迎加入，公众号后台回复“招聘”，了解最新招聘信息。
13122402111
13122402111