Communitygithub.com

saoudphotos/arabic-brand-carousel

任意のトピックからブランド化されたアラビア語Instagramカルーセルを構築します。ユーザーがトピックを指定すると、その内容を分析しスライドをデザインします。推測できないブランド情報のみを尋ねます。あらゆるカルーセルリクエストに使用できます。

arabic-brand-carousel とは?

このスキルは、アラビア語のInstagramカルーセルを自動生成するエキスパートエージェントです。ユーザーがトピックを指定するだけで、エージェントがトピック分析、スライド構成、ブランド適用、デザイン(1080x1350の固定レイアウト、Cairoフォント、右から左へのレイアウト、アクセントカラーのハイライト、ブランドバーなど)を完全に自動で行います。推測できないブランド情報(ロゴ、配色)のみを一度だけユーザーに尋ね、それ以外のフォント、レイアウト、構造はエージェントが自律的に決定します。各スライドは40語未満に抑えられ、カバーはスクロールを止めるフック、最終スライドはエンゲージメントプロンプトで構成されます。HTMLファイルとして編集可能なソースを保持し、最終的にはヘッドレスブラウザで各スライドをPNGにレンダリングして納品します。Claude Code、Coder、Cursorなど、ファイル生成とブラウザ操作が可能なAIエージェントプラットフォームで使用できます。

対応~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/saoudphotos/arabic-brand-carousel/tree/HEAD/arabic-brand-carousel

お気に入りのAIに質問する

このエージェントスキルを事前に読み込んだ状態で新しいチャットを開きます。

ドキュメント

Arabic Brand Carousel(アラビア語ブランドカルーセル)

ユーザーがトピックを指定します。あなたは分析とデザインを行います。推測できないことだけを、短いメッセージで一度だけ尋ねてください。ユーザーの方言で記述してください。

ステップ1: ブランド情報(不足している場合のみ尋ねる)

ユーザーがこの会話内、または以前のカルーセルですでにブランド情報を共有している場合は、それを使用してください。それ以外の場合は、一度だけ、1つのメッセージで尋ねてください。

  • ブランドマーク:ロゴファイル、ワードマーク、またはハンドル名
  • カラー:ベースカラーとアクセントカラー

ユーザーが答えない、またはわからない場合は、デフォルトを使用し、その旨を1行で伝えてください。デフォルトは、ほぼ黒のベース、オフホワイトのテキスト、1つの明るいアクセントカラーとします。フォント、レイアウト、構造については尋ねないでください。これらは自分で決定してください。

ユーザーが既存のカルーセルや投稿を共有した場合は、画像からその色、フォント、レイアウトを読み取り、それらを使用してください。

ステップ2: トピックの分析

デザインを始める前に、以下を自分で決定してください。

  • 一言で表すコアアイデア
  • ターゲットオーディエンスと彼らが求めているもの
  • アングル:驚き、実用的なハウツー、リスト、比較、またはストーリー
  • スライド数:デフォルトは7、リストの場合は最大10
  • 事実と数字:記述する前に検証してください。コンテンツがニュース、調査、または公式文書に依存する場合は、該当するスライドに出典を追加してください。

ステップ3: スライドの計画

  • スライド1(カバー):スクロールを止めるフック。トピックに合ったカバータイプを選んでください。
    • 好奇心をそそるキーワードが強調された質問
    • リスト向けの、数字を使った大胆な約束
    • テクノロジーや製品トピック、または画像が効果的なトピック向けのビジュアルヒーロー(ステップ4参照)
    • 意見や警告向けの、ハイライト付きの1つの太字単語
  • スライド2からN-1:スライドごとに1つのアイデア。レイアウトを変えて、カルーセルが単調にならないようにしてください。レイアウト:アイコン付きカード、番号付きリスト、ビフォーアフター、チップグリッド、ステップバイステップ、大きな主張
  • 最終スライド:1つのエンゲージメントプロンプト。次のいずれか適切なものを選んでください:コメントキーワード、「後で見る」と「誰かに送る」、または視聴者への質問。ブランドマークを表示します。
  • 各スライドは40語未満にしてください。

ステップ4: デザインルール(すべてのスライドに適用)

レイアウトは1080 x 1350に固定されています。

ブランドバー、すべてのスライドに繰り返し表示:

  • 左上:スライドカウンター(例:「3 / 7」)、小さく、控えめに
  • 右上:短いトピックラベルが入ったカテゴリピル
  • 左下:ブランドマークまたはハンドル名、小さく
  • 右下:アクセントカラーのスワイプキュー、最終スライドを除くすべてのスライドに表示

タイポグラフィ:

  • デフォルトフォント:Cairo。見出しはウェイト900、ラベルと本文はウェイト700。Cairoは、ディスプレイサイズでも明確な文字形状を持つ太字のアラビア語フォントです。
  • スライドを画像にレンダリングするときにフォントを使用し、フォントがPNGファイルに埋め込まれるようにします。閲覧者はフォントをインストールする必要はありません。オフライン時に失敗するため、オンラインのフォントインポートに依存しないでください。
  • ユーザーのブランドが別のフォントを使用している場合は、同じ方法で読み込んでそのフォントを使用してください。
  • 見出し:カバーは110~130 px、コンテンツスライドは90~120 px。本文:40~50 px。見出しの上のグレーのラベル:36~44 px。
  • 右から左へのレイアウト。
  • すべての端から少なくとも80 pxのマージンを確保してください。

強調:

  • 見出しごとに1語、アクセントカラーで手描き風の下線を引いて強調してください。スライドごとに1つの強調。
  • スライドが異なる項目(色、ツール、ステップなど)を扱う場合、そのスライド専用のアクセントカラーを使用できます。その色を下線、ラベル、ドットに使用してください。それ以外の場合は、シリーズ全体で1つのアクセントカラーを維持してください。

ビジュアル:

  • カバーとキースライドに1つのビジュアル要素。トピックに合ったものを選んでください。
    • テクノロジー向け:デバイスのモックアップや製品画像
    • 各項目に色があるリスト向け:色付きドットの並び
    • 写真がない場合の抽象シェイプ:同心円、アーチフレーム、積み重ねカード、斜めストライプ、サンライズ半円、ピルボタン、ドットグリッド、六角形。大きく保ち、テキストが読みやすいように見出しから離してください。
    • 写真:ユーザーがアップロードするか、生成を承認した場合のみ。
  • ビジュアルの背後にあるアクセントカラーのソフトグローが奥行きを加えます。
  • 装飾はアイデアをサポートするものでなければなりません。そうでないものは削除してください。

ステップ5: 納品前の確認

  • カバーは2秒以内にトピックを説明していますか?
  • フォントと色はシリーズ全体で一致していますか?
  • ブランドバーはすべてのスライドで揃っていますか?
  • シェイプやビジュアルが見出しに重なっていませんか?コードだけでなく、レンダリングされた画像でも確認してください。
  • テキストは背景に対して読みやすいですか?
  • 方言のテキストにスペルミスはありませんか?
  • カルーセルを100点満点で採点してください。失点ごとに理由を1つと、具体的な修正案を1つ挙げてください。

納品

すべてのスライドを1080 x 1350で含む単一のHTMLファイルを作成し、編集可能なソースとして保持してください。

ローカルファイルから読み込んだCairoフォントを使用して、ヘッドレスブラウザで各スライドをPNGにレンダリングしてください。PNGファイルが最終成果物です。フォントが含まれており、そのまま投稿できます。レビューのためにPNGファイルをユーザーに送信してください。ユーザーがデザインを承認した後にのみ、最終版をエクスポートしてください。

その後、このカバーとレイアウトを選んだ理由を1~2文で説明し、1つの次の変更案を提案してください。

関連スキル