Twitch パネル サイズ：寸法・高さ・デザインガイド

1. Twitch パネルの公式上限

情報パネルはチャンネルの「チャンネル情報」に表示されます。現在の編集画面では最大横320px×縦600px、容量1MBです。最終画像を横320pxで出力すると、視聴者が見る文字サイズを正確に確認できます。320×600は必須テンプレートではなく外枠なので、用途に必要な高さだけを使います。

2. 内容に合わせて高さを決める

必須のアスペクト比はありません。横320pxを共通にして、高さは用途ごとに変えられます。見出しを600pxに引き伸ばしたり、週間予定表を100pxに押し込んだりせず、文字と余白が快適に残る最短の高さを選びます。

• すべて横320pxで書き出す。
• 左右の安全余白を共通化する。
• 重要な要素を端に寄せない。
• 長い説明文は画像ではなく本文欄に残す。

3. PCとスマホの両方で読める設計

スマホではパネルが小さく表示されます。短いラベル、認識しやすいアイコン、十分なコントラストを優先してください。完成画像を実寸320pxとスマホ幅の両方で確認し、拡大しないと読めない詳細は説明文へ移します。画像は案内役であり、コピーや翻訳が必要な情報の代わりにはしません。

4. 1MB以下で鮮明に書き出す

フラットな色、透明部分、アイコン、文字にはPNGが向いています。写真主体ならJPGで軽量化できますが、文字の縁にノイズが出ないか確認します。横320px、sRGBで出力し、100%表示で文字と透明部分を確認してから1MB以下か検査します。編集可能な大きいマスターは別に保存してください。

1. 横幅アップロード用を正確に320pxへ縮小します。
2. 色sRGBで出力します。
3. 実寸確認文字、透明部分、位置を確認します。
4. 容量1MB以下か確認します。

5. 統一感のあるパネルセット

すべて同じ高さにする必要はありません。枠線、角丸、アイコンの大きさ、ラベル位置、背景処理を共通化します。Donate、Schedule、Rules、Socials、Gearが同じチャンネルの要素だと分かる状態を作り、スポンサーやアフィリエイトの説明は読める本文に残します。

• 基本色は2〜3色とアクセント1色。
• 書体とラベル位置を統一。
• 文字とアイコンの周囲に余白を取る。
• 重要なパネルを上に置く。
• 画像外にも説明文を用意する。

6. よくあるサイズの失敗

大きなキャンバスに細かい情報を詰めて最後に320pxへ縮小すると読めなくなります。横幅、余白、アイコン比率がばらばらなセットも避けます。パネルをバナー、オフライン画面、バッジ、エモートと混同しないでください。16:9バナーは細い情報欄では高すぎるか、文字が小さすぎます。

7. 制作とアップロードの手順

横320pxのテンプレートを複製し、短いラベル、一つの補助アイコン、内容に合う高さを設定します。書き出し後に実寸で確認し、管理しやすいファイル名を付けます。Twitchで「パネルを編集」を有効にして画像を追加し、必要なリンクや説明を設定します。ログアウト状態とスマホ幅で、リンク切れ、文字切れ、弱いコントラスト、不要な高さを確認します。

1. 整理必要なパネルだけを選びます。
2. 設計共通の320pxグリッドを使います。
3. 出力1MB以下のPNGまたはJPGを作ります。
4. 公開リンク、順番、スマホ表示を確認します。