スクリーンショットをきれいに見せる方法:背景・フレーム・サイズ
Gizke チーム · 公開日 · 読了時間: 3 分
ただのスクリーンショットは、きちんと作られた製品画像の隣だと未完成に見えます。直すポイントは 4 つ。たっぷりの余白、白以外の背景、角丸とやわらかい影、そして投稿先に合ったキャンバスサイズです。無料の Gizke スクショ加工ツールなら、この 4 つをブラウザだけで行えます。Ctrl+V で貼り付けて、くっきりした PNG をダウンロードするだけです。
スクショがきれいに見える要素
- 余白。 スクショのまわりに、幅の 6〜10% ほどの余白を取りましょう。端が詰まっていることが、いちばん「素のまま」に見える原因です。
- 背景。 やわらかいグラデーション、ブランドカラー、またはスクショ自体をぼかした背景で、白いタイムラインやスライドから浮き立ちます。
- 角丸と影。 8〜16 px の角丸とやさしい影で、背景の上に浮かぶウィンドウのように見えます。
- 必要ならフレーム。 URL 入りのブラウザ枠は「これは Web サイト」と伝えます。ダークモードのアプリにはダークブラウザかダークウィンドウを。
プラットフォーム別のサイズ
- X(Twitter): 1600 × 900(16:9)でタイムラインに全体が表示されます。
- LinkedIn の投稿とリンクプレビュー: 1200 × 627、Open Graph 画像は 1200 × 630。
- Instagram: 正方形 1080 × 1080、またはフィードで大きく表示される縦長 1080 × 1350。
- ストーリーズ・リール: 1080 × 1920。
- Product Hunt のギャラリー: 1270 × 760。
サイズでプラットフォームを選ぶと、そのピクセル数ちょうどの PNG が出力されます。スクショは中央に置かれ、切れることはありません。
手順
- スクショを撮り(Windows:Win+Shift+S、Mac:Cmd+Shift+4)、スクショ加工ツールに Ctrl+V で貼り付けます。
- 背景を選びます:グラデーション、単色、ぼかしたスクショ、または透明。
- 余白と角丸を調整し、影を選び、必要なら URL 入りのブラウザ枠を付けます。
- プラットフォームのサイズを選ぶか、自由サイズのまま 2× で書き出して高解像度画面でも文字をくっきりさせます。
- PNG をダウンロードするか、コピーして投稿に直接貼り付けます。
先に個人情報を隠す
スクショには、共有するつもりのなかったメールアドレスや名前、番号が写りがちです。加工の前にぼかしツールで隠しましょう。複数のスクショを並べたいときはコラージュメーカーが便利です。
よくある質問
X や LinkedIn に載せるスクショのサイズは?
X は 1600 × 900(16:9)ならタイムラインで切れずに表示されます。LinkedIn やリンクプレビューは 1200 × 627 か 1200 × 630。Instagram は 1080 × 1080 か 1080 × 1350、ストーリーズは 1080 × 1920 です。
スクショはアップロードされますか?
いいえ。Gizke のスクショ加工ツールはブラウザ内のキャンバスで描画し、PNG を端末やクリップボードに直接保存します。
背景は透明にすべき?
背景のあるスライドや Web ページに置くなら透明が便利です。SNS ではグラデーションや、スクショをぼかした背景のほうがタイムラインで目立ちます。