Repolode
投稿する
guilhermealvestech

guilhermealvestech/carrossel-skill

ブランドに合わせたInstagram風カルーセルを、原稿作成からギャラリー・スライダー・バージョン比較付きの2倍解像度PNG書き出しまで行うClaude Code／Codex向けスキル。

代替できる製品:Canva

GitHub で見る
スター
116
フォーク
16
未解決の Issue
0
最終コミット
6 日前

これは何？

carrosselは、統一感のあるブランドスタイルでSNS用カルーセルを作成するClaude Code／Codex向けスキルです。作業は段階的に進み、AIがスライドごとにコピーを作成し、承認を待ってからビジュアルを制作します。承認された制作物は後続のカルーセルの参考資料となるため、シリーズ全体で見た目を統一できます。

各スライドは、編集可能なHTML、1080×1350のPNG、2160×2700のPNGとして書き出されます。出力には、すべての制作物とバージョンをまとめたギャラリー、プレビューやダウンロードができるスライダー、左右に並べて比較できる表示が含まれます。既存のWebサイト、ロゴ、投稿をもとにブランドを設定できるほか、いくつかの質問に答えて方向性を選び、ゼロから設定することもできます。

却下・承認の内容はGOSTO.mdファイルに保存され、スキルは新しい制作物を作る前にこのファイルを読み込みます。利用にはNode 18+が必要で、レンダリング用にPlaywrightとChromiumをインストールします。

主な機能

  • 01スライドごとにコピー案を作成し、デザインに進む前に承認を待ちます。
  • 02各スライドを編集可能なHTMLと、1080×1350および2160×2700のPNGとして書き出します。
  • 03ギャラリー、スライダー、バージョンを左右に並べた比較表示を提供します。
  • 04既存のWebサイトをもとにするか、ゼロからブランドアイデンティティを構築します。
  • 05承認・却下の傾向をGOSTO.mdに保存し、以降の制作に反映します。

ユースケース

  • 既存ブランドのスタイルに合ったInstagramカルーセルのシリーズを作成する。
  • 製品ローンチやトピックを、キャプション付きの複数スライド投稿に仕立てる。
  • コンテンツ制作に入る前に、質問に答えながら新しいブランドのビジュアルアイデンティティを設定する。

クイックスタート

  1. 1

    リポジトリをクローンする

    git clone https://github.com/guilhermealvestech/carrossel-skill
  2. 2

    スキルをClaude Codeのskillsフォルダーにコピーする

    cp -r carrossel-skill/skills/carrossel ~/.claude/skills/carrossel
  3. 3

    スキルのNode依存関係をインストールする

    npm install --prefix ~/.claude/skills/carrossel
  4. 4

    Playwright用のChromiumブラウザーをインストールする

    npx --prefix ~/.claude/skills/carrossel playwright install chromium

使う前に知っておきたいこと

  • Node 18以降と、Playwright用のChromiumのインストールが必要です。
  • Claude CodeまたはCodex向けに設計されており、単体アプリではありません。

収録されている特集

Claude Code のツール・スキル・プラグインAI コーディングアシスタントとエージェントAI画像生成ツールとStable Diffusionプロジェクト

トピック

#claude-code#codex#carousel#instagram#image-generation#playwright#brand-design#social-media

よくある質問

carrossel-skill とは？
ブランドに合わせたInstagram風カルーセルを、原稿作成からギャラリー・スライダー・バージョン比較付きの2倍解像度PNG書き出しまで行うClaude Code／Codex向けスキル。 carrosselは、統一感のあるブランドスタイルでSNS用カルーセルを作成するClaude Code／Codex向けスキルです。作業は段階的に進み、AIがスライドごとにコピーを作成し、承認を待ってからビジュアルを制作します。承認された制作物は後続のカルーセルの参考資料となるため、シリーズ全体で見た目を統一できます。
carrossel-skill は無料で使えますか？ライセンスは？
carrossel-skill は MIT ライセンスのオープンソースです。商用製品で使う前にライセンス条件を確認してください。
carrossel-skill は今もメンテナンスされていますか？
活発にメンテナンス中。carrossel-skill の最終コミットは 2026年11月1日 です。
carrossel-skill は何に使えますか？
既存ブランドのスタイルに合ったInstagramカルーセルのシリーズを作成する。 製品ローンチやトピックを、キャプション付きの複数スライド投稿に仕立てる。 コンテンツ制作に入る前に、質問に答えながら新しいブランドのビジュアルアイデンティティを設定する。
carrossel-skill のインストール方法は？
リポジトリをクローンする: git clone https://github.com/guilhermealvestech/carrossel-skill スキルをClaude Codeのskillsフォルダーにコピーする: cp -r carrossel-skill/skills/carrossel ~/.claude/skills/carrossel スキルのNode依存関係をインストールする: npm install --prefix ~/.claude/skills/carrossel Playwright用のChromiumブラウザーをインストールする: npx --prefix ~/.claude/skills/carrossel playwright install chromium
carrossel-skill はどこで入手できますか？
ソースコードとインストール手順は GitHub にあります：https://github.com/guilhermealvestech/carrossel-skill

概要はプロジェクトの README をもとに AI が生成しています。GitHub の数値は毎日更新されます。

関連プロジェクト