デザイン関連のワークフローを加速させるAIツールコレクション
アート・イラスト・コンセプトアート制作を得意としたAI。映画ポスターやゲームアートのような高品質なビジュアル生成に強い。
商用向け画像生成・画像編集・広告クリエイティブ制作を得意としたAI。Adobe製品との連携が強く、商用利用しやすい学習データが特徴。
画像生成・高度な画像編集・テキスト入りデザイン制作を得意としたAI。文字描画や写真編集の精度が高く、Geminiとの対話から直接画像を作成できる。
イラスト・広告素材・コンセプト画像制作を得意としたAI。自然言語の理解力が高く、ChatGPTとの連携による画像生成が特徴。
画像生成・ローカル環境でのカスタムAI運用を得意としたAI。Stable Diffusionシリーズを提供し、自由度の高いカスタマイズが可能。
ロゴ制作・アイコン作成・ベクター画像生成を得意としたAI。SVG出力に対応し、ブランドデザイン制作に強い。
リアルタイム画像生成・画像強化・スタイル変換を得意としたAI。生成結果を見ながら即座に調整できる操作性が特徴
画像生成ワークフロー構築・Stable Diffusion運用を得意としたオープンソースツール。ノードベースで複雑な画像生成フローを構築できる。
ゲームアセット制作・コンセプトアート制作を得意としたAI。キャラクターや背景素材の量産に強い。
タイポグラフィ・ロゴ・ポスター制作を得意としたAI。画像内の文字生成精度が高く、SNS広告やポスター制作に向く。
画像高画質化・ノイズ除去・動画アップスケーリングを得意としたAI。既存画像や動画の品質改善に特化している。
ロゴ制作・Tシャツデザイン・グラフィックデザインを得意としたAI。テンプレートとAI生成を組み合わせて手軽にデザインできる。
ブランドビジュアル制作・マーケティング素材制作を得意としたAI。デザイナー向けのキャンバス型UIが特徴。
画像生成・モデル学習・AIアート制作を得意としたAI。多様な画像生成モデルを選択できる。
画像編集・SNSクリエイティブ制作を得意としたAI。テンプレート編集と生成AIを組み合わせて利用できる。
画像生成・SNS投稿画像制作を得意としたAI。初心者でも扱いやすいUIと高い生成品質が特徴。
画像生成・デザイン素材制作を得意としたAI。ストック素材サービスFreepikと統合されている。
高品質画像生成・フォトリアル画像制作を得意としたAI。Black Forest LabsのFLUXモデルを試せる。
画像生成・プロンプト探索を得意としたAI。優れた作例やプロンプトを検索しながら画像生成できる。
フォトリアル画像生成・広告ビジュアル制作を得意としたAI。写実的な人物や商品画像生成に強い。
画像生成・プロンプト管理を得意としたAI。プロンプトテンプレート共有機能が特徴。
デザイン編集・ブランド制作を得意としたAI。画像編集と生成AIを同一キャンバス上で利用できる。
建築パース・インテリアデザイン制作を得意としたAI。スケッチから完成イメージを生成できる。
クリエイティブワークフロー構築を得意としたAI。複数の生成AIを組み合わせた制作フローを作成できる。
無料画像生成を得意としたAI。アカウント登録不要で手軽に画像生成できることが特徴。
商品画像制作・デザイン編集を得意としたAI。背景変更や商品ビジュアル作成に強い。
ビジュアルコンテンツ制作を得意としたAI。チーム向けデザインワークフロー機能を備える。
編集可能なデザインファイル（PSD、PPTX）を出力するAIデザインツールです。AdobeやCanvaの競合と位置付けられており、グラフィックデザイン/マーケティング素材生成ツールです。
ブラウザベースでComfyUIを動かすプラットフォームです。
Anthony Fu のスキルコレクションに収録されたUIレビュー専用スキル。単なるチェックリストではなく実際のコードを解析し、アクセシビリティ・ユーザビリティ・情報設計・インタラクション設計の観点で品質監査を行う。レビュー基準はVercel Web Interface Guidelinesを使用。
Vercelが提供するAIエージェント向けUI/UXレビュー専用スキル。Webアプリやランディングページのコードを解析し、アクセシビリティ・ユーザビリティ・パフォーマンス・デザイン品質の観点から改善点を自動で検出する。
Anthropicが提供するフロントエンド開発専用スキル。ランディングページ・ダッシュボード・管理画面などの開発時に、デザインコンセプトを自動定義してプロダクション品質のUIコードを生成する。
Claude CodeをUX/UIデザインアシスタントに拡張する総合スキルセット。デザインシステム構築・UI実装・アクセシビリティ監査・デザインレビューまでを網羅する複数の専門スキルをひとつにまとめたパッケージ。
Design Token Generation
デザインシステムの基盤となるトークンを自動生成するスキル。カラー・タイポグラフィ・スペーシング・シャドウ・ボーダー・ブレークポイントなどをDTCG準拠のJSON形式で出力し、Primitive → Semantic → Component の3層アーキテクチャで変更に強いデザインシステムを構築できる。
Component Design
Atomic Designの思想に基づきUIコンポーネントを体系的に設計するスキル。AtomsからOrganisms・Templatesまで一貫して設計し、コンポーネントのAnatomy・バリエーション・状態変化・アクセシビリティ要件・トークンとの関連付けまで仕様化できる。
Code Generation
デザイン仕様からプロダクション品質のコードを生成するスキル。React + Tailwind CSS v4・Next.js 15・SwiftUI 6に対応し、デザインシステムとの整合性・再利用性・レスポンシブ・アクセシビリティまで考慮した実装を出力する。
Accessibility Auditing
UIやWebアプリをWCAG 2.2 AA/AAAの基準で評価するアクセシビリティ監査スキル。検出された問題を優先度別（P0・P1・P2）に分類し、キーボード操作・フォーカス管理・色のコントラスト・スクリーンリーダー対応など幅広い観点をカバーする。
Design Review
既存のデザインやプロトタイプを客観的に評価するレビュー専用スキル。6つの評価軸で採点しNielsenの10ヒューリスティック原則で問題点を分析。発見事項・影響度・改善案を構造化されたテーブルとして整理するためチーム内レビューにも活用できる。
Design-to-Code Handoff
デザイン完成後の実装引き継ぎを効率化するスキル。トークン対応表・状態定義・エッジケース一覧・アニメーション仕様などを自動生成し、デザイナーとエンジニア間の認識のズレを防ぐ。実装で見落とされやすい状態遷移や例外ケースまで整理できる。
Prototyping & Research
UXリサーチとプロトタイピングを支援するスキル。5段階のFidelity Ladderに沿ってアイデア段階から高忠実度プロトタイプまで進め、ユーザージャーニーマップの作成やユーザビリティテスト設計もサポートする。
AIコーディングエージェントをプロダクトデザイナー・UXアーキテクトとして活用するデザイン特化スキル集。デザイン設計・UI制作・品質監査・タイポグラフィ改善など、異なる役割を持つ複数の専門スキルを組み合わせて利用できる。
Innovative UX Designer skill
ありきたりなAI生成デザインを避け、独創的で印象に残るUIを生成するクリエイティブ特化スキル。目的やブランドの個性を理解したうえで、タイポグラフィや配色、レイアウトに大胆な方向性を与える。一般的なSaaSデザインのテンプレート化を避けることを重視している。
Controlled UX Designer skill
WCAG準拠や設計プロセスを重視した、より慎重で体系的なUX設計スキル。金融・医療・B2B SaaSなど、一貫性やアクセシビリティが重要なプロダクト開発に適している。
Impact Designer skill
AnthropicのFrontend Design思想をベースにした実装寄りのUIデザインスキル。デザイン性だけでなく、実際に動作するフロントエンドコード生成まで考慮されている。
Design Audit skill
既存アプリやWebサービスをレビューし、視覚的な問題点を体系的に洗い出す監査スキル。視線誘導・余白設計・タイポグラフィ・アクセシビリティなどを分析し、優先順位付きの改善計画を作成する。機能追加ではなくUI品質向上に特化している。
Typography skill
AIが見落としがちなタイポグラフィ品質を改善するスキル。文字階層・引用符・ダッシュ・余白・読みやすさなどを統一し、プロフェッショナルなUI表現を実現する。
Relationship Design
単発の画面設計ではなく、ユーザーとの長期的な関係構築を前提にしたUX設計スキル。記憶・信頼・継続利用を考慮したAIネイティブなインターフェース設計を支援する。
Addy Osmani（Google Chrome）が公開するフロントエンドUI開発専用スキル。デザインシステム準拠・アクセシビリティ・状態管理・レスポンシブ・パフォーマンスまで含め、トップ企業水準の本番品質UIを実装するプロセスをAIに教える実践ガイド。
0xdesignが開発したUIデザイン探索専用スキル。インタビュー → バリエーション生成 → フィードバック収集 → 改善 → 実装計画作成までを一貫して実行し、デザインワークショップのような体験をAI上で再現する。
全てのuse_figmaツール呼び出しの前に必ず読み込む必須前提スキル。Figma Plugin APIの構文ルール・よくある落とし穴・書き方の規約を提供する「APIルールブック」。figma-generate-design・figma-generate-library・figma-create-new-fileを呼ぶ際の土台として動く。
Figmaデザインをピクセルパーフェクトな精度でプロダクションレディなコードに変換するスキル。最もよく使われる「Figmaから実装」の中心的なスキル。React・Vue・SwiftUIなど任意のフレームワークへの変換に対応する。
コードや説明文からFigmaの完全なページ・スクリーンを構築・更新するスキル。figma-implement-designの逆方向（コード→Figma）を担当。既存WebサイトのスクリーンをFigmaで再構築してデザインシステムに統合したい場面で使う。
コードや説明文からFigmaでページ・画面・ビュー全体を構築・更新する際に推奨されるワークフロースキル。figma-useとセットで使用する。アプリのページや複数セクションからなるレイアウトをFigmaに変換するタスクに対応する。
新しい空白のFigmaファイル（DesignまたはFigJam）を作成するシンプルなスキル。use_figmaを呼ぶ前に、作業対象の新規ファイルが必要なときに使う。
FigmaのデザインコンポーネントとコードベースのコンポーネントをCode Connect機能で紐付けるスキル。デザインと実装の乖離をなくし、Dev Modeでのコード参照を自動化する。
プロジェクト固有のデザインシステムルールを生成し、各AIコーディングエージェント向けの専用ルールファイルを書き出すメタスキル。「Figma→コード変換時にどうふるまうべきか」をプロジェクトごとに教え込むためのファイルを自動生成する。
