mcpField
P
paw-cra-design-social

paw-cra-design-social

github.com/pawbytesデザイン・UI115160 回インストール4 週間前に更新
リポジトリ

paw-cra-design-social について

paw-cra-design-socialは、ブランド向けのSNS投稿やカルーセルを制作するビジュアル制作ワークフローです。各プラットフォームの寸法で画像を生成し、ブランドと仕様を検証してマニフェストとともに出力します。

主な機能

  1. 01プラットフォーム寸法で投稿やカルーセルを作成
  2. 02画像生成とテキストオーバーレイ
  3. 03ブランドと仕様への適合確認
  4. 04PNG/JPGとデザインマニフェストの出力
  5. 05対話なしで実行

活用シーン

  1. 01InstagramやLinkedInのカルーセル制作
  2. 02複数プラットフォーム向け投稿の作成
  3. 03ブランドガイドラインに沿った素材の確認と出力

インストール

コマンドをコピーしてターミナルで実行します。

$npx skills add https://github.com/pawbytes/skill-suites --skill paw-cra-design-social

インストール後、Claude Code で/paw-cra-design-socialを入力して読み込まれたか確認します。

同梱ファイル

SKILL.md と一緒にインストールされる参考資料やスクリプト。

references/
01-brief-and-context.md
02-production.md
03-validation-and-export.md

詳細

ソーシャルデザインワークフロー

概要

このワークフローでは、Aria Creative Suiteで最も一般的なビジュアル出力である、すぐに公開できるソーシャルメディア投稿やカルーセルを作成します。ブリーフ(プラットフォーム、形式、コンテンツ、ブランド)を受け取り、プラットフォームに適したPNG/JPGファイルとdesign-manifest.jsonを出力します。

引数: 対話なしで自動実行するための--headless / -Hを受け付けます。

出力: プラットフォームごとの正確な寸法のビジュアルアセットを.pawbytes/creative-suites/brands/{brand}/assets/に保存し、design-manifest.jsonを作成します。

ビジュアル制作パイプラインのオペレーターとして動作してください。このワークフローは制作を最優先しており、ドキュメントではなく画像を作成します。すべてのステップは、最終的なビジュアルアセットがブランドに適合し、プラットフォームの要件を満たし、アップロードできる状態になるように設けられています。

設計上の理由: このワークフローでは、ブランドとプラットフォームの検証を制作パイプライン内のステップ8~9として組み込むことで、従来の単独のcra-design-review-gateを置き換えます。制作フローの外部にあるレビューステップは、価値を高めずに手間を増やします。アセットを生成する制作者こそ、すぐに検証するのに最適な立場にあります。

起動時

{project-root}/.pawbytes/config/config.yamlと{project-root}/.pawbytes/config/config.user.yaml(ルートレベルとcraセクション)から利用可能な設定を読み込みます。設定ファイルが見つからない場合は、いつでもpaw-cra-setupでモジュールを設定できることをユーザーに伝えてください。以下を解決し、以降の処理に適用します(括弧内はデフォルト値です)。

  • {user_name}(null)-- ユーザーを名前で呼びます
  • {communication_language}(English)-- すべてのやり取りに使用します
  • {fal_key}(null)-- 画像生成に必要なfal.ai APIキー
  • {output_directory}(.pawbytes/creative-suites)-- 出力先のベースパス

{project-root}/.pawbytes/creative-suites/index.mdから共有エージェンシーメモリを読み込み、有効なブランドとキャンペーンを確認します。ブランドが特定されたら、.pawbytes/creative-suites/brands/{brand}/guidelines.mdからブランドガイドラインを読み込みます。

以前に調査したプラットフォーム仕様とデザイン知識については、{project-root}/.pawbytes/creative-suites/knowledge/index.mdを確認します。

ツールの確認: 続行する前に、fal_keyが利用可能であることを確認します。テンプレートのレンダリングに必要なPuppeteer/Playwrightが利用可能か確認します。必要なツールがない場合は、機能が制限されることをユーザーに伝え、可能な範囲で続行します。

--headlessが指定されている場合は、妥当なデフォルト値を使用し、対話なしですべてのステージを進めます。指定されていない場合は、制作を開始する前にユーザーにブリーフの内容を確認します。

パイプライン

このワークフローには3つのステージがあります。各ステージでは、開始時に参照資料を読み込みます。

ステージ1:ブリーフとコンテキスト

./references/01-brief-and-context.mdを読み込みます

受け取ったブリーフを解析して検証します。プラットフォームの仕様とベストプラクティスを読み込みます。ブリーフの内容を使うか、ストラテジストを呼び出してコピーを決定します。このステージでは、制作に必要なすべてのパラメーターを含む、検証済みの完全なブリーフを作成します。

次への進行: プラットフォーム、形式、寸法、コピー、ブランドのコンテキストがすべて確定し、ブリーフが完成したらステージ2に進みます。ヘッドレスモードでは、不足しているパラメーターをコンテキストから推定して続行します。

ステージ2:制作

./references/02-production.mdを読み込みます

ビジュアルレイアウトを計画し、AI画像を生成し、テキストのオーバーレイをレンダリングします。カルーセルでは、すべてのスライドでビジュアルの一貫性を保ちます。このステージでは、未加工のビジュアルアセットを作成します。

次への進行: すべてのアセットが生成され、ディスクに保存されたらステージ3に進みます。

ステージ3:検証とエクスポート

./references/03-validation-and-export.mdを読み込みます

アセットをブランドガイドラインおよびプラットフォーム仕様に照らして検証します。適切な名前を付けて、正しい場所にエクスポートします。デザインマニフェストを作成し、ステータスログを更新します。このステージでは、最終成果物を作成します。

次への進行: design-manifest.jsonが作成され、日次ログが更新されたらワークフローは完了です。


クイックリファレンス

Supported Platforms
PlatformPostCarouselStory
Instagram1080x1350 (4:5)1080x1080 or 1080x13501080x1920
LinkedIn1200x6271080x1080 (PDF)1080x1920
TikTok1080x1920--1080x1920
X (Twitter)1200x675----
Facebook1200x6301080x10801080x1920
AI Model Selection
Use CasePrimary ModelFallback
Text-heavy postsNano Banana ProFLUX.2 [flex]
Photo-realisticFLUX.2 [pro]FLUX.2 [flex]
Rapid prototypingFLUX.1 [schnell]--
Carousel consistencyFLUX.2 [flex]Nano Banana Pro
Output Structure
.pawbytes/creative-suites/brands/{brand}/assets/{campaign}/social/
  {platform}_{format}_{date}.png
  {platform}_{format}_{date}_slide01.png  (carousel)
  {platform}_{format}_{date}_slide02.png  (carousel)
  design-manifest.json

コメント