オフィス家具メーカーは製品の 3D ビジュアライゼーション技術を活用して、どのように顧客体験を向上させているのでしょうか。Flokk は製品がオーダーメイドであるということもあり、同社の Web プラットフォーム全体を刷新する時期に来ていると判断しました。このプロジェクトには、Flokk のすべてのチェアの素材をデジタル化し、3D モデルに適用する重要な作業が含まれていました。この作業は、Flokk が信頼を置くソリューションパートナー Forte Digital と、Unity ArtEngine を活用したスキャンワークフローの力を合わせて行われました。
Flokk は高級オフィス家具の設計・製造のマーケットリーダーです。HÅG、Offecct、Giroflex、RH、Profim、9to5 Seating、BMA、RBM、MALMSTOLEN などのブランドの製品を世界 80 か国以上で販売しています。同社の 2,000 人の従業員は「Inspire great work」というビジョンを共有して、毎日働いています。
Flokk はデザインを製品の中心に置いています。効率的なサプライチェーンと製造プロセスにより、Flokk の製品はすべてカスタマイズ可能です。しかし、オンラインでの顧客体験においては常にデザインを中心に置くことができていませんでした。2019 年、Flokk はこの状況を変えるために、信頼を置くパートナーである Forte Digital の協力を得て、新しい E コマースプラットフォームに大規模な投資を行うことを決めました。このプラットフォーム刷新における重要なピースとして、Unity ArtEngine を使って同社のチェアの素材をデジタル化し、それを自社開発の 3D コンフィギュレーターに統合することで、顧客が Web ブラウザー上で快適にチェアを 3D デザインできる環境を作ることを位置づけたのです。
結果は以下のようなものでした。
Flokk のチェアはオーダーメイドで、何百万通りもの構成が考えられるため、同社のサプライチェーンと注文プロセスは非常に複雑になっています。例えば、あるオフィスチェアの SKU について、顧客は何十種類もの生地から好きなものを選択し、シートサイズ、リフト、フットベース、ホイールなどの特性を指定し、さらにネックレストやアームレストなどのアクセサリーを追加することができます。これは自動車を購入するのとあまり変わらない複雑な手続きです。
Flokk はデザインを製品の中心に置いています。美しく、高品質で、耐久性のある、顧客に愛される製品作りを誇りにしています。(オフィスチェア 1 脚の価格は 700〜2,000 米ドルにもなりますが、それでも選ばれています)。顧客は Flokk の品質とデザインの価値が、オンライン注文を含む同社とのすべてのタッチポイントに現れてくることを期待しています。
しかし、2019 年以前に Flokk が提供していた Web 体験は、最も合理的なものとは言えませんでした。静的なコンテンツが目に見えないところで顧客獲得の上での課題となっていました。さらに最近行った買収により、一貫性と管理にまつわる問題がさらに悪化しました。古い Web サイトのインフラはスケーラビリティが低く、ブランドや製品が加わることによって生じる新たな複雑さをカバーできず、その結果、カスタマージャーニーは不満が残るものとなっていました。また、Flokk にはオンラインでのセルフサービスのチャネルがありませんでした。
Flokk の E コマースマネージャーである Martina Winsell 氏は次のように説明しています。「私たちは、ディーラーと顧客の両方が当社の製品をオンラインで検索できると期待していることは知っていました。そしてどうすれば顧客がニーズに基づいて製品をカスタマイズできるのかを知りたいと思いました。当社の製品は非常に複雑なので、将来のあり方を考える際にはユーザビリティに注目することが重要でした。」
実のところ、E コマースプラットフォームの全面的な見直しは遅れていました。プロジェクトの目標は野心的でしたが、明確でした。それはセルフサービスのチャネルを新たに作り出し、付随する販売ツールの開発を可能にし、会社の製品ポートフォリオに合わせてスケールし、可能な限り最高の顧客体験を促進する共通のインフラを設計するというものでした。
Web に関する投資を決定し、次は信頼のおけるパートナーを探す作業を始めました。
Forte Digital は、テクノロジー、デザイン、戦略が交差する領域で、クライアントとの長期的なパートナーシップを通じて、デジタル製品やサービスを構築するコンサルティング会社です。そのポートフォリオには、Farmasiet(ノルウェー最大のオンライン薬局)、Nationaltheatret(世界的に有名な劇場)、Gyldendal Akademisk(大手学術出版社)、NorgesGruppen(ノルウェー最大の食品卸)など、さまざまな業界の企業が含まれています。
Forte Digital の分野をまたいだ専門知識は、顧客のために持続可能な価値を生み出すソリューションを構築するための核となっている要素です。このような専門性は、Flokk にとっても Forte Digital こそがその目標を達成するためのパートナーにふさわしいと考えさせるものでした。そして、実際に同社はパートナーに選ばれたのです。
プロジェクトの中心となったのは、Flokk の製品とその様々なバリエーションを正確に描写しつつ、顧客向け Web サイト、「Flokk Hub」と呼ばれる新しいディーラー向けツール、その他の販売・マーケティングツールなど、様々な Web プラットフォームに展開できる共通の製品ビジュアライゼーションインフラ(「Configurator」と呼ばれるもの)でした。
Flokk の目標であるスケーラビリティと効率性を考えると、Configurator を 3D ベースで構成することは理にかなっていました。例えば、すべてのチェアとその構成を捉えた写真をあらゆる角度から撮影して同じようなものを作ろうとすると、非常に大きな時間とコストがかかってしまうでしょう。
インフラを整えると、次は Flokk の製品を実際にバーチャル空間で表現するために、同社の作るチェアの素材をデジタル化するなどの作業を行うことになりました。
Flokk の素材を、その見た目に忠実に正確な表現することが最も重要でした。そのため、スキャンワークフローを採用し、Flokk の何百ものチェアの素材のデジタルツインを作成することは理にかなっていました。他にも、ソフトウェアを使って素材をプロシージャルに(つまり、何もないところから)生成する方法や、パブリックな素材ライブラリからスキャンデータを購入する方法などがありました。しかし、本物感を出すためには、Flokk が実際に使っている素材をスキャンすることが唯一の方法でした。
具体的には、「フォトメトリックステレオ」と呼ばれるスキャンワークフローを使用することにしました。フォトメトリックステレオとは、さまざまな光の条件で撮影した複数の写真を用いて被写体の表面の特性を把握する技術です。フォトメトリックステレオを使用すると、従来のフラットベッドでも取得できるアルベド(色)だけでなく、法線(表面のレリーフパターン)、さらにはスペキュラーやラフネスなどのデータも抽出することができます。これらは業界標準フォーマットである PBR(物理ベースレンダリング)素材を作成するための重要な入力データとなります。
デジタル化する素材の数が多いため、チームはできるだけ自動化された一貫性のあるプロセスを必要としていました。Forte Digital の 3D アーティストである Piotr Bieryt 氏は、完全に自動化されたカスタムリグを構築し、ArtEngine でスキャンを処理することにしました。
レーザーカットされた合板と 3D プリントされたパーツを使ってリグを組み立てた後、Bieryt 氏は、色の変化や光の反射を防ぐために試作品の内部を黒いベロアで覆い、下からの照明で透明感を表現するために、底面に取り外し可能な黒いプレートを設置しました。そして、このリグは Arduino で制御できるように構成されました。
「物を組み立てたりプロセスを自動化するのは大好きなので、とても楽しい仕事でした!」と Bieryt 氏は言います。
Bieryt 氏は、Flokk の生地の細かい部分を撮影するために、オリンパスの 16 メガピクセルミラーレスカメラと 60mm のマクロレンズ(マイクロフォーサーズシステム)を使用し、ホワイトバランスと色を正確にするために RAW で撮影しました。カラーコレクションの後、Bieryt 氏は ArtEngine での作業を開始しました。
以下は、Bieryt 氏の ArtEngine での典型的なワークフローの概要です。
下の例では、Flokk のチェアに使われている半透明の生地の 10x10cm のスワッチをサンプルとして使用しました。素材をデジタル化する場合、透明度の高い部分があると別に透明度のチャンネルを追加しなければならず、作業は複雑になります。そこで Bieryt 氏は、生地を 2 回スキャンしました。つまり 1 回は側面から光を当てて(標準的なフォトメトリックステレオキャプチャプロセス)、もう 1 回は下から光を当てて(透明度をキャプチャ)スキャンしたのです。
ArtEngine にインポートした後、2 つの画像セットをそれぞれ Multi-Angle to Texture ノードに接続し、16 枚の画像を組み合わせて、アルベド、法線、透明度の 3 つのマップを作りました。
さらに、アルベドマップと法線マップの両方に Gradient Removal(Photoshop のハイパスフィルターに似た処理)を適用して、グラデーションが目に見える部分を除去し、タイル化しやすいようにしました。
Compose Material を適用して 3 つのマップを 1 つのマテリアルに統合した後、Bieryt 氏は Pattern Unwarp を使用して、生地に自然に生じる歪みを補正しました。Bieryt 氏は「後処理の時間を短縮するためにちょっと時間をかけてサンプルをまっすぐにしてからスキャンすることに意味はありますが、ねじれを完璧に取り除けなくても気にすることはありません。ArtEngine には後から修正するための素晴らしいツールがあります」と述べています。
その後、Crop を使ってまっすぐになったテクスチャを 1:1 のアスペクト比で切り出しました。下の画像はそのノードグラフを示したものです。
続けて使われた Mutation Structure はタイリングの品質をさらに向上させるためのノードで、パターンの構造はそのままに、繰り返されるパターンを AI が認識して排除します。
「Mutation Structure は ArtEngine の魔法のような機能です」と Bieryt 氏は言います。「この機能のおかげで、ソフトウェアやアルゴリズムと格闘することなく、スキャンの芸術的な側面にもっと集中できるようになりました。」
ワールドスケールファクターや出力解像度など、いくつかのパラメーターを調整して、10×10cm のスキャンサンプルの 6 倍の大きさで、目立ったタイリングアーティファクトがない、高精細 8K テクスチャが完成しました。
最後に Bieryt 氏は、Height Generation と Roughness / Gloss Generation を使ってハイトマップとラフネスマップを作成し、Compose Material ですべてをまとめ、完成版のテクスチャを簡単にエクスポートできるようにしました。
下の画像は最終的にできたノードグラフを示したものです。
色が異なるだけの素材は 1 回だけスキャンされました。同じ構造の生地を複数色作成し、その素材をチェアの 3D モデルに適用して最終版をレンダリングする作業は、Blender Cycles を使って行われました。
この変革が始まってから、Flokk はすでに目に見える成果を上げています。オンラインチェックアウトが国ごとに展開されたことで、同社の Web トラフィックは大幅に増加しました。また、ディーラーや顧客の満足度が向上し、ブランドロイヤリティや評判が高まりました。また、手動で注文を処理することでかかっていた間接費の削減にもつながっています。
どのように改善がなされたかを知るには、同社の顧客向け Web サイト Flokk.com を見ていただくのが一番でしょう。ユーザーは、興味のあるチェアを選択した後、ほぼすべての部分をカスタマイズすることができ、出来上がった構成を間近でさまざまな角度から見ることができます。また、オンラインで注文を確定する前に、ある部分を変更するための費用を把握することができます。
このプロジェクトは現在も進められており、Flokk は各国の Web サイトにおいてセルフサービス機能の拡充や、営業チームや顧客向けの新しいツールの導入を行っています。例えば、現在進められている取り組みの 1 つに、Configurator を活用した「ショールームモード」があります。これは、Flokk が世界中に持つショールームの iPad にインストールされるアプリで、顧客が店頭で Flokk の製品について簡単に調べ、その場で注文までできるようにするものです。
より広く言えば、この仕事は、顧客体験に投資することや、顧客がオンラインに慣れ、Web やアプリで購買を行うようになってきたことによる嗜好の変化に適応することの重要性を Flokk 全体に示すものとなりました。Flokk は、エンドツーエンドのユーザージャーニーへの投資が遅れがちな家具製造業のような業界において、競争に勝つために非常に有利な立場にいることは確実です。Flokk は、顧客体験を常に最優先に考えて投資を行うという選択を行ったことで、今後の成功につながる持続可能な競争力を獲得したのです。
Is this article helpful for you?
Thank you for your feedback!