App Canvas
日本語 ▾

App Canvas · オープンソース · エージェント向け · v0.12.0

UI 全体を、一枚のキャンバスに。実際のコードで。

コーディングエージェントと構築・保守する、実際の画面、状態、操作フローを見渡せるキャンバス。

合成データ · アプリバックエンドなし · ログイン不要 · API キー不要

App Canvas Cloud →

TL;DR

App Canvas に並ぶ実際の StoolSense の UI 状態
公開デモの実画面:77 状態、44 フロー、121 再生項目。単独ケースを含み、121 本の E2E フローではありません。

全体を見る、操作する、再生する

縮小してアプリを理解

画面をページ別に表示。検索、絞り込み、サイドバーの開閉が可能。フローのリンクを選ぶと、移動先へカメラが追従します。

拡大して実際の UI を操作

Browse は操作をロックして移動を優先。画面を選び Interact を押すと、使い捨ての合成データで元のアプリコードを操作できます。

Demo でフローを説明

継続するアプリセッション内で成功、失敗、復旧を再生。操作表示、字幕、一時停止、速度調整、ステップのタイムラインを備えます。

保存失敗、下書き保持、再試行成功の実際の状態図
フローを選ぶと全画面と名前付き遷移を表示。リンクを選択するとカメラが目的地へ移動します。
オフライン保存失敗後に下書きを保持して再試行する実際のデモ
失敗と復旧の実画面。再生は定義された操作と検証を実行します。線を引くだけではテストになりません。

既存リポジトリから対話的なキャンバスへ

リポジトリを読み書きし、コマンドを実行できるエージェントに依頼します。既存の Storybook や手作業の画面一覧は不要。インストールだけで画面が揃うわけではありません。

既存リポジトリに導入 →

App Canvas Cloud · ウェイトリスト

ホスト型ワークスペースに関心がありますか?Cloud はまだ提供されていません。MIT ツールと公開デモは今すぐ使えます。

登録を解除

プライバシーとテレメトリ

最小限の利用イベントを任意で Cloudflare 経由で PostHog に送信します。ページ内容、コード、名前、パス、メール、IP アドレスは PostHog に転送しません。無効にできます。

プライバシーとテレメトリ ↗

このリリースの範囲と限界

実機 iPhone の Safari で動く App Canvas
実機 iPhone Safari のキャプチャ。クラッシュから動作までの調査と測定の限界は技術記事へ。

Safari 技術記事

実機 iPhone Safari のキャプチャ。クラッシュから動作までの調査と測定の限界は技術記事へ。

Safari 技術記事 →