ブログ

産業機械メーカー様向けに、お客様専用ダッシュボードの構築をご提案しました。製品を導入いただいたお客様が、購入履歴・修理履歴・部品情報・メンテナンス動画を一つの画面で確認できる仕組みです。
画面数が多く、社内の既存データとの連携が前提となるため、要件定義と設計に工数を配分し、実装対象と対象外の範囲を見積書上で切り分けた提案となっています。

クライアント企業について

産業機械の製造・販売を手がける事業会社です。製品は導入後に長期間使用されるため、修理・保守・部品交換といったアフターサポートが事業の柱となっています。管理対象となる情報は以下の通りです。

出荷・購入履歴
修理・保守記録
標準部品／カスタマイズ品の仕様書・部品図
メンテナンス手順・トラブルシューティング情報

これらが社内の複数のシステムや資料に分散しており、お客様からの問い合わせが営業担当者に集中していました。お客様自身が情報を検索できる環境を用意したい、というご要望をいただきました。

プロジェクト概要：お客様ダッシュボードが求められた背景と課題

課題1：お客様（表側）の視点

購入履歴をすぐに確認できない
修理・保守記録が紙やPDFで散在し、担当者の交代時に引き継がれない
仕様書や部品図の入手に、営業担当への問い合わせが必要
トラブル発生時の対処方法が文書のみでは伝わりにくい

これらの課題に対し、購入履歴・修理履歴・標準部品・カスタマイズ品・メンテナンス＆トラブルシューティングの各情報を、検索機能付きの「一覧＋詳細」画面として設計しました。作業手順については動画専用の画面を別に用意し、仕様書・部品図はPDFでダウンロードできる導線を追加しています。

課題2：運営側（裏側）の視点

出荷情報や保守記録は社内の別システムに存在するため、二重入力を避ける必要がある
お客様アカウントを1件ずつ手作業で登録する運用は現実的でない
同一企業のアカウントでも、役割によって閲覧可能な情報を分ける必要がある
社内における「お客様」と「顧客」の定義が整理されていない

画面を作るだけでなく、既存の社内データを手作業なしで反映し続ける仕組みの設計が、本案件の中心的な検討事項となりました。

提案のポイント

1. 要件定義・設計・進行管理への工数配分

今回の見積りでは下記4項目の見積もりを、総額の約4分の1に配分しました。

要件定義
画面設計
システム設計
進行管理

一覧・詳細・新規登録・編集・削除の各画面が数十パターン発生するため、設計段階の判断が全画面に波及します。特にシステム設計は、データの保持方法と、各画面が参照する情報を定める工程です。ここが確定していないと、開発後半での表示項目の追加が全画面の改修につながります。

2. 実装しない範囲を見積書上で明示

費用を抑えるため、実装対象から外す範囲とその理由を見積書に記載しています。

SPA方式の見送り：本件はPHPによる動的構築を前提としています。画面全体を再読み込みしないSPA（シングルページアプリケーション）方式も実装可能ですが、画面とデータをつなぐAPI（システム同士がデータをやり取りする窓口）の構築が別途必要となり、費用が増加します。今回は対象から外し、その理由を補足欄に記載しました。

管理画面のデザイン制作の省略：社内担当者のみが使用する管理画面は、デザインを新規作成せず、既製のCSSライブラリ（画面の見た目を整える部品集）を利用する前提としています。お客様が閲覧する画面にデザイン費を配分し、管理画面は機能面を優先しました。

条件により不要となる範囲の明示：WEB管理画面については、第一弾サイトがWordPress等のCMSで構築される場合は不要となる旨を備考に記載しています。この結果、見積書は任意項目を含む場合と、含まない場合の2つの金額を提示する構成になりました。予算に応じて調整可能な範囲が確認できます。

3. 基幹データ連携と権限設計の計上

表示するデータを最新に保つため、以下を独立項目として計上しています。

出荷一覧マスタ連携機能：購入履歴画面のデータを社内の出荷データから取得
電子保守票連携機能：修理履歴画面のデータを保守記録から取得
CSV一括アップロード／ダウンロード機能：お客様情報などを表計算ソフト形式のファイルで一括登録・書き出し

連携方式は、CSVによる手動アップロードとシステム間の自動連携の双方を想定しています。自動連携は既存システム側の改修を伴う場合があるため、まずCSVで運用を開始し、後から自動連携へ切り替えられる構成としました。

権限については、アカウントの新規登録・編集に閲覧機能制限設定を含めています。また、管理画面上の「お客様」と「顧客」の区別が確認できなかったため、別機能として分けて見積り、同一の管理で足りる場合は不要となる旨を備考に記載しました。

使用技術・ツール

PHP（サーバー側で画面を生成する動的構築）
API連携（システム同士のデータ受け渡し。SPA方式は今回は対象外）
フロントエンド／バックエンドフレームワーク
CSSライブラリ（管理画面の見た目を整える部品集）
CSV連携（表計算ソフト形式での一括登録・書き出し）
AWS（WEBサーバー構築を想定）
自動翻訳サービス（shutto翻訳等を想定した日英言語切替）
MAツール（マーケティングオートメーション／計測タグの設置）
Google Tag Manager／Google Analytics 4
Looker Studio（GA4データのレポート作成）

プロジェクトで担当した役割

現行業務・課題の整理
お客様向け画面／管理画面の機能要件の洗い出し
画面設計・システム設計方針の策定
基幹データ連携方式（CSV／自動連携）の検討
権限設計・アカウント運用方針の整理
機能単位での概算見積の作成（任意項目の切り分けを含む）

実装したい機能とご予算・運用体制を踏まえ、段階的に導入できる構成案を作成しました。

おわりに

お客様専用ダッシュボードは、公開後もデータを更新し続けることが前提となる仕組みです。そのため、機能の一覧だけでなく、誰がどの方法で情報を更新するかを含めた設計が必要になります。
今回の提案では、要件定義と設計に総額の約4分の1を配分し、実装しない範囲を理由とともに明示し、基幹データ連携と権限設計を初期段階から計上しました。
blueでは、実装したい機能とご予算・運用体制のバランス調整について、設計段階からご提案します。会員向けマイページやお客様専用サイトの構築を検討されている方は、ぜひ一度blueにご相談ください。