AIフレーム生成
フレームクリエーターを開く
ワイヤーフレームプロジェクトのドキュメントが生成されると、ワイヤーフレームリストにプロジェクトカードとして表示されます。AIでフレームの生成を開始するには、プロジェクトカードの右下隅にあるAIアイコンをクリックします。これにより、各画面の個別フレームを生成および管理できるフレームクリエイターが開きます。
フレームクリエーター
フレームクリエーターは、各スクリーンの個別のワイヤーフレームフレームを生成・管理する場所です。左サイドバーにはプロジェクト内のすべてのスクリーン(例:ダッシュボード、タスクリスト、タスク詳細)がステータスバッジ(保留中、生成中、完了)付きで一覧表示されます。
レイアウト
AIプロバイダー
左上のドロップダウンからフレーム生成に使用するAIモデルを選択します(例:Claude Code、Opus 4.6)。
スクリーンリスト
左サイドバーにプロジェクト内のすべてのスクリーンが表示されます。スクリーンをクリックして詳細を表示し、フレームを生成します。
スクリーンの目的&指示
中央パネルに選択したスクリーンの目的と主要機能が表示されます。生成前に編集をクリックして変更できます。
フレームプレビュー
右側に生成されたフレームのプレビュー、またはフレームがまだ生成されていない場合はEmpty Frameプレースホルダーが表示されます。
フレームを生成
選択したスクリーンのフレームを生成するためにクリックします。すべての生成を開始を使用して、すべての保留中フレームを一度に生成します。
生成前の編集
生成前にフレームのさまざまな側面を編集できます。目的またはキーフィーチャーセクションの横にある編集ボタンをクリックして、画面の説明、機能、指示を変更します。詳細に満足したら、フレームを生成をクリックしてフレームを作成するか、必要に応じて調整して再生成します。
フレームの生成中
フレームの生成中、左サイドバーの画面ステータスバッジが生成中...に変わり、右下に進行状況インジケーター(例:「フレームを生成中... (10%)」)が表示されます。フレームを生成ボタンは生成を停止ボタンに置き換えられ、必要に応じてキャンセルできます。
生成中
ステータスバッジ
各スクリーンの現在の状態を表示 — 保留中(未開始)、生成中(進行中)、または完了(完了済み)。
進捗インジケーター
右下のパーセンテージベースのプログレスバーが現在のフレーム生成の進捗状況を表示します。
生成を停止
生成を停止ボタンをクリックして、いつでも現在のフレーム生成をキャンセルできます。
自動リンク
フレームは自動的に相互リンクされます — スクリーン間のナビゲーションフローは生成中に接続されます。
完了済みフレーム
生成が完了すると、フレームが正常に生成されましたメッセージが表示されます。画面ステータスバッジが完了(緑)に変わり、要素数(例:「41要素」)が表示されます。生成されたフレームのプレビューがエディターの右側に表示されます。
完了後
フレームプレビュー
右パネルに、すべてのコンポーネントが配置された生成フレームのビジュアルプレビューが表示されます。
要素数
完了バッジにスクリーン用に生成された要素の総数が表示されます。
フレームを再起動
結果に満足できない場合は、フレームを再起動をクリックしてゼロから再生成します。
すべての生成を開始
残りの保留中フレームの生成を続行するか、これを使用してすべてのスクリーンを一度にバッチ生成します。
