概要
自動車・船舶・住宅向けプロテクションフィルムブランドのデジタル体験を、B2B と DTC の両方に耐える形で再構築した案件です。
Contentstack（CMS）× BigCommerce（DTC）× Bynder（DAM）のヘッドレス構成で、コンテンツ運用とコマースを分離しました。
課題
施工店・ディーラー向け情報と一般消費者向け購入導線が同じナビに混在し、双方の離脱が増えていました。
施工店ロケーターが静的リストで、国際向けコンテンツ管理やモバイル最適の DTC マーチャンダイジングも不足していました。
アプローチ
オーディエンス別ジャーニーにナビを再設計。BigCommerce の商品一覧と CMS コンポーネントを接続。
社内 DAP API と Google Maps で動的な施工店ロケーターを実装。構造化データで SEO も強化。
再利用可能なデザインシステムと Bynder 連携で、マーケが開発なしにページを量産できる状態にしました。
成果
B2B リードと DTC 購入の摩擦を減らし、ブランド刷新後の体験を一本化。
国際コンテンツとアセット運用をチームが自走できる基盤を残せました。
担当範囲
- ヘッドレス構成の設計・実装
- B2B / DTC ナビと LP
- Maps ロケーター API 連携
- デザインシステム / コンポーネント
開発プロセス
- オーディエンス調査と IA
- コンポーザブルなアーキテクチャ設計
- 実装と SEO / パフォーマンス調整
- 運用引き継ぎ
ポイント
- B2B / DTC ナビ分離
- Google Maps 施工店ロケーター
- コンポーザブルなデザインシステム
使用技術・ツール
- BigCommerce
- Contentstack
- Bynder
- React / Next.js
- TypeScript
- Google Maps API
- GitHub
- REST / GraphQL
