- 自分の言葉でAgentとチャットする — フレーム全体でも、単一の要素についてでも構いません
- ビジュアルエディターで要素を直接調整する — シンプルな編集は即座に適用され、クレジットも消費しません
チャット
レビュー中のデザイナーにブリーフするようなつもりでAgentに指示しましょう。フレームを選択してメインチャットで変更内容を説明する(「もっと暖かみのある色に」、「ヒーローが物足りない」)か、ツールバーの Chat ツールを選んで要素をクリックし、メッセージをその部分だけに絞り込みます。
選択したフレームは、チップとしてメインチャットに添付されます。
ビジュアルエディター
何を求めているか正確にわかっている場合は、プロンプトを省きましょう。ツールバーで Edit ツールを選び、任意の要素をクリックすると、その要素が編集できるプロパティ(コンテンツ、レイアウト、色、ボーダーなど)とともにビジュアルエディターが開きます。テキストの変更、色の選択、スペースの微調整といったシンプルな編集は、クレジットを消費することなく即座にソースコードへ反映されます。
Editツールが有効になり要素が選択された状態と、その編集可能なプロパティを示すビジュアルエディター。
どちらを使うべきか
この2つは自然に組み合わせられます。まずチャットで方向性を決め、次にビジュアルエディターでクリックしながら細部を仕上げます。
それぞれのツールを掘り下げる
チャット
自分の言葉で、フレームや単一の要素の方向性を導きます。
ビジュアルエディター
テキスト、色、レイアウト、画像に対する、直接的でクレジットを使わない編集です。
次のステップ
フレームが仕上がったら、改良をやめて実際のものにしましょう。- デザインを構築する: フレームを動作するアプリに変換します。
- デザインシステムを作成する: 改良した内容を抽出し、以降のすべてのフレームがブランドに沿った状態で始まるようにします。