エージェント向け Polysh を早期アクセスで提供中。コーディングエージェントがデモを録画し、Polysh が仕上げます。 ウェイティングリストに登録 →

スクリーンショットにロゴを追加

スクリーンショットや写真に、サイズと位置を正確に決めて自社のロゴを入れられます。

ブラウザツールを読み込んでいます…

スクリーンショットにロゴを追加でできること

「ロゴを選択」をクリックしてロゴのファイルを選びます。背景が透明な PNG がきれいに仕上がります。ロゴは右下に、画像の幅の 16% のサイズで、端から 2.5% 内側に置かれます。9 つの位置からほかの位置を選ぶか、プレビューをクリックしてその点を中心にロゴを置けます。枠をドラッグすると、位置と幅を一度に決められます。

「不透明度」と「端からの距離」は「その他のオプション」にあります。不透明度を下げると、マーケティング画像にさりげないブランドマークとして入れられます。「ドラフト」のような文字の透かしには、スクリーンショットに透かしを追加を使ってください。

例

選ぶもの

組み込みの請求ページのサンプル(「例を使う」)。Northbeam のサンプルロゴが追加されます

ダウンロード

example-billing-settings-with-logo.png
1440 × 900 px、ロゴは幅 230 px、右下の端から 36 px

230 px は幅 1440 px の 16%、36 px は 2.5% です。ロゴの高さはロゴ自体の縦横比に従います。

スクリーンショットにロゴを追加の使い方

  1. スクリーンショットや写真を追加し、「ロゴを選択」をクリックしてロゴのファイルを選びます。
  2. 「位置」と「ロゴの幅」を選ぶか、プレビュー上で枠をドラッグして位置とサイズを一度に決めます。
  3. さりげなくしたい場合は「その他のオプション」で「不透明度」を設定し、「.png をダウンロード」をクリックします。

知っておきたいこと

  • JPG のロゴには塗りつぶしの背景の四角が付きます。きれいに仕上げるには、ロゴを透明な PNG か WebP で書き出してください。
  • ロゴの幅はスクリーンショットの幅を超えられません。小さな元ロゴを拡大するとぼやけるので、置くサイズ以上の幅のロゴを使ってください。
  • 1 枚の画像に置けるロゴは 1 つだけです。

スクリーンショットにロゴを追加についてよくある質問

スクリーンショットのどこにロゴを置けばよいですか?

ブランドマークは右下に置くのが一般的で、重要な UI を隠す可能性も最も低い位置です。隅が空いている SNS 用の画像なら左上も使えます。スクリーンショットで見せたい部分には置かないでください。

ロゴの透かしはどのくらいの大きさがよいですか?

画像の幅の 10〜20% 程度なら、目立ちすぎずにはっきり読めます。既定値は 16% です。大きなスクリーンショットの隅に小さく入れるなら、8〜10% で十分です。

ロゴの周りに白い四角が出るのはなぜですか?

ロゴのファイルに塗りつぶしの背景があるためで、多くの場合 JPG だからです。デザインツールから透明部分のある PNG として書き出し、もう一度選んでください。