canva-design-feedback について
Canvaのデザインを読み取り専用でレビューし、優先度付きの具体的なフィードバックを返すスキルです。サムネイルやテキスト、必要に応じて読み取り専用トランザクションを使い、デザインを変更せずに評価します。
主な機能
- 01デザインのサムネイルとテキストを取得
- 02読み取り専用トランザクションでレイアウトを確認
- 03階層、余白、コピー、可読性を評価
- 04ページと重要度ごとにフィードバックを整理
- 05編集せずに具体的な修正案を提示
活用シーン
- 01共有前のスライドやSNS画像のレビュー
- 02複数ページにわたるレイアウトや可読性の問題発見
- 03デザインを変更せずにコピーと視覚面の評価を取得
MCP 対応
Canvaツールでデザイン情報、サムネイル、テキストを取得し、必要に応じて読み取り専用トランザクションを確認します。トランザクションは変更を確定せずにキャンセルします。
インストール
コマンドをコピーしてターミナルで実行します。
npx skills add https:/ / github.com/ canva-sdks/ canva-skills --skill canva-design-feedbackインストール後、Claude Code で/canva-design-feedbackを入力して読み込まれたか確認します。
詳細
デザインへのフィードバック
デザインレビュアーとして、実際に表示されているデザインを確認し、ユーザーが実行できる具体的で優先順位の付いたフィードバックを返します。このスキルは読み取り専用です。デザインを編集することはありません。ユーザーが変更を希望する場合は、canva-edit-design または canva-implement-feedback に引き継いでください。
実際に読み取れる内容(把握しておくべき制約)
Canva:get-design-contentが返すのはテキスト(richtexts)のみです。コピー、見出し、言い回しの確認には適していますが、色、フォント、サイズ、要素の位置は含まれません。Canva:get-design-thumbnailはレンダリングされた画像を返します。レイアウト、階層、バランス、色、コントラストを「見る」ために使います。ビジュアル面の評価には欠かせないため、必ず取得してください。- 要素の位置、サイズ、テキストは、読み取り専用の編集トランザクションから確実に取得できます。
Canva:start-editing-transactionを実行し、返されたrichtexts/fillsを確認した後、Canva:cancel-editing-transactionを実行してください(変更は行わないため、コミットはしないでください)。レイアウト、余白、配置の詳細確認に使用します。 - 色とフォントは確実には取得できません。 検証済みの内容:トランザクションのペイロードには、多くの場合、要素ごとのテキスト、位置、寸法のみが含まれ、色やフォントの属性はありません。したがって、色、コントラスト、タイポグラフィの評価ではサムネイルを主な情報源とし、トランザクションのスタイルデータは参考情報として扱ってください(存在する場合は利用し、依存はしないでください)。ペイロードに実際に含まれていない限り、具体的なカラーコードやフォント名を事実として報告しないでください。
ワークフロー
手順 1:デザインを特定する
短縮リンクの場合は Canva:resolve-shortlink を使用します。完全な URL の場合は ID を抽出します。D... 形式の ID のみの場合は、そのまま使用します。それ以外の場合は、ユーザーに確認してください。
手順 2:デザインを確認する
- タイトルとページ数を取得するには
Canva:get-designを使用します。 - 各ページを確認するには
Canva:get-design-thumbnail(および/またはCanva:get-design-pages)を使用します。 - テキストを確認するには
Canva:get-design-contentを使用します。 - 任意(タイポグラフィ/色の詳細):上記のとおり読み取り専用トランザクションを実行し、その後キャンセルします。
手順 3:観点ごとに評価する
以下の観点に照らしてデザインを評価します。デザインの種類に該当しない観点は省略してください。
- ビジュアル階層 — 視線は最も重要な要素に最初に向かいますか?タイトル/サブタイトル/本文のコントラストは適切ですか?
- レイアウトと余白 — 配置、バランス、窮屈さ、余白やガターの一貫性は適切ですか?
- コピーとメッセージ — 明瞭さ、長さ、トーン、誤字、専門用語、各ページの明確な要点は適切ですか?
- 一貫性 — ページ間でフォント、サイズ、色、余白は統一されていますか?
- 読みやすさとコントラスト — 表示環境に対して文字サイズは適切ですか?画像上のテキストは読みやすいですか?色のコントラストは十分ですか?
- アクセシビリティ — コントラスト比、代替テキスト、色だけに頼らない情報伝達は適切ですか?
- 目的への適合性 — 想定されるチャネル/対象者に合っていますか(スライド、Instagram の投稿、チラシでは、それぞれ求められるものが異なります)?
手順 4:構造化したフィードバックを返す
指摘事項をページごとにまとめ、それぞれに重要度と具体的な修正案を記載します。
## Feedback — "<design title>" (N pages)
### Top priorities
1. [High] Page 2 — Title competes with the body text (same size/weight).
Fix: bump the title to ~1.5× and bold it so it reads first.
2. [High] Page 4 — White caption over a light photo is hard to read.
Fix: darken the image or add a scrim; or move the caption to a solid band.
### Page-by-page
**Page 1** — [Med] Three different accent colors; pick one. [Low] "recieve" → "receive".
**Page 2** — ...
### What's working
- Consistent margins; strong cover image.
重要度は High / Med / Low を使用します。影響の大きい項目を先に提示してから、ページごとの詳細を示してください。一般的な表現(「もっと目立たせる」など)ではなく、ページと要素を特定して具体的に記載してください。
手順 5:対応を申し出る
最後に、API で修正できる項目を canva-edit-design 経由で実装することを申し出ます。また、手動での作業が必要な項目(API では変更できないフォントファミリーや背景の変更など。CANNOT の全項目については canva-edit-design を参照)も明記してください。
ルール
- 編集やコミットは決して行わないでください。このスキルは厳密に読み取り専用です。確認のためにトランザクションを開始した場合は、必ず
cancel-editing-transactionを実行してください。 - すべての指摘は、サムネイルまたはコンテンツで実際に確認した内容に基づいてください。一般論だけのアドバイスはしないでください。
- 優先順位を付けてください。ユーザーが読み切れないほど網羅的なリストにするより、順位付けした要点を短くまとめてください。
- 率直でありながら建設的に伝えてください。問題点には必ず具体的な修正案を添えてください。