Claude Codeスキル · オープンソース
App Store用の画像を、25スタイルで。 プロンプトは各1つ。
スタイルを選ぶだけで、セット内のすべてのショット、デバイス、言語にそのスタイルが行き渡ります。下の各スタイルに添えたプロンプトで、あなたのアプリにも同じ見た目を再現できます。
iPhone、iPad、Macのストアサイズに対応 · 言語ごとのコピー · 無料でオープンソース
使い方
インストールして、アプリに向ける。
Shot Butcherは、Claude Code用のスキルです。キャプチャを渡すと、アルファチャンネルなしのストア用PNGが仕上がります。描画はHTML、CSS、ヘッドレスブラウザが担当するので、来月も同じ結果でセットを出力できます。
/plugin marketplace add GraphicMeat/shot-butcher
/plugin install shot-butcher@shot-butcher
- キャプチャ 手持ちのPNGを使うか、付属のスクリプトでiOSシミュレータ、Macのウィンドウ、Webビルドを撮影します。
- 選ぶ 下からスタイルを選び、プロンプトをコピーします。アクセントカラーとプラットフォームは、アプリに合わせて変更してください。
- レンダリング スキルが言語ごとの見出しを書き、テキストを収め、ストアのサムネイルでは小さすぎる要素を警告し、デバイスごとのストアサイズで書き出します。
スタイル一覧
25の見た目、ルールは1つ。セットは常に統一。
各スタイルは、自社アプリ2本で紹介しています。MacのMailVaultと、iPhoneとiPadのPhotoBooksです。スクリーンショットをクリックすると、そのスタイル全体をめくって見られます。
デモ用キャプチャ内のMailVault自体の画面は英語です。プロンプトはコマンドなので、こちらも英語のままです。
True Bento
角丸タイルのグリッド。大きなタイルにキャプチャ、アプリの紹介と数値タイルを並べ、機能ごとに小さなタイルを1つずつ用意します。
shot-butcher style=true-bento theme=dark accent=#7C5CFF platforms=mac
Rounded tile grid: capture in the big tile, app identity and stat tiles, every feature as its own small tile.shot-butcher style=true-bento theme=light accent=#E8603C platforms=iphone,ipad
Rounded tile grid: capture in the big tile, app identity and stat tiles, every feature as its own small tile.Headline Top
やわらかなアクセント色のキャンバスに、中央揃えのキッカー、見出し、サブコピー。デバイスは下に置き、下端からはみ出させます。
shot-butcher style=headline-top theme=dark accent=#7C5CFF platforms=mac
Centred kicker, headline and sub on a soft accent-tinted canvas; the device sits below and bleeds off the bottom edge.shot-butcher style=headline-top theme=light accent=#E8603C platforms=iphone,ipad
Centred kicker, headline and sub on a soft accent-tinted canvas; the device sits below and bleeds off the bottom edge.Bleed Top
アクセント色のパネルの上に、デバイスが上端から入り込みます。下部には、太い左揃えのキャプションブロックを配置します。
shot-butcher style=bleed-top theme=dark accent=#7C5CFF platforms=mac
Device drops in from the top edge over a solid accent panel; a heavy left-aligned caption block is anchored to the bottom.shot-butcher style=bleed-top theme=light accent=#E8603C platforms=iphone,ipad
Device drops in from the top edge over a solid accent panel; a heavy left-aligned caption block is anchored to the bottom.Panorama
セット全体で1本につながる帯。流れるアクセントのリボンがすべての継ぎ目を通り、1つおきのデバイスが継ぎ目をまたいで次のショットへ伸びます。
shot-butcher style=panorama theme=dark accent=#7C5CFF platforms=mac
One continuous strip across the set: a flowing accent ribbon runs through every seam and alternate devices straddle the seam into the next shot.shot-butcher style=panorama theme=light accent=#E8603C platforms=iphone,ipad
One continuous strip across the set: a flowing accent ribbon runs through every seam and alternate devices straddle the seam into the next shot.Tilted 3D
床面に遠近法で立つデバイスと、長くやわらかい落ち影。セリフ体の見出しはMacでは左、iPhoneとiPadでは上に置き、傾きはショットごとに交互に変わります。
shot-butcher style=tilted-3d theme=dark accent=#7C5CFF platforms=mac
Device standing in perspective on a floor plane with a long soft cast shadow; serif headline left on Mac, on top on iPhone and iPad; tilt alternates per shot.shot-butcher style=tilted-3d theme=light accent=#E8603C platforms=iphone,ipad
Device standing in perspective on a floor plane with a long soft cast shadow; serif headline left on Mac, on top on iPhone and iPad; tilt alternates per shot.Zoom Callout
ほどよいサイズのデバイスに、画面の一部を拡大する円形のルーペを重ね、やわらかい接線の円錐でつなぎます。見出しはセリフ体です。
shot-butcher style=zoom-callout theme=dark accent=#7C5CFF platforms=mac
Device at a moderate size with a circular loupe magnifying one region of the screen, joined to it by a soft tangent cone; serif headline.shot-butcher style=zoom-callout theme=light accent=#E8603C platforms=iphone,ipad
Device at a moderate size with a circular loupe magnifying one region of the screen, joined to it by a soft tangent cone; serif headline.Exploded UI
デバイス自身の画面から2~3個のパーツを浮かせ、影付きのカードとしてフレームの端を越えて重ねます。元の場所には色付きのくぼみが残ります。
shot-butcher style=exploded-ui theme=dark accent=#7C5CFF platforms=mac
Device with two or three pieces of its own screen lifted out as floating, shadowed cards that slide over the frame edge, leaving tinted sockets behind.shot-butcher style=exploded-ui theme=light accent=#E8603C platforms=iphone,ipad
Device with two or three pieces of its own screen lifted out as floating, shadowed cards that slide over the frame edge, leaving tinted sockets behind.Full Bleed
キャプチャをキャンバスいっぱいに敷き詰め、キッカー、見出し、サブコピーはすりガラス風のバーにのせます(Macでは下、iPhoneとiPadでは上)。
shot-butcher style=full-bleed theme=dark accent=#7C5CFF platforms=mac
The capture fills the canvas edge to edge; kicker, headline and sub sit on a frosted glass bar (bottom on Mac, top on iPhone and iPad).shot-butcher style=full-bleed theme=light accent=#E8603C platforms=iphone,ipad
The capture fills the canvas edge to edge; kicker, headline and sub sit on a frosted glass bar (bottom on Mac, top on iPhone and iPad).Split Duo
中央揃えの見出しの下に、ずらして重ねた2台のデバイスを角丸の台座にのせます。Macは同じ画面のダーク版とライト版を、iPhoneとiPadはこの画面と次の画面を組み合わせます。
shot-butcher style=split-duo theme=dark accent=#7C5CFF platforms=mac
Centred headline over two staggered, overlapping devices on a rounded plinth: Mac pairs the dark and light versions of one screen, iPhone and iPad pair this screen with the next.shot-butcher style=split-duo theme=light accent=#E8603C platforms=iphone,ipad
Centred headline over two staggered, overlapping devices on a rounded plinth: Mac pairs the dark and light versions of one screen, iPhone and iPad pair this screen with the next.Kinetic Type
行間を詰めた巨大な大文字の見出しをデバイスの背後いっぱいに敷き、デバイスは下端から最終行の上へせり上がります。単語は、ベタ塗りのインク、アウトライン、アクセント色の順に入れ替わります。
shot-butcher style=kinetic-type theme=dark accent=#7C5CFF platforms=mac
Giant, tightly-leaded uppercase headline fills the canvas behind the device, which rises from the bottom edge over the last line; words alternate solid ink, outline and accent.shot-butcher style=kinetic-type theme=light accent=#E8603C platforms=iphone,ipad
Giant, tightly-leaded uppercase headline fills the canvas behind the device, which rises from the bottom edge over the last line; words alternate solid ink, outline and accent.Editorial Serif
雑誌の見開き風。紙の地色に、ヘアラインの罫線と「01 / 06」のノンブルを添えた字間広めのキッカー、アクセント色のイタリックで終わる大きなセリフ体の見出し、細い枠線付きの写真プレートに収めたキャプチャ。
shot-butcher style=editorial-serif theme=dark accent=#7C5CFF platforms=mac
Magazine spread: paper ground, tracked kicker with a hairline rule and a "01 / 06" folio, big serif headline ending in accent italic, capture as a keylined photo plate.shot-butcher style=editorial-serif theme=light accent=#E8603C platforms=iphone,ipad
Magazine spread: paper ground, tracked kicker with a hairline rule and a "01 / 06" folio, big serif headline ending in accent italic, capture as a keylined photo plate.Swiss Grid
インターナショナル・タイポグラフィック・スタイル。見えるカラムグリッド、太い罫線の上のラベル行、特大のスロット番号、アクセント色の罫線バー、左揃えの見出し、グリッドの列に固定したデバイス。
shot-butcher style=swiss-grid theme=dark accent=#7C5CFF platforms=mac
International Typographic Style: visible column grid, label row over a heavy rule, huge slot index, accent rule bars, flush-left headline, device locked to grid columns.shot-butcher style=swiss-grid theme=light accent=#E8603C platforms=iphone,ipad
International Typographic Style: visible column grid, label row over a heavy rule, huge slot index, accent rule bars, flush-left headline, device locked to grid columns.Brutalist
主張の強いフラットな背景に、太い枠線のブロックと硬いオフセットシャドウをまとった特大の大文字Archivo Black。四角い厚枠に収めたキャプチャと、傾けた機能ティッカーを組み合わせます。
shot-butcher style=brutalist theme=dark accent=#7C5CFF platforms=mac
Loud flat background, huge uppercase Archivo Black in thick-bordered blocks with hard offset shadows, square slab-framed capture and a tilted feature ticker.shot-butcher style=brutalist theme=light accent=#E8603C platforms=iphone,ipad
Loud flat background, huge uppercase Archivo Black in thick-bordered blocks with hard offset shadows, square slab-framed capture and a tilted feature ticker.Minimal Mono
余白をたっぷりとったモノクロの画面に、小さく浮かぶデバイスと、Instrument Sansによる短いキャプション1行。アクセントは小さなドットだけです。
shot-butcher style=minimal-mono theme=dark accent=#7C5CFF platforms=mac
Monochrome field with lots of whitespace, a small floating device and one short Instrument Sans caption; the accent is only a tiny dot.shot-butcher style=minimal-mono theme=light accent=#E8603C platforms=iphone,ipad
Monochrome field with lots of whitespace, a small floating device and one short Instrument Sans caption; the accent is only a tiny dot.Liquid Glass
背景はキャプチャそのものを拡大して強くぼかしたもの。キャプションは明るいハイライトの縁をもつ、すりガラス状の半透明カードにのせ、デバイスはカードに重なるように上に浮かびます。
shot-butcher style=liquid-glass theme=dark accent=#7C5CFF platforms=mac
Background is the capture itself, enlarged and heavily blurred; caption on a frosted translucent glass card with a bright highlight edge; device floats on top overlapping the card.shot-butcher style=liquid-glass theme=light accent=#E8603C platforms=iphone,ipad
Background is the capture itself, enlarged and heavily blurred; caption on a frosted translucent glass card with a bright highlight edge; device floats on top overlapping the card.Aurora Dark
ほぼ黒の空に、アクセント色とその補色のオーロラのカーテン。中心をずらしたデバイスの下には色付きの光だまりが広がり、明るい左揃えの文字をのせます。
shot-butcher style=aurora-dark theme=dark accent=#7C5CFF platforms=mac
Near-black sky with aurora curtains in the accent and its complementary hue, a coloured glow pooled under an off-centre device, light flush-left type.shot-butcher style=aurora-dark theme=dark accent=#E8603C platforms=iphone,ipad
Near-black sky with aurora curtains in the accent and its complementary hue, a coloured glow pooled under an off-centre device, light flush-left type.Spotlight
黒いステージに、上から中央のデバイスへ注ぐやわらかな光の円錐。足元には光だまりとほのかな床の反射があり、光の中に軽やかな見出しを置きます。
shot-butcher style=spotlight theme=dark accent=#7C5CFF platforms=mac
Black stage, one soft cone of light from the top onto a centred device, a pool of light and faint floor reflection beneath, light airy headline in the beam.shot-butcher style=spotlight theme=dark accent=#E8603C platforms=iphone,ipad
Black stage, one soft cone of light from the top onto a centred device, a pool of light and faint floor reflection beneath, light airy headline in the beam.Blueprint
細かいグリッド上の製図風。破線の輪郭と中心線をもつアウトラインのデバイス、キッカーとアプリ名を記した寸法線、機能名を示す等幅フォントの引き出し線コールアウト。
shot-butcher style=blueprint theme=dark accent=#7C5CFF platforms=mac
Technical drawing on a fine grid: outlined device with dashed contour and centre line, dimension lines labelled with the kicker and app name, mono leader-line callouts naming features.shot-butcher style=blueprint theme=light accent=#E8603C platforms=iphone,ipad
Technical drawing on a fine grid: outlined device with dashed contour and centre line, dimension lines labelled with the kicker and app name, mono leader-line callouts naming features.Annotated Sketch
ドットグリッドのノート用紙に、すっきりしたFraunces体の見出し。右にデバイス、左の余白には手書きのCaveat体のメモを置き、ゆらいだ手描きのアクセント矢印がUIを指します。
shot-butcher style=annotated-sketch theme=dark accent=#7C5CFF platforms=mac
Dot-grid notebook paper, clean Fraunces headline, device on the right and handwritten Caveat margin notes on the left with wobbly hand-drawn accent arrows pointing into the UI.shot-butcher style=annotated-sketch theme=light accent=#E8603C platforms=iphone,ipad
Dot-grid notebook paper, clean Fraunces headline, device on the right and handwritten Caveat margin notes on the left with wobbly hand-drawn accent arrows pointing into the UI.Checklist
見出しの下に、すべての機能を並べたチェックリスト。手描きのアクセント色のチェックが枠からはみ出します。デバイスはMacでは横に、iPhoneとiPadでは下端からはみ出して配置します。
shot-butcher style=checklist theme=dark accent=#7C5CFF platforms=mac
Headline over a ticked checklist of every feature, hand-drawn accent checks breaking out of their boxes; device beside it on Mac, bleeding off the bottom on iPhone and iPad.shot-butcher style=checklist theme=light accent=#E8603C platforms=iphone,ipad
Headline over a ticked checklist of every feature, hand-drawn accent checks breaking out of their boxes; device beside it on Mac, bleeding off the bottom on iPhone and iPad.Color Sequence
どのショットも同じ中央揃えのレイアウトで、アクセント色から始まる6段階の色相シーケンスの、次のフラットカラーにそれぞれ配置します。位置を示すチップ列を添え、文字色は背景色ごとにコントラストを保つよう切り替わります。ダークテーマではデバイスの背後に色付きの光が加わります。
shot-butcher style=color-sequence theme=dark accent=#7C5CFF platforms=mac
Identical centred layout on every shot, each on the next flat colour of a six-step hue sequence from the accent, with a chip row marking its place; ink flips per colour for contrast; dark theme adds a tinted glow behind the device.shot-butcher style=color-sequence theme=light accent=#E8603C platforms=iphone,ipad
Identical centred layout on every shot, each on the next flat colour of a six-step hue sequence from the accent, with a chip row marking its place; ink flips per colour for contrast; dark theme adds a tinted glow behind the device.Risograph
温かみのある紙に刷るリソ風の2色刷り。アクセント色と濃い2色目のインク、粒子感、段階的なハーフトーンのドット面、ポスター見出しにずらして重ねたアクセント色の見当ずれ、オフセットしたアクセント色の版にのせたデバイス。
shot-butcher style=risograph theme=light accent=#7C5CFF platforms=mac
Two-ink riso print on warm paper: accent plus a dark second ink, grain, stepped halftone dot fields, an off-register accent overprint on the poster headline and the device on an offset accent plate.shot-butcher style=risograph theme=light accent=#E8603C platforms=iphone,ipad
Two-ink riso print on warm paper: accent plus a dark second ink, grain, stepped halftone dot fields, an off-register accent overprint on the poster headline and the device on an offset accent plate.Stat Hero
アクセント色の巨大な数字1つと、その下のラベルがヒーローを占めます。機能ショットでは同じ位置に見出しが巨大な要素として入り、デバイスは右下の隅に小さく置きます。
shot-butcher style=stat-hero theme=dark accent=#7C5CFF platforms=mac
One huge measured number in the accent with its label beneath dominates the hero; feature shots make the headline the giant element in the same spot, device smaller in the bottom-right corner.shot-butcher style=stat-hero theme=light accent=#E8603C platforms=iphone,ipad
One huge measured number in the accent with its label beneath dominates the hero; feature shots make the headline the giant element in the same spot, device smaller in the bottom-right corner.Sticker Pop
明るいフラットな背景に、ぽってりしたBricolage Grotesqueの見出し。デバイスには傾けたダイカットのステッカーを貼り重ねます。波形の縁のキッカーシール、機能のピルやタグには、太い白のカットラインとドロップシャドウを付けます。
shot-butcher style=sticker-pop theme=dark accent=#7C5CFF platforms=mac
Bright flat field, chunky Bricolage Grotesque headline and the device covered in tilted die-cut stickers: a scalloped kicker seal plus feature pills and tags with thick white cut lines and drop shadows.shot-butcher style=sticker-pop theme=light accent=#E8603C platforms=iphone,ipad
Bright flat field, chunky Bricolage Grotesque headline and the device covered in tilted die-cut stickers: a scalloped kicker seal plus feature pills and tags with thick white cut lines and drop shadows.Stack Cascade
この画面を手前に、次の2画面を背後に重ね、扇状に広げたカードの束のようにずらして傾けます。見出しは横(Mac)または上(iPhone、iPad)に置き、現在位置を示すドット列を添えます。
shot-butcher style=stack-cascade theme=dark accent=#7C5CFF platforms=mac
This screen in front, the next two screens stacked behind it, stepped and tilted like a fanned deck; headline beside (Mac) or above (iPhone, iPad) with a slot-position dot row.shot-butcher style=stack-cascade theme=light accent=#E8603C platforms=iphone,ipad
This screen in front, the next two screens stacked behind it, stepped and tilted like a fanned deck; headline beside (Mac) or above (iPhone, iPad) with a slot-position dot row.すべての言語に
スタイルはそのまま。お客様の言語で。
コピーは最初から言語ごとに管理します。長いドイツ語の見出しは収まるよう自動で縮小され、日本語も正しく折り返され、ローカライズしたキャプチャも同じ枠に収まります。
Shot Butcher
ドラッグ作業は、もう終わり。
画面は、さばいてセットに。
無料でオープンソース。スキルをインストールして、このページのプロンプトを貼り付ければ、画面をさばいてストアにそのまま出せるセットに仕上げます。
GitHubで入手始める前に、ご質問はありますか?
スタイル、デバイスサイズ、うまく動かない点など、お気軽にご相談ください。



































































































































































































































































































































































































































































