# Webデザインの補佐

> 「Webデザインの補佐」の Grok Bot プロンプト。Figma・Squarespaceを使うマーケティングの作業を組み立て、動かす前に内容を確認できます。

## 概要

- 正規 URL: https://grokguide.jp/bots/web-design-assistant/
- カテゴリ: マーケティング（https://grokguide.jp/categories/marketing/）
- 必要な連携ツール: Figma、Squarespace
- 掲載日: 2026-08-18
- 提供: @farzyness（https://x.com/farzyness）
- 出どころ（X）: https://x.com/farzyness/status/2087340859138224540
- 料金: 無料（このディレクトリの掲載はすべて無料で読めます）

## プロンプト全文

そのままコピーして Grok Bot などのエージェントに貼り付けてください。

```text
あなたはウェブサイトのデザインを担当します。専用のチャットで、私が頼んだら実行してください。まず Figma と Squarespace のつなぎ方を案内し、そのうえで設定します。私の依頼内容を、ページ構成、ワイヤーフレーム、ビジュアルの方向性、画面幅に応じたレイアウト、そのまま実装に渡せるデザインのメモに落とし込んでください。変更は安全側に倒し、私の承認なしに削除や公開をしないこと。ブランド、読者、アクセシビリティ上の要件、参考にしたい事例、既存のサイト構成、変えてはいけないものを私に聞き、最初の1ページは私が見ている前で作ってから保存してください。
```

## 使い始めるまでの手順

1. **プロンプトを丸ごとコピーする。** 手順・ツール・注意書きをまとめて渡すと、エージェントが全体像を把握できます。
2. **エージェントに貼り付ける。** 設定の質問に答え、聞かれたら Figma、Squarespace をつなぎます。
3. **初回の実行を確認する。** 出力と承認ルールを確かめてから、随時実行や定期実行として保存します。

## よくある質問

### Webデザインの補佐は何をするボットですか？

マーケティングの作業を自動で進めるための Grok Bot 用プロンプトです。Figma、Squarespaceと組み合わせて使います。

### Webデザインの補佐を使うのに必要な連携ツールは何ですか？

Figma、Squarespaceが必要です。掲載していることは、これらが利用者の環境で必ず使える保証にはなりません。動かす前に権限と実行頻度を確認してください。

### 無料で使えますか？

このページのプロンプトは無料で読めて、そのままコピーして使えます。連携するツール側の利用料は各サービスの条件によります。

### 内容を自分用に書き換えても構いませんか？

構いません。掲載しているプロンプトはそのまま使うことも、自社のツール名や進め方に合わせて書き換えることもできます。最初の1回は結果を確認してから任せてください。

## 関連するボット

- [SEOサイト修正](https://grokguide.jp/bots/seo-site-fixer/) — マーケティング
- [LPコピー案](https://grokguide.jp/bots/landing-page-copy-options/) — マーケティング
- [記事・メルマガの執筆係](https://grokguide.jp/bots/article-and-newsletter-writer/) — マーケティング

## このページについて

- HTML 版（正規）: https://grokguide.jp/bots/web-design-assistant/
- 掲載元のマークダウン: https://github.com/kouki485/grok-guide/blob/main/bots/web-design-assistant.md
- 一覧に戻る: https://grokguide.jp/
- エージェント向け案内: https://grokguide.jp/llms.txt