発注システムDX:Google Cloud SPA構築 × Salesforce × CTI連携

クラウドネイティブな開発で受注を刷新

  • React
  • Google Cloud
  • SPA

自動車部品商社

卸売・流通業

ご依頼の背景

クラウドネイティブな開発で受注を刷新

整備工場からの電話注文に依存していた旧来の受注体制を、最新のクラウド技術を駆使した次世代発注プラットフォームへと刷新しました。Google Cloudを活用したサーバーレスアーキテクチャの採用により、アクセスの増減に柔軟に対応できる高可用なシステムを実現。
フロントエンドにはReactを用いたSPA(Single Page Application)を採用し、膨大な部品マスタからでもストレスなく検索・注文できる高速なユーザー体験を提供しています。
既存の基幹システムやSalesforce、CTI環境との高度なデータ連携も実現し、バックオフィス業務の劇的なスピードアップと精度向上を同時に達成しました。

自動車部品商社

全国の整備工場を顧客に持ち、数十万点に及ぶ自動車部品の供給を担う専門商社です。迅速な配送と正確な部品特定を強みとしていますが、さらなる成長に向けてアナログな受注オペレーションのデジタル化を急務としていました。

抱えていた課題

  1. 01

    電話応対に忙殺される現場と、属人化した商品特定プロセスによる業務の不透明化

    従来の受注フローは整備工場からの電話が主体であり、品番が不明確な状態での問い合わせが頻発していました。コールセンターの担当者は、個人の経験やメモに頼って商品を特定しており、対応の属人化が深刻な課題となっていました。
    特に繁忙期には入電数が許容範囲を超え、受注の取りこぼしによる機会損失が発生していました。

  2. 02

    レガシーな管理体制に起因するデータ不整合による事務コストの増大

    オンプレミスの基幹DB、Salesforceが個別に運用されており、情報の同期が不十分でした。注文内容や顧客情報を複数のシステムへ手入力する作業が発生し、入力ミスや在庫情報の乖離によるミスが発生していました。
    顧客が注文情報を見えないため、納期回答のためだけに電話が発生するという課題がありました。

導入ソリューション

[メインビジュアル:システムアーキテクチャのイメージ]

抱えていた課題

アナログな受注フローによる属人化と機会損失

従来の受注フローは整備工場からの電話が主体であり、品番が不明確な状態での問い合わせが頻発していました。コールセンターの担当者は、個人の経験やメモに頼って商品を特定しており、対応の属人化が深刻な課題となっていました。 特に繁忙期には入電数が許容範囲を超え、受注の取りこぼしによる機会損失が発生していました。

整備工場 曖昧な電話注文 コールセンター 対応の属人化・過負荷

レガシーな管理体制に起因するデータ不整合と、
二重入力による事務コストの増大

オンプレミスの基幹DB、Salesforceが個別に運用されており、情報の同期が不十分でした。注文内容や顧客情報を複数のシステムへ手入力する作業が発生し、入力ミスや在庫情報の乖離によるミスが発生していました。 顧客が注文情報を見えないため、納期回答のためだけに電話が発生するという課題がありました。

導入ソリューション

SOLUTION マイクロアーキテクチャ思想に基づくサーバーレスプラットフォーム

ビジネスの拡張性と運用の柔軟性を担保するため、マイクロアーキテクチャの思想を取り入れたサーバーレス構成を提案・構築しました。システムはGoogle CloudのCloud Runを中心としたコンテナベースのサーバーレス環境で稼働しています。これにより、インフラの管理負荷を最小限に抑えつつ、急激なトラフィック増大にも自動スケーリングで対応、アクセス数に応じた適正コストでの運用可能な基盤を実現しました。

フロントエンドとバックエンドを完全に分離し、APIベースの疎結合な設計を採用することで、将来的な機能拡張やSalesforce、CTIといった外部システムとの連携を容易にしています。特にデータの同期にはこだわり、オンプレミスのSQL ServerからCloud SQLへCloud VPN経由で高頻度な差分連携を行うバッチを構築。最新の在庫・価格情報を顧客に提供できる環境を整えました。さらに、受注状況のステータス管理機能を実装し、チーム全体で業務進捗を可視化することで、属人化の解消を技術側面から強力にバックアップしました。

MODERN ARCHITECTURE

Front-end (React SPA)
API (Cloud Run)
External Systems & DB

提供した技術

Reactによる高性能SPA開発と、Google Cloud of マネージドサービス活用

ユーザーインターフェースにはReactを採用し、SPA(Single Page Application)として開発することで、ネイティブアプリのような滑らかで高速な操作感を実現しました。自動車部品という膨大かつ複雑な検索要件に対し、画面遷移を伴わない非同期通信によるフィルタリング機能を実装。整備士が現場でストレスなく部品を特定し、カートに追加できるUI/UXを追求しました。

バックエンドでは、Cloud Runに加えて、特定のイベントトリガーに基づき動作するCloud Functionsを併用し、マイクロサービス的なアプローチで機能を分散配置しています。認証基盤にはFirebase Authenticationを活用してセキュリティと利便性を両立。さらに、Cloud ArmorによるWAF機能の付与やCloud Logging/Monitoringによる監視体制を構築し、エンタープライズ水準の信頼性を確保しました。このようにGoogle Cloudのマネージドサービスをフル活用することで、インフラ構築期間の短縮と、高度なスケーラビリティを兼ね備えたモダンなシステムアーキテクチャを実現しています。

Applied Stack

React 18 Google Cloud Run Firebase Authentication Cloud Functions Cloud Armor (WAF)

導入効果

受注精度と業務スピードが飛躍的に向上し、戦略的なカスタマーサポート体制を確立

発注システムの利用により、電話による単純な注文依頼が減少し、コールセンター業務負荷が改善されました。システム連携の自動化により、ミスが抑制され、データに基づいた迅速な経営判断が可能になっています。

  1. 01

    受注業務の高速化と正確性

    Reactによる高速なSPAにより、顧客自らが正確な商品検索を行えるようになりました。結果として、品番特定に要する時間が短縮され、手入力によるミスも減少なりました。CTIの利用により、電話での聞き取りミスに起因する返品や誤配送のコストが削減されています。

  2. 02

    サーバーレスによる運用最適化

    サーバーレスアーキテクチャの採用により、サーバーの保守やキャパシティプランニングから解放されました。夜間や休日などアクセスが少ない時間帯のコストを抑制しつつ、注文が集中する月曜の朝でも遅延のない安定したサービス提供を実現し、コスト最適化に成功しました。

  3. 03

    システム間のリアルタイム連携

    基幹DB、Salesforce、CTIがGoogle Cloudをハブとしてシームレスに繋がりました。顧客から電話があった際も、CTI連携により即座に注文履歴やSalesforceの顧客情報を参照できるため、より高度でパーソナライズされた顧客体験を提供できるようになりました。

担当者の声

エヌデーデー担当者からの声

本プロジェクトでは、単なるシステムの置き換えではなく、自動車部品商の未来を支えるアーキテクチャの構築を目指しました。特にこだわったのは、Reactを用いたSPAによる高速なレスポンスと、Google Cloudのコンテナ技術を用いたサーバーレスな構成です。マイクロアーキテクチャの思想を取り入れることで、今後のビジネス変化にも柔軟に対応できる『しなやかなシステム』を実現できました。また、Salesforceとの連携によるCRMの強化や、レガシーなオンプレミスDBとのリアルタイムな同期など、技術的に難易度の高い課題もありましたが、弊社のクラウドネイティブな知見を活かして解決できたことを誇りに思います。今後も技術の力でお客様の成長を支援してまいります。