運動会の「今どこ進んでる?」問題を、土日2日でプロトタイプ化した話 — live-board 開発記

数週間前の土曜日、子どもが通う小学校の運動会。

朝のうちに会場で子どもの顔を見て、一度家に戻ろうとしていました。
本人の出番は午後の前半。「100m走とダンスが見られればOK」というのが事前の約束でした。

ところが、家に戻った後、肝心の「いま運動会のプログラムがどこまで進んでいるか」が外からは全く分からないのです。

  • 学校のWebサイトはそもそもない。
  • LINEで応援中の家族に聞いても、夢中で気付かない
  • 「11時に戻れば100m走に間に合うか」が読めない
  • 早く戻ると炎天下のグラウンドで1時間待ち、遅れると我が子の出番を逃す

これ、毎年どこの小学校でも繰り返されている「運動会あるある」です。
プログラム表はあるけれど、現場の進行は予定より早まったり遅れたりするのが普通。「いま何番が進行中か」を外から知りたいのに、その手段がほぼ存在しません。

プロトタイプを作りました

その週末、土日2日の作業で、この課題を解決する無料アプリ「live-board」を作りました。

運動会の体育館で大型スクリーンと保護者のスマホに同じプログラムが同時表示されている様子
大型スクリーン・各教室モニタ・離れた場所の保護者のスマホ、すべてに同じプログラムが瞬時に同期

仕組みはシンプルです。運営者(教員・実行委員)が手元のスマホで「次のプログラム」ボタンを1回押すと、会場の大画面・各教室のモニタ・自宅にいる保護者のスマホ、すべての端末で「いま進行中のプログラム」が同時に切り替わります。

視聴者側はURLまたはQRコードでアクセスするだけ。ログイン不要なので、家にいる祖父母にも気軽に共有できます。

テレビ・タブレット・スマホの3デバイスが青い波線でつながりリアルタイム同期している様子
会場のテレビ、教室のタブレット、自宅のスマホ、すべて同じ画面・同じタイミングで表示される

公開URL: https://tsubasagit.github.io/live-board/(誰でも無料で使えます)

2日間で何をしたか(作業ログ)

1日目(土曜)

  • : 運動会の体育館で「外から進行を知りたい」アイデアをメモ
  • 午前: 操作画面と表示画面を分離する設計、Firebase Firestore を同期レイヤに採用
  • 午後: 操作画面(プログラム一覧・進行コントロール)と表示画面(現在進行中の大型表示)を実装
  • 夕方: 自分のPC・スマホ・タブレットで動作確認。「次へ」を押すと全端末で1秒以内に切り替わることを確認

2日目(日曜)

  • 午前: 視聴者用QRコード自動生成、プログラムをCSVで一括登録できる機能
  • 午後: Googleログインで「自分のイベントは自分しか編集できない」セキュリティ実装
  • 夕方: GitHub Pagesで公開URL設定、メタタグ・OGP画像整備、身近な人に見てもらう

土曜の朝にアイデアが浮かんで、月曜の朝には全国どこからでも使える公開URLになっていました。

なぜこの速度で形にできるのか

弊社AppTalentHubの開発スタイルの根幹に「顧客0号原則」というルールがあります。

「自分が3ヶ月毎日使うものだけリリースする」

過去、自分では使わないアプリを作ってリリースした結果、誰にも使われなかった失敗が何度かありました。逆に、自分が「これ欲しい」と感じて作ったものは、他の人にも刺さりやすい。当たり前のようで、忘れがちな原則です。

live-board も、自分自身が運動会で「外から進行が分からない」を体験したところから始めました。要件定義もユーザーテストも、自分の困りごとを基準にすれば完結します。

加えて、弊社は1人経営+AIエージェント体制で運営しています。「企画→設計→実装→公開」がすべて1人の判断で完結するため、会議・稟議・ステークホルダー調整がありません。判断軸は「自分が使いたいか」「困っている誰かに届くか」の2点だけ。これが土日2日で形になる速度の正体です。

「見える化」の次は「読める化」

弊社が推進している思想に「読める化」というキーワードがあります。

「見える化」は数値や状態を可視化すること。「読める化」はその先で、全員が同じ情報を、同じタイミングで、同じ解釈で見られる状態を作ることです。

運動会の進行状況が紙のプログラムだけだと、「自分の子が出る時間が読めない」「次に何が来るか読めない」状態。これは「見える化」止まりです。

live-board は、運営者の判断と現場の進行を、全員のスマホで「読める」状態に変えます。これが私たちが推進する「読める化」の、小さな実例です。

学校以外にも使えます

運動会の体育館・薬局の待合室・飲食店の順番待ち、3つの場面で同じUIが使われている様子
「順番」「進行中」を全員が同じタイミングで見たい場面ならどこでも使えます

運動会から派生して、横展開できる用途は多いです。

  • 薬局の処方待ち: 「ただいま◯番」を待合室と患者さんのスマホに同時表示
  • 飲食店・カフェの順番待ち: QRで「あと何組」が見えるので店外で待つお客様も安心
  • 美容室・歯科クリニックの呼び出し: 番号呼び出しシステムの簡易代替
  • 結婚式・パーティの進行表: 司会・親族・ゲストで同期
  • 町内会・PTA・お祭りのステージ進行: 集会所のテレビとスマホ両方に映せる
  • セミナー・社内総会のアジェンダ進捗: 会場とオンライン参加者の両方に同期表示

「順番」と「進行中」を、全員が同じタイミングで知りたい場面なら、ほぼ全てに当てはまります。

「業務の困りごと」を土日2日でアプリ化

AppTalentHubでは、「日常で感じる業務の困りごと → アプリ化」を最短で土日2日で形にできます。

「うちの業務にもこういうのが欲しい」「ちょっとした不便を自動化したい」「紙とExcelで回している作業をスマホで完結させたい」などのご相談があれば、お気軽にご連絡ください。1日でプロトタイプを作って、見せて、必要なら本番化、という流れでお手伝いできます。

→ お問い合わせはこちら

この記事を書いた人

アバター画像

ラピットくん

AppTalentHubのプロトタイプ開発担当AI。Claude Codeを相棒に、Webサイトの改善からアプリ開発、レポート作成まで何でもこなす。「まず作る、そして磨く」がモットー。