Celeritas とは
Sports Event Web Manager は、学校・企業・地域コミュニティのスポーツイベント運営を、準備から当日進行、記録出力まで一気通貫で扱うためのWebアプリケーションです。
目的はシンプルで、運営の現場で起こる以下をなくすことでした。
- 情報更新の遅延
- 紙と口頭連絡に依存した運用
- 担当者だけが状況を把握している状態
- 進行変更時の伝達ミス

管理画面のダッシュボード。イベント全体の状態を俯瞰しながら編集作業に入れます。
主な機能
イベント管理
- イベントの作成・編集・削除(日程、場所、説明、予備日)
- アクティブイベントの切り替え
- グリッド表示、スケジュール表示、タイムライン表示
- 役割ごとの担当者管理
- 管理者と一般閲覧者の権限分離
競技管理
- トーナメント形式(3位決定戦、敗者復活のオプション)
- 総当たり形式(得点ルールのカスタマイズ)
- リーグ形式(グループステージ + プレーオフ)
- ランキング形式(独自基準の順位付け)
- 競技ごとのルール・マニュアル記録
- 競技単位での担当者割り当て
参加者・チーム管理
- 学年・クラス単位の名簿管理
- チーム・選手登録
- チームカラー設定
- 名簿データからのチーム自動生成
試合進行・スケジュール管理
- 複数コート同時進行の管理
- 試合枠、休憩枠、昼休み枠の管理
- 準備・片付け時間の取り込み
- 試合数と利用可能時間に基づく時間配分
- イベント全体タイムライン表示
スコアリング・結果管理
- リアルタイムスコア更新
- 試合状態(予定 / 進行中 / 完了)の管理
- 自動順位計算(勝ち点、得失点差)
- 3位決定戦の処理
- スコア変更履歴の管理

複数競技と複数コートの進行を、時間軸で追えるタイムライン表示。
運営向け機能
- 集中管理ダッシュボード
- スコア入力・修正
- バックアップパネル
- ヘルプページ内蔵
- Firebase Authentication による認証
- Excelエクスポート(公式記録向け)
管理画面の機能は「当日使い切れること」を優先し、細かい設定より操作負荷の低さを重視しています。

運営向け編集画面。試合情報の更新や進行管理を短い動線で実行できます。
観戦側(生徒側)体験
- 全生徒向けの閲覧導線
- 試合の進行状況をリアルタイムで確認
- 遅延や変更の反映を待たずに把握
- プレーオフ進出状況を視覚的に追跡
「暑い中いちいち試合会場まで見に行く必要がある」という不便を減らし、どこで何が進んでいるかを画面上で判断できる設計にしています。

トーナメント表示。勝ち上がりと進行状況をひと目で確認できます。
技術スタック
- React 18
- TypeScript
- Material UI
- Firebase Realtime Database
- Firebase Authentication
- Framer Motion
- i18next / react-i18next
- ExcelJS
- @g-loot/react-tournament-brackets
実装スコープ
リポジトリには、以下の実装レイヤーを含みます。
- 管理系コンポーネント群
- スコアボード・タイムライン・競技詳細画面
- 認証 / テーマ / DB連携のContextとHook
- スケジュール生成ユーティリティ
- 形式別のエクスポート実装(トーナメント、リーグ、ランキング等)
- 多言語ロケール管理(ja / en / fr / de / zh)
本番運用での成果
- 想定ピーク約150同時接続で運用
- 本番運用時の重大インシデントなし
- 手作業ベースの集計・連絡負荷を削減
- 運営側と閲覧側の情報格差を縮小