ForYourImages MAGAZINE

コピースペースが足りない時に役立つ!背景を足してバナーをデザインする方法【Photoshop】

2018/11/13
2018/11/13

コピースペースが足りない時に役立つ!背景を足してバナーをデザインする方法【Photoshop】

Photoshopで背景を足して自由にバナーをデザインする

「せっかくいい画像素材がみつかったのに背景が足りない……」そんな経験をした、新人デザイナーやWEBデザイン初心者の方必見!今回は縦にも横にも自在に背景を伸ばす方法です。以前はPhotoshopを使った「ひとつの画像素材を使って複数サイズのバナーをデザインするコツをご紹介しましたが、今回は「塗りつぶし:コンテンツに応じる」を使ったバナーの制作方法です。

今回使用した素材はこちら

購入した素材のカンバスサイズを広げる

画像をPhotoshopでひらいたら背景レイヤーの鍵アイコンをクリックしてレイヤーの部分ロックを解除します。レイヤー名が「背景」から「レイヤー0」に変わります。

メニューの「イメージ」「カンバスサイズ」でカンバスサイズを広くします。使用する画像にもよりますが、横幅1.5倍くらいを上限の目安にしてください。

左右に透明背景が足された画像ができあがりました。

画像の背景を伸ばす

試しに以前ご紹介した「コンテンツに応じて拡大・縮小」を使ってみましょう。

人物の影響は少ないですが、斜めの線は歪んで拡大され不自然な印象になります。

こういった斜めの線が多い場合は「塗りつぶし:コンテンツに応じる」を使ってみましょう。選択ツールで背景を足したい部分(透明な部分)を選択します。次にメニューの「編集」「塗りつぶし」を選択してください。でてきたウインドウで内容を「コンテンツに応じる」を選択して「OK」をクリックします。

歪みもなく、自然に背景画像が足すことができています。

「塗りつぶし:コンテンツに応じる」を使えば横方向だけでなく上方向にも画像を足すことができるので、縦長のバナーの制作も自由自在です。ポイントは背景を足したいエリアを分割して塗りつぶすこと。一度に広い範囲を塗りつぶすと失敗する可能性が上がります。

せっかくいい画像素材がみつかったのに背景が足りないという理由で諦めるのはもったいない!「塗りつぶし:コンテンツに応じる」を使って画像素材を活用しましょう。

 

いますぐForYourImagesで画像素材を見つける

 


定額制ならもっと気軽に、もっとさくさん!
8,000万点を超えるすべての画像素材が対象です。

ForYourImagesのサブスクリプションプラン(定額制)は日々の業務で画像素材が必要な方におすすめです。掲載されている8,000万点以上すべての素材が対象で、サイズの制限もありません。しかも、素材1点あたり145円(税抜)~と料金もかなりおトク!

高品質で気軽に使える写真素材のForYourImages