警備の管制業務・配置業務を、企画から内製化したReactアプリへ

プロジェクトでの変化

• 管制業務の入力時間
  紙運用比で短縮
• 配置調整の伝達ミス
  減少傾向
• リリースサイクル
  週次

課題

警備会社では、警備員の配置と管制業務が紙・電話・Excelに分散していた。本部が把握する配置情報と、現場警備員が知る実態に常に時差があり、急な配置変更があると電話連絡が大量発生して伝達ミスを生む状況。本部側は工数で疲弊し、警備員側は「今日の自分の現場」を毎朝電話で確認する運用が常態化していた。さらに業務要件は文書化されておらず、属人運用で回っているため、システム化したくても「何を作るか」を整理することからのスタートだった。

アプローチ

1. 01 現場警備員と本部それぞれにヒアリングし、業務フローを図に起こす
2. 02 MVPの範囲を「管制業務」と「配置業務」に絞り、企画書に落とす
3. 03 Supabase + React + TypeScript で素早く画面試作し、企画段階から実物を見せて議論
4. 04 Vercelのプレビュー環境を毎週の現場レビューに使い、フィードバックを翌週リリースに反映
5. 05 スマホ片手操作を前提とした入力UIで、現場の負担を増やさず移行できる構造に
6. 06 初期定着後は機能拡張のロードマップを引き、内製運用に移行できる体制を整備

成功要因

現場起点の要件抽出

業務要件が明文化されていない状態から、現場と本部のヒアリングで業務フローを図に起こすことから着手した。

MVPスコープの絞り込み

管制業務と配置業務の2点に絞り、定着しないと意味がないシステムにスコープの広がりを持ち込まなかった。

プレビュー駆動の現場巻き込み

Vercelのプレビュー環境を毎週の現場レビューに使い、業務側の発言コストを下げた。

Supabase最小構成

認証・DB・ストレージをSupabaseでまとめ、企画段階でも素早く実物を見せられる体制を維持した。

ソリューション

Supabaseを基盤として認証・DB・ストレージを最小構成でまとめ、フロントは React + TypeScript で構築。Vercelのプレビュー環境を毎週レビューに使い、現場のフィードバックを翌週のリリースに反映するサイクルを定着させた。結果、配置変更の伝達コストが大幅に減少し、本部・現場とも「電話で確認する」運用がアプリ完結に置き換わった。MVPローンチ後も同じ体制で機能拡張を継続している。