FlutterFlow「Campus」の開発物語：エージェント時代における理想的なワークスペースの構築

FlutterFlow は、あらゆる作業を並列配置できる 2Dキャンバス型プロトタイプを開発し、それが実用化されたフル製品**「Campus」**へと進化させました。現在、macOS 上で無料公開されています。本記事では、開発に至るまでの思考プロセスと技術的裏話を紹介します。

コンテキストスイッチングの時代

• 従来の開発スタイル: 数週間かけて機能を計画・実装するリニアなサイクルを繰り返す方式でした。
• 状況の変化: エージェント型コーディング（AI を活用したコード生成）の登場により、効率は大幅に向上しました。
  • タスクの詳細な議論よりも、エージェントに任せる方が有利となりました。
• 新しい働き方: 長期間一点集中ではなく、複数の作業を並列で進行するスタイルが標準になりつつあります。
  • ※過去の注意力と現在の注意力の比較では、現在の方が疲労感が増している傾向にあります。
• 課題: 作業量は減少していますが、ソフトウェアエンジニアリング業務はより疲弊しています。
  • その主な原因はコンテキストスイッチングのコストであると認識されています。

なぜ私はエージェントをマインクラフトに導入したのか？

アイデアの文脈（コンテクスト）を改善するために行われた実験です。

• マインクラフトを選んだ理由:
  • IDE の「聖杯」であるこのゲームへの信頼感。
  • 3D でアイデアのプロトタイプを作ることができる利点。
  • 優れたモッドコミュニティが存在し、基本的な機能（3D、ネットワークなど）がすでに実装済み。
  • ゼロから再発明する手間が省ける。
• 実験の結果:
  • 「物理的な空間」で作業を置きながら人間関係も維持できるというコンセプトに魅力を感じていましたが、最終的に2D の方が直感的であると結論付けられました。
  • FlutterFlow を通じて 3D プロトタイプから 2D プロトTOTYPE に移行し、数日以内に実用的なキャンバスワークスペースを実現しました。

プロジェクト「Work Canvas」（現在の Campus）

当初の計画ではなかったものの、チームへの共有によりあっという間に普及したプロジェクトです。

• コンセプト: 実際に作業できる協業型の無限キャンバス。
  • ターミナル、ウェブブラウザ、アセットなど、様々なタイルタイプを標準サポート。
  • 広範なプラグインシステムの開発も進行中。
  • 目標は**「作業のためのサンドボックス」**を構築すること。
• マルチプレイヤー機能:
  • マインクラフトでの幼少期の思い出（友達と遊ぶ楽しさ）を元に設計。
  • 空間を作成し、自分好みにカスタマイズして友人と共有できる自然な感覚を提供。
• Campus の哲学: 「すべてを文脈（コンテクスト）の中で扱う」。
  • 関連するものを互いに近接させ、タスクの種類ではなく作業内容でグループ化。
  • コードの整理やコントローラーの配置などと同じ直感を空間設計に適用。
  • 結果：エージェント、成果物（実行中のアプリ）、リソース（チケット、Issue など）が物理的に近接し、コンテキストスイッチによる精神的な苦役感が軽減されました。

でも、これは単なる Miro ではないのか？

Miro や FigJam、Obsidian Canvas などの無限キャンバスツールが存在する中で、Campus が違う点は何でしょうか。

• 根本的な違い：「タイル（ブロック）の性質」
  • ホワイトボード型 (Miro など): タイルはイメージ（スクリーンショット、付箋、リンクなど）の代わり。
  • Campus: タイルはその本物のもの自体。
    • カンバス上のターミナルは、自分のマシン上でエージェントが動作しているリアルな環境。
    • 隣のアプリケーションも、実際のビルド結果で動作するもの。
    • 作業をキャンバスに貼り付けるのではなく、キャンバス内に作業を置く感覚。
• 記憶の宮殿:
  • 位置とサイズだけでタイルやターミナルの意味が即座に分かる空間設計。
  • タブ形式でクリックして探索する必要がなく、常に混乱するのを解消。
• 整理方法:
  • 雑多に見えるが、不要なタブを別のグループに集めるなどして「乱雑さ」を制御。

同僚や友人との Campus

仮想空間を他者と共有するプロセスが最も魅力的です。

• アーキテクチャの特徴:
  • （オプトイン制の）マルチプレイヤー構成。
  • 従来のサーバー中心ではなく、作業自体が各ユーザーのローカルで発生。
  • メディアデータはオプトインでストリーミングされ、ファナウトサーバーを経由しない設計。
    • アセットはキャッシュされ、再加入時にもう一度ダウンロードする必要がない。
• スケール性とセキュリティ:
  • 中央管理型サーバーがボトルネックになるのを避けるため、完全な P2P アプローチを志向。
  • 現在は薄いファナウトサーバーを持つが、将来的にはユーザー自身が NAS をアセットホストとして設定する方向へ進化予定。
• 共有スペース:
  • オプトイン制で、気分に合わせて作業を持ち込めるエリア。
• ローカルチャット機能:
  • スラッシュ

    /

    で始まるメッセージをカーソル隣に表示し、即時表示・フェードアウト。
  • 入力ミスが見えるなどの欠点はあるが、「マイクロインタラクション」を増やし、水飲み場の会話を想起させる効果がある。
  • 重要な経営判断などには使わないが、リモートチームにおいて人間らしい文化を取り戻すための機能として保持。

次に何が？

Campus は無料で利用可能（campus.flutterflow.io）。コア機能は無料で、以下の大規模な機能開発が進んでいます。

• 拡張機能 (Extensions)
  • WASM ベースの大規模な拡張機能システムを開発中。
  • 安全で高速かつ信頼性を保ったまま、Campus に対するあらゆる操作が可能になる予定。
• モバイル
  • TestFlight の早期アルファ版をリリース中。
  • デスクトップと同じキャンバスビューを採用しつつ、モバイル最適化 UI を各タイルに搭載。
  • iPad で Mac ツールをすべて使いながらリモートワークが可能な予感が強い。
• Web
  • Flutter の多プラットフォーム特性を活かし、Web 版への展開を目指す。
• 3D
  • Brandon DeRosier 氏による Flutter への 3D 機能追加作業が進む。
  • 「遊び心」と「真のサンドボックス体験」の両立を目指し、さらに高度な機能を提供予定。

Campus は、リモートファースト企業としてボードゲーム文化を取り戻すツールとしても期待されています。

• 入手方法: macOS 版を無料で campus.flutterflow.io でお試しください。
• フィードバック: バグや要望があれば、Campus 内から送信いただくか、X（旧 Twitter）を通じて直接ご連絡ください。