制作実績 / Web アプリケーション

イベント当日の混雑と告知を、
地図の上で可視化する

文化祭、地域のお祭り、観光の回遊イベント。 会場のどこに何があり、いまどこが混んでいて、次に何が始まるのか。 来場者が知りたいことを、一枚の地図にまとめました。

文化祭向けの画面。校舎の見取り図に出し物のピンが並ぶ

文化祭

お祭り向けの画面。境内図に屋台のピンが並ぶ

地域のお祭り

観光向けの画面。城下町の地図に見どころのピンが並ぶ

観光めぐり

背景

来場者が増えても、
満足度は上がらない

イベント当日にいちばん多い不満は、集客ではなく「並んだ」「どこにあるか分からなかった」でした。 人通りの多い通路に人が集まり、少し外れた出店は昼どきでも空いている。 会場全体では余裕があるのに、体験としては混雑している。

さらに当日は予定が変わります。完売、雨天による会場変更、開演の遅れ。 紙のパンフレットは配った時点で更新が止まり、放送は聞き逃せば終わりです。

Meguru は、この二つ——人の偏り変わり続ける情報——を 地図の上で解くために作りました。

ひとつの基盤で

用途ごとに、別のサービスの顔になる

地図画像を差し替え、配色と用語を設定するだけ。 以下の3つは、同じコードベース・同じデータ構造で動いています。

文化祭の出し物一覧
文化祭・学園祭

校舎の見取り図で

屋内はGPSが届きません。フロアごとの見取り図を切り替える方式にしました。

  • フロア切替(1F / 2F / 中庭)
  • クラスごとの混雑申告
  • 「空いてる出し物」で絞り込み
お祭りの屋台一覧
地域のお祭り

境内図に屋台を並べて

屋台の並びと休憩所の位置。初めて来た人でも迷わない構成にしています。

  • 屋台ごとの混み具合
  • 奉納・抽選会などの進行
  • 臨時のお知らせを即時反映
観光の見どころ一覧
観光・史跡めぐり

城下町を回遊する

文化財に「大混雑」と赤字で出すのは強すぎるため、用語と記号を用途ごとに変えています。

  • 見どころの解説と現在の状況
  • ガイドツアーの開始時刻
  • 臨時休止・早じまいの周知

主な機能

現地の「今」を、
三つの見え方で

時間順に並んだ当日のお知らせ。現在時刻の位置に線が入る

地図 — どこに何があるか

ピンの色と文字で混み具合が一目で分かります。ドラッグで移動、ピンチで拡大。 色が判別しづらい環境でも読めるよう、ピンには文字を入れています。

いま — 何が起きているか

予定と当日の告知を一本の時間軸にまとめました。現在時刻に線が入り、 過ぎたものは薄くなります。期限を過ぎた告知は自動で消えます。

一覧 — 何があるか

全体を並べて、最終更新からの経過時間も表示。選ぶと地図の該当ピンへ飛びます。

出店者の更新画面

QRを読むだけで自分の店の更新ページが開きます。ログイン不要、ボタン3つ。 当日の忙しい現場でも操作が続くことを最優先にしました。

設計で考えたこと

現場が続けられるかどうかで決めた

機能の多さより、当日の運用が破綻しないことを優先しました。

古い情報は、自動で黙る

更新が20分途絶えた申告は「情報なし」に戻します。 誰も更新しなくなるのは前提。古い情報を出し続けるほうが、何も出さないより危険だからです。

混雑は3段階だけ

待ち時間を分単位で出すと、外れたときに苦情になり、申告する側も身構えます。 空いてる・ふつう・混雑の3つに絞り、1タップで終わる形にしました。

出店者にログインさせない

当日にIDとパスワードは機能しません。店ごとに発行したトークン付きURLをQRで配り、 自分の店だけを更新できるようにしています。

屋内でも使えること

校舎の中でGPSは届きません。地図画像の上に0〜1の正規化座標でピンを置く方式にしたため、 見取り図でも実地図でも同じ仕組みで動きます。

時刻はサーバーが決める

更新時刻を端末側で持つと、時計のずれで鮮度が狂います。 記録はすべてサーバー時刻。「何分前の情報か」を常に正しく出せます。

用語まで差し替える

出し物・屋台・見どころ。混雑・大混雑・混みあい。 配色だけでなく言葉も設定で切り替えられるため、現場の空気に合わせられます。

技術構成

小さく作って、
そのまま運用できる形に

サーバーの常時運用や定期バッチを必要としない構成にしました。 鮮度切れの判定は保存された状態ではなく読み出し時の計算で行うため、 データを書き換えるジョブが要りません。

Next.js (App Router) TypeScript Tailwind CSS Supabase (PostgreSQL) Row Level Security Supabase Storage Vercel
テーマ設定 配色・用語・記号を用途ごとに差し替え 文化祭 見取り図・屋内 お祭り 境内図・屋外 観光 広域・通年 共通エンジン 拠点・混雑・告知・地図レイヤー・権限

デモ

実際に触れます

3つの用途をそれぞれ公開しています。スマートフォンでの閲覧を想定した画面です。 地図はドラッグとピンチで操作でき、混雑状況は実際のデータベースから読み込んでいます。

文化祭のデモを見る お祭り 観光