Flokk 是办公家具设计与制造的领军企业。其产品销往全球 80 多个国家，坐拥 HÅG、Offecct、Giroflex、RH、Profim、9to5 Seating、BMA、RBM 和 Malmstolen 等多个品牌。

独具匠心的设计是 Flokk 产品的核心，得益于高效的供应链和制造工艺，公司的每款产品都支持客户定制。顾客可以自己选择面料、尺寸、液压杆等多种配置，整个订购体验和购买汽车非常类似。不过，Flokk 在设计方面的独特优势，却难以让消费者在线上体验到。2019 年，Flokk 决心改变这种状况。

Flokk 与长期合作的 Forte Digital 一起，构建了一款常见的产品可视化平台（俗称“配置器”），让消费者在线体验定制产品的魅力。新项目的一项关键工作便是使用 Unity ArtEngine 把扫描的实物照片转化为 PBR 材质，再将其导入至内部开发的 3D 产品配置器，让顾客能够在网页浏览器中方便地设计自己的3D座椅。

利用 Unity ArtEngine 获得的高清材质贴图打造的配置器，不仅支持员工直接获取高清产品照片，提高内部工作效率；还提高了网上订购体验的可靠性，减少了错误订购和退货率，提高了经销商和顾客的满意度。经过本次网站改革，Flokk 的品牌形象更加深入人心，让消费者深深感受到该品牌对设计的极致追求。

我们采访到了该项目的团队成员，让他们来分享如何基于 ArtEngine 将多种材质数字化。

图像清晰度和精确度在表现材质时尤为重要，这就要求 Forte Digital 使用扫描技术来制作 Flokk 数百种椅子材质的变体。当然，材质也能使用软件程序化地生成（即以零碎材质为基础），或从公共材质库购买扫描好的材质。但只有扫描真正的 Flokk 材质才能保证成果真实可信。

具体来说，项目组决定使用一种叫做光度立体法的扫描方法，这种技术可以借助几张不同光线条件下的物体照片来捕捉表面特性。光度立体法不仅可以提取反照率（即物体颜色，类似典型平面扫描仪的功能），还可以提取法线（即表面的起伏），有时还可以提取镜面和粗糙度数据，这些关键数据是生成真实物理渲染（PBR）材质所必须的。

由于工作量较大，团队需要尽可能地自动化流程并保证结果的准确性。Forte Digital 的 3D 艺术家 Piotr Bieryt 决定搭建一个定制的自动化扫描装置，辅以 ArtEngine 来处理扫描数据。

Bieryt 使用激光切割出的胶合板和 3D 打印出的元件组装了这个装置，再用黑色天鹅绒盖住原型装置的内侧，防止出现颜色失真和光线反射，然后在底部安装了一块可拆卸的黑色透光板，让光从底部射入来照射出材质的透明度。最后，将这个装置配置为使用 Arduino 进行操控。

“我喜欢动手做东西、捣鼓自动化，所以整个过程非常有趣！” Bieryt 解释说。

他使用无反光镜的奥林巴斯 16MP 相机和 60mm 微距镜头（微 4/3 系统）来捕捉 Flokk 材质纤维的细节，并将照片保存为 RAW 格式以保留准确的白平衡和颜色。在校正照片的色彩后，Bieryt 接着开始使用 ArtEngine。

Bieryt 常用的 ArtEngine 工作流大致如下。

在下例中，拍摄的样品是一款 Flokk 椅子上 10x10 厘米的半透明织物。在创建材质时，材料的透明度通常需要以额外的透明度通道表示，这就可能造成数据不准确。为了解决这个问题，Bieryt 对织物进行了两次扫描，一次从侧面照亮材料（标准的光度立体法），另一次是从底部照亮材料（专门记录透明度）。

在导入 ArtEngine 后，他将两组图像分别接入 Multi-Angle to Texture 节点，将 16 张图像合并成 Albedo、Normal 和 Transparency 三张贴图。

然后使用 Gradient Removal（类似于 Photoshop 中的 High Pass 滤镜）去除 Albedo 和 Normal 贴图上较为明显的渐变色，使其更适合于铺展。

Bieryt 接着使用 Compose Material 功能将三张贴图合并成一个材质，使用 Pattern Unwarp 来平整自然的织物形变。Bieryt 指出：“在扫描前花时间平整样本很有必要，因为这样能减少后期处理的时间，但就算你不能把所有的小突起给按下去，ArtEngine 的工具也可以随后进行修正。”

他随后使用 Crop 节点将平整后的纹理划到一个 1:1 的框中。下方为节点图。

接下来是使用 Mutation Structure 节点来进一步改善材质的平铺，该节点能借助 AI 来识别和消除重复的图案，并保留底层图案。

Bieryt 指出：“ArtEngine 的 Mutation Structure 非常神奇，它直接改变了整个工作，我们能够更专注于扫描数据的艺术性，不必再与软件或算法较劲。”

他随后继续调整了材质比例和输出维度等参数，并最终得到了一份高度精细的 8K 纹理，其面积比 10x10 厘米的原样本大 6 倍，并且没有明显的平铺瑕疵。

最后，Bieryt 使用 Height Generation 和 Roughness / Gloss Generation 来创建高度和粗糙度贴图，再用 Compose Material 将所有内容导出。

下方为最终的节点图表。

同样式不同色的材料只需扫描一次，那些结构相同的织物可通过修改材质颜色来呈现不同的色彩，材质在应用到 3D 模型上后由 Blender Cycles 渲染出最终效果图。

自翻新项目启动以来，Flokk 已经看到了切实的效果：随着线上结算逐步在各国普及，公司的网站访问量有了显著增加，其经销商和顾客的满意度和好感也有了提升，直接提高了品牌的忠诚度和声誉，线下订单所产生的间接成本也显著下降。

所有改进都直观地呈现在了公司的消费者网站 Flokk.com。用户在选中了感兴趣的椅子型号后，可以继续定制产品的方方面面，以自由视角近距离地查看所选配置，在线上下单前就了解定制所产生的相关费用。

这次重建项目仍在进行中，Flokk 计划继续将自助服务功能拓展到其他国家的本土销售网站上，并部署新的工具供销售团队和客户使用。例如，公司当前的计划之一是在配置器的基础上做出“展厅模式”，以 iPads 应用的形式部署到全球各地的产品展厅中，方便顾客在店内了解和订购 Flokk 产品。

从广义上说，本次重建项目向整个公司展示了专注顾客体验、适应顾客偏好的重要性，因为当今的消费者越来越喜爱通过网络或应用购买商品。可以肯定的是，Flokk 已经在竞争中夺得了一个非常好的优势地位。在家具制造这样的传统行业里，端到端用户体验并不常是企业首先考虑的问题，而 Flokk 在自己的投资决策中率先考虑到了顾客的购物体验，也因此获得了长期的竞争优势，为未来更多的成功打好了基础。

长按关注

第一时间了解Unity引擎动向，学习最新开发技巧