待ち時間で作る：re:Invent参加中に自分用イベント管理アプリを作った話

2025.12.02
こんにちは、豊島です。
 はじめにre:Invent 2025の初日、列待ちやシャトルバスでの移動中などの隙間時間に自分のためだけのイベント管理アプリケーションを作ることにしました。

公式アプリケーションでは満たせないわがままな要求を実現することを目標にしました。
 どういう機能（わがまま）が欲しかったのか予定の一元管理
セッション（公式）とプライベート（面会・打ち合わせなど）の予定を一元管理できること

隙間時間に最適化した設計
列待ち、シャトルバスでの移動、会場間の歩行など、短時間でも使いやすい画面設計にしたかった。
画面遷移を少なく、シンプルで見やすくしたい

イベント登録機能
「満席/walk-ups only」表示のセッションも候補として登録できて、疲労感やモチベーションなど、その場の状態に応じて柔軟に選べるようにしたい

会場の位置を把握できるマップ表示
re:Invent 初参加だったため、会場名だけでなく、大まかな配置を確認できるマップが欲しかった

MCPサーバーとの連携機能
公開されたMCPサーバーからセッション情報を取得・検索し、さらにそれらを登録できるようにしたかった（※開催中に発表された新しいセッションは反映されていないようです）

 注意事項今回利用したMCPサーバー reinvent-mcp-2025はセッションを対象にセッションコードやタイトル、概要、セッションタイプと長さ（分）などを取得することが可能です。
※開催日時（日付・時間）や会場（Venue）、期間中に追加される新セッションがデータに含まれていないことがあり、完全な網羅性は保証されません。最新セッションは公式アプリや現地情報も併用するのが安心です。
 どう作ったか今回はv0を利用して作成しています。v0はiOSのモバイルアプリ版もあり、手元のスマホから指示を出せることに加え、表示の最適化が見込めるためです。
まずは会場の位置を把握したかったので、こちらからマップ情報をスクショして、たたき台を作成しました。


指示内容
スクリーンショットを元にアプリケーションを作成したいです。
黄色く記されたVenueを選択することでイベントを登録できるようにしてください。
イベントの登録内容はVenue(場所)、開始時間、終了時間、イベント名とし、時間は30分刻み、VenueはPrivateも追加してください。
大まかなものができましたが、後で修正するのでひとまずOKとします。（まずは機能を満たせていること）

1~6のイベント会場をクリックするとイベントの登録画面が出てきます。



必要な機能は実装されています。

この画面をマップビュー（地図を見ながらイベントを作成できる画面）として、次にタイムテーブル（時間帯からイベント作成できる画面）を作ります。
Timetable Viewを作成してください。
- 6:00〜23:00まで30分刻みの時間スロット
- 6つの会場（Encore, Wynn, The Venetian, Caesars Forum, MGM Grand, Mandalay Bay）
- 各スロットに「+ Add Session」ボタン
- 会場ごとに異なる色分け


タイムテーブルもひとまず問題なさそうです。

この段階でイベントの編集/削除も実装されていました（よしなになってくれたようです）
次にMCPサーバーとの連携（開発者モード）を作成します。

ここでは一気にプロンプトを入力しました。
Developer Modeを追加してください。
- 右上に開発者モードボタン
- re:Invent 2025 MCP Serverに接続
  - https://github.com/manu-mishra/reinvent-mcp-2025 このリポジトリの内容を確認した上で実装してください
- セッション一覧を取得・表示
- セッションコード、タイトル、レベル、タイプを表示

実装したDeveloper Modeに検索・フィルター機能を追加してください。
- タイトル、コード、概要での検索
- トピックでのフィルター
- レベル（100-400）でのフィルター
- ページネーション（1ページ20件）

更にMCPのセッションをカレンダーにインポートする機能を追加してください。
- 「+ Add」ボタンでインポートダイアログを開く
- 日付、会場、開始時間を選択
- セッションの長さから終了時間を自動計算
改善の余地はありますが、必要な情報は取得できていそうです。

雑なプロンプトですが、色味と操作感を修正するべく、下記の指示を出しました。
色味や操作感について、UI/UXが最適になるようにしてください
カラーパレットはAWSを参考にしてください
ひとまず改善されました。

さらにv0アプリ版からの利用したいこともあり、モバイル最適化の指示を出して...
モバイル版を最適化してください。
- Developer Modeを全画面表示
- Venues凡例をグリッドレイアウトに
- 日付タブを横スクロールからボタン列に
全体的な調整を入れました（プロンプトは割愛します）
re:Inventの会期日数を分けて管理できるように
全体的なデザインの修正
もう少し操作体験を自分好みに（ボタンを多くして、モバイルでの操作を簡単に）
AWS公式のスケジュール追加のデザインが好きだったため、スクショを添付して修正
会場の表示をスティッキー表示にして、どこで開催されるセッションなのか分かるように

...などなど

最後にlocalStorageに保存できるようにしておきました。
カレンダーのイベントをブラウザのlocalStorageに保存してください。
- ページリロードしてもデータが消えないように
- イベントの追加・編集・削除時に自動保存
作成したアプリケーションは公開しています。






現在（re:Invent初日）実際に使用しています。
 まとめちょっとした隙間時間を利用して、自分のためだけのイベント管理アプリケーションを作成しました。

この経験でわかったのは、「自分に必要な情報が揃ったアプリを持つことで体験は大きく違ってくる」ということです。

これをご覧になっている方がre:Inventや類似のイベントに参加する際は、公式アプリに頼ることに加えて、自分だけの使いやすさを追求するアプリを作ってみるのもよいかもしれません。