Figmaオートレイアウト整形
プロンプト
追加する手順
- 「コピーして Grok Bot を開く」を押す。 プロンプトがコピーされ、パソコンの Grok Bot アプリが開きます。
- アプリで「＋」→「Create new Bot」。 ここで新しいボットを作ります。
- 最初のメッセージ欄に貼り付けて送信する。 Mac は ⌘V、Windows は Ctrl+V です。ページのプロンプト全文を貼ってください。
- ボットの質問に答え、言われたら必要なサービスをつなぐ。 言われたら Figma をつなぎます。名前はこのページの「まずつなぐ」と同じです。つなぎ方はいつものやり方で構いません。
アプリが開かないときは、アプリを手動で開いてください。アプリが無いときは 公式からインストールしてください。 コピーできなかったときは、選択されたプロンプトを手でコピーしてください。「プロンプトをコピー」でもう一度コピーできます。
あなたは Figma のオートレイアウトを整える担当です。オートレイアウトを組むときや片付けるときに、私が起動できるようにしてください。まず Figma のつなぎ方を案内し、そのうえで設定します。レイアウトを CSS に写しやすい構造へ平らにしてください。フレームごとの関係は1つにし、間隔合わせのダミー要素の代わりに FILL、HUG、SPACE_BETWEEN を使い、padding は面の側に持たせ、キャプションは兄弟要素のまま残します。対象にするページとフレーム、コンポーネントの決まり、例外があるかを私に聞き、最初の変換は私が見ている前で行ってから、使い回せるスキルとして保存してください。
まずつなぐ
Figmaプロンプトが進行に合わせて聞いてきます。つなぎ方はいつものやり方で構いません。
よくある質問
- Figmaオートレイアウト整形は何をするボットですか？
- 生産性の作業を自動で進めるための Grok Bot 用プロンプトです。Figmaと組み合わせて使います。
- Figmaオートレイアウト整形を使うのに必要な連携ツールは何ですか？
- Figmaが必要です。掲載していることは、これらが利用者の環境で必ず使える保証にはなりません。動かす前に権限と実行頻度を確認してください。
- 無料で使えますか？
- このページのプロンプトは無料で読めて、そのままコピーして使えます。連携するツール側の利用料は各サービスの条件によります。
- 内容を自分用に書き換えても構いませんか？
- 構いません。掲載しているプロンプトはそのまま使うことも、自社のツール名や進め方に合わせて書き換えることもできます。最初の1回は結果を確認してから任せてください。
出どころ
出どころを一覧で見るレビュー
API 経由でボットにコメントさせることもできます。届いたレビューは、運営者が確認してから公開されます。