発注仕様書に活用してね!Steamのストア画像・ライブラリ画像のサイズとファイル名
投稿 最終更新
Steamのストアページとライブラリで使う画像を発注するときの仕様を、1ページにまとめました。発注する側は、このページのURLや表、チェックリストを発注仕様書にそのまま貼って使ってください。描く側は、サイズ、切れる場所、公式テンプレートのファイル名をここで確かめられます。
X(旧Twitter)のアイコンとヘッダーの記事と同じく、株式会社佐野組で絵を発注するたびに同じ説明を繰り返していたのがきっかけです。サイズや決まりはSteamworks公式のドキュメントと公式テンプレートをもとに書き、公式に書かれていないことは「確認できていない」と書きました。
概要
サイズは、Valve社のSteamworks公式ドキュメントに書かれている値です(令和8年10月13日確認)。配信の左右パネルだけは、公式テンプレートのPSDの大きさを書いています。
公式テンプレート
Valve社が配っているテンプレートです。各画像のサイズで作られていて、多くのPSDには切れる範囲などのガイドのレイヤーが入っています(どれに入っているかは下の「公式テンプレートのガイド」に書きました)。PSDのほか、Figmaのファイル(Steam Assets Template.fig)も入っています。
2024年8月に、多くのカプセル画像のサイズが大きくなりました。古いサイズは受け付けられません(出典)。テンプレートの「legacy templates」フォルダーにあるのは古いサイズなので、使わないでください。
画像の一覧とサイズ
| 場所 | 画像 | サイズ | 必要か | 中身 | 出典 |
|---|---|---|---|---|---|
| ストア | ヘッダーカプセル | 920×430px | 必須 | ロゴと絵 | 公式 |
| ストア | 小カプセル | 462×174px | 必須 | ロゴと絵。小さく縮んでも読めるロゴ | 公式 |
| ストア | メインカプセル | 1232×706px | 必須 | ロゴと絵 | 公式 |
| ストア | 縦長カプセル | 748×896px | 必須 | ロゴと絵 | 公式 |
| ストア | スクリーンショット | 1920×1080px以上(16:9) | 必須 | ゲーム画面 | 公式 |
| ストア | ページ背景 | 1438×810px | 任意 | 控えめな絵。明るすぎないもの | 公式 |
| ライブラリ | ライブラリカプセル | 600×900px | 必須 | ロゴと絵 | 公式 |
| ライブラリ | ライブラリヒーロー | 3840×1240px(PNG) | 必須 | 絵だけ(文字なし) | 公式 |
| ライブラリ | ライブラリロゴ | 幅1280px または 高さ720px(透過PNG) | 必須 | ロゴだけ | 公式 |
| ライブラリ | ライブラリヘッダー | 920×430px | 必須 | ロゴと絵 | 公式 |
| イベント | イベントカバー | 800×450px | イベントを出すとき | 絵と告知の文字 | 公式 |
| イベント | イベントヘッダー | 1920×622px | 任意 | 絵とロゴ。切れる範囲はテンプレートで確認 | 公式 |
| 配信 | 配信の左右パネル | 199×433px(左右1枚ずつ) | 配信するとき | 配信画面の横に出る絵 | テンプレート |
小カプセルからは120×45pxと184×69px、ライブラリカプセルからは300×450px、ライブラリヒーローからは1920×620pxの縮小版が、Steam側で自動で作られます。小さいサイズを用意する必要はありません。
描くときの注意(公式の決まり)
- カプセル画像には、読めるゲームのロゴ(タイトル)を入れます。小カプセルは、ロゴがほぼいっぱいになるくらいが目安です。
- カプセル画像には、ロゴ以外の文字(キャッチコピー、受賞歴、セール告知など)を入れません(出典)。
- ライブラリヒーローは文字なしの絵だけです。中央の860×380pxが「セーフエリア」で、窓の大きさが変わっても切れません。キャラクターの顔など大事なものはここに入れ、絵自体は全体に描きます。
- ライブラリロゴは、背景を透明にしたPNGです。ロゴの形に合わせて、幅1280pxか高さ720pxのどちらかにそろえます。
- すべてのカプセル画像は、全年齢向け(PG-13相当)の絵にします。
隠れる場所・切れる場所
画像が切れたり、上に何かが重なったりする場所のうち、Steamworks公式ドキュメントに書かれているものです。
| 画像 | 切れる・重なる場所 | 出典 |
|---|---|---|
| ライブラリヒーロー(3840×1240px) | Steamの窓の大きさによって周りが切れます。中央の860×380pxの「セーフエリア」だけは、どの大きさでも切れません。顔など大事なものはセーフエリアに入れ、絵はキャンバス全体に描きます。 | 出典 |
| ライブラリヒーロー(ロゴとの重なり) | ライブラリロゴがヒーローの上に重なります。ロゴの位置は、アップロード後にプレビューで「左下」「上の中央」「真ん中」「下の中央」から選びます。選ぶ予定の位置には、大事なものを置かないでください。 | 出典 |
| 小カプセル(462×174px) | 120×45pxと184×69pxの縮小版が自動で作られます。細かい部分はつぶれるので、ロゴがほぼいっぱいになるくらいにします。 | 出典 |
| イベントヘッダー(1920×622px) | 切れる範囲があります。公式の一覧には「切れる範囲はテンプレートを見てください」とだけ書かれています。 | 出典 |
公式テンプレートのガイド
公式テンプレートのPSDを開いて、ガイドのレイヤーが入っているかを確かめました(令和8年10月13日)。
| テンプレート | 入っているガイド |
|---|---|
library_hero.psd | セーフエリアのガイドあり(レイヤー名「Safe Zone Guides - Hide this layer before saving」) |
library_capsule.psd | ガイドあり(「GUIDES (turn off this layer before saving)」) |
event_header.psd | 切れる範囲のガイドあり(「Template Layer - Turn Off」「Edge blur area」) |
store_capsule_header.psd、store_capsule_main.psd、store_capsule_small.psd、library_header.psd | 表示例の枠(「Template TURN OFF」)と、DLC・デモ・サウンドトラックなどの帯の見本(「Placeholder FPO」)あり。帯は画像の端に重なることがあるので、見本を表示して位置を確かめると安心です。 |
store_capsule_vertical.psd | 表示例の枠(「Template TURN OFF」)あり |
library_logo_transparent.psd、store_page_background.psd、event_cover.psd、配信の左右パネル | ガイドのレイヤーはなし(キャンバスだけ) |
どのテンプレートも、ガイドや見本のレイヤーは書き出す前に非表示にしてください。レイヤー名にも「turn off」「hide」と書かれています。
よくある落とし穴
審査で差し戻されやすい点を、「公式の決まり」と「開発者の体験談」に分けてまとめました。体験談は個人のブログの記事で、Valve社の公式見解ではありません。
| 落とし穴 | 公式の決まり | 開発者の体験談 |
|---|---|---|
| カプセルにロゴ以外の文字を入れた | キャッチコピー、受賞歴、セール告知、行動を促す文句などは不可(公式) | 画像の下に自分のブランドアイコンを入れて差し戻された(エレフセリアゲームス) |
| カプセルにゲーム名が入っていない | カプセルには読める製品名かロゴを入れる(公式) | 縦長カプセル(hero_capsule)が「商品の完全な名前が含まれていない」、ライブラリカプセルが「アプリの名前が表示されない」で差し戻された(gamebox) |
| ライブラリヒーローに文字を入れた | ヒーローは文字なしの絵だけ(公式) | 差し戻しのメールに「ライブラリヒーローには余分なテキストやロゴオーバーレイを含めないで」と書かれていた(エレフセリアゲームス) |
| スクリーンショットに文字や宣伝を入れた | 実際のゲームプレイだけ。コンセプトアート、宣伝コピー、受賞画像、文字の説明は避ける(公式、公式) | スクリーンショットも宣伝文句などがだめで、Google Playで使っていた画像とは基準が違ったと書かれている(エレフセリアゲームス)。スクリーンショットにUIが映っている、タイトルがない・あるなどの理由で2回目の差し戻しを受けた報告(gamebox) |
| 古いサイズで作った | 2024年8月からサイズが変わり、古いサイズは受け付けない(公式) | (見つけた範囲では報告なし) |
| 小カプセルのロゴが読めない | 小さくしても読めるロゴにする。ほぼいっぱいの大きさが目安(公式) | (見つけた範囲では報告なし) |
| ライブラリロゴの背景が透明でない | 透過PNGにする(公式) | ライブラリロゴにはタイトルだけを入れるよう求められた例(エレフセリアゲームス) |
迷ったら、まず公式のGraphical Asset Rulesを読むのが確実です。
ドット絵を拡大するときのコツ
ドット絵(ピクセルアート)を拡大するときは、ニアレストネイバー法を使ってください。Photoshopでは「ニアレストネイバー(ハードな輪郭)」、ソフトによっては「Point」「最近傍」という名前です。バイリニアやバイキュービックで拡大すると、ドットの輪郭がぼやけます。
- 拡大は2倍、3倍のような整数倍にすると、ドットの大きさがそろいます。
- Steamのサイズは整数倍にならないことが多いので、整数倍に拡大してから、余白を足すか切り取るのがおすすめです。
- 拡大前の原寸の絵もあわせて納品すると、あとで別のサイズが必要になったときに同じ方法で作れます。
- 書き出しはPNGにします。JPEGにすると、ドットの境目に色のにじみが出ます。
納品形式のお願い
佐野組では、次の形で納品をお願いしています。発注仕様書に使うときは、自社の運用に合わせて書き換えてください。
- 上の表のサイズのPNG
- 可能であれば、レイヤー付きのPSD(ロゴや文字は、絵とは別のレイヤーに分ける)
- カラープロファイルはsRGB
- ライブラリロゴ以外は、背景を透明にせず塗った状態にする
- テンプレートのガイドのレイヤーは、非表示にするか削除しておく
ファイル名のコツ(守らなくても大丈夫です)
ここは「こうしてもらえると少し楽になる」というお願いです。守らなくても問題ありません。受け取った側で名前を付け直せます。
おすすめは、公式テンプレートのファイル名をそのまま使うことです。テンプレートの store_capsule_header.psd から書き出した画像なら、store_capsule_header.png にします。
| 画像 | ファイル名(公式テンプレートと同じ名前) |
|---|---|
| ヘッダーカプセル | store_capsule_header.png |
| 小カプセル | store_capsule_small.png |
| メインカプセル | store_capsule_main.png |
| 縦長カプセル | store_capsule_vertical.png |
| スクリーンショット | (テンプレートなし) |
| ページ背景 | store_page_background.png |
| ライブラリカプセル | library_capsule.png |
| ライブラリヒーロー | library_hero.png |
| ライブラリロゴ | library_logo_transparent.png |
| ライブラリヘッダー | library_header.png |
| イベントカバー | event_cover.png |
| イベントヘッダー | event_header.png |
| 配信の左右パネル | store_broadcast_left.png / store_broadcast_right.png |
作品名を入れたいときは先頭に付けます(作品名が「hoge」なら hoge_store_capsule_header.png)。言語ごとに作るときは、最後に言語名を付けます(hoge_store_capsule_header_japanese.png、hoge_store_capsule_header_english.png)。スクリーンショットは hoge_screenshot_01_japanese.png のように番号を付けます。
こうする理由は2つあります。
- テンプレートと同じ名前なら、どのテンプレートから作った画像かがひと目で分かり、アップロードするときに取り違えが起きにくくなります。
- Steamworksの公式ドキュメントには、スクリーンショットのファイル名の最後に言語名を付けると(例:
foo_japanese.jpg)、どの言語の画像かを判別する手がかりになる、と書かれています(出典)。
なお、Steamworksの管理画面が、スクリーンショットの言語以外(画像の種類など)をファイル名で見分けるかどうかは、公式ドキュメントでは確認できていません。画像の種類は、アップロードするときに選びます。
チェックリスト
- 各画像が表のサイズぴったりになっている
- 古いサイズ(legacy templates)を使っていない
- カプセル画像にゲームのロゴが入っていて、小さくしても読める
- カプセル画像にロゴ以外の文字が入っていない
- ライブラリヒーローに文字がなく、顔などがセーフエリア(中央860×380px)に入っている
- ライブラリロゴの背景が透明になっている
- ドット絵の拡大にニアレストネイバー法を使っている
- PNGで書き出している(sRGB)
- テンプレートのガイドを消してある
出典
Steamworks ドキュメント(令和8年10月13日確認)
- Graphical Assets(画像の一覧)
- Store Graphical Assets(ストア用画像)
- Library Assets(ライブラリ用画像)
- Graphical Asset Rules(画像のルール)
- 公式テンプレート(Dropbox)。ファイル名と配信の左右パネルの大きさは、令和8年10月13日にダウンロードした中身で確かめました。
- Review Process(レビューの流れ)
開発者の体験談(令和8年10月13日確認)