めめめぶろぐ

Photoshop初心者でノンデザイナーがフォトショップ上達するためにバナー模写(トレース)のやり方・作り方。フォトショップの使い方、ポートフォリオ制作

バナー模写4

| KIRINさんのキャンペーンバナー

バナー模写4回目は

KIRINさんのキャンペーンバナーを模写。

参考バナー

f:id:eye_mememe:20200917125958j:plain

▼作成バナー

f:id:eye_mememe:20200917130046j:plain

 

 

▼ガイド線

毎回サイズ感や位置がどうしても違ってしまうので、

今回は、一番上に参考バナーのレイヤーを置いてバナーを模写。

ガイドの線も今まで以上に引きました!

f:id:eye_mememe:20200917130240p:plain

 

▼背景作成

レンガ画像はフリー画像サイトからダウンロード。

暗くするために「イメージ」→「色調補正」→「色相・彩度」から

「色相」「彩度」を調整

f:id:eye_mememe:20200917130435p:plain

 → 

f:id:eye_mememe:20200917130506p:plain

 

 ▼ワインボトル配置

ワインボトルもフリー画像サイトからダウンロードしてきました。

f:id:eye_mememe:20200917130930p:plain

明るすぎるので、新しいレイヤーを作成して黒で塗りつぶし

塗りつぶしツールを選択した状態で、上部のバーにある「不透明度」のパーセンテージを下げる。数値が低い程、後ろが透ける。

f:id:eye_mememe:20200917131020p:plain

一部光が当たっているようになっているので、光用に新規レイヤー作成。

左側のアイコンから「ブラシツール」を選択。描画色を黄色?茶色?を選ぶ。

これも不透明度を調整できるので、数値を低くしてブラシで描く。

ブラシのサイズ、硬さも上部のバーから選べる。

f:id:eye_mememe:20200917131122p:plain

前にもワインボトルを配置。これは特に加工なし

f:id:eye_mememe:20200917131207p:plain

 

長方形ツールで帯を配置 1

f:id:eye_mememe:20200917131304p:plain

左のアイコンから「長方形ツール」を選び、長方形を描く。

左下のアイコン f:id:eye_mememe:20200917131403p:plain「レイヤースタイルを追加」から「境界線」を選ぶ

f:id:eye_mememe:20200917131445j:plain

  1. 1. 境界線にチェックを入れる
  2. 2. 線の太さを決める。今回は2pxにしてみた
  3. 3. 境界線を長方形ツールの外側に引くか内側、中央に引くか
  4. 4. 塗りつぶしタイプを「グラデーション」にする
  5. 5. グラデーションの配色具合を調整する
  6. 6. スタイル:線形
  7. 7. 角度:0°

 

長方形ツールで帯を配置 2

f:id:eye_mememe:20200917131622p:plain

左のアイコンから「長方形ツール」を選び、長方形を描く。

f:id:eye_mememe:20200917131659j:plain

  1. 1. 長方形ツールを選択したまま上部メニューから「塗り」をクリック
  2. 2. グラデーションを調整
  3. 3. グラデーションスタイルを選ぶ「線形」にする
  4. 4. 角度を選ぶ「-80」

 

▼テキストを配置

f:id:eye_mememe:20200917131812j:plain

赤線の四角で囲った部分は f:id:eye_mememe:20200917131403p:plain「レイヤースタイルを追加」「サテン」を選択

f:id:eye_mememe:20200917131924j:plain

  1. 1. 「サテン」にチェックを入れる
  2. 2. 色を決める
  3. 3. 不透明度を50%にする
  4. 4. 角度を「157°」にする
  5. 5. 距離を12px、サイズを24pxにする

 

▼リボン風帯を設置

f:id:eye_mememe:20200917132147p:plain

f:id:eye_mememe:20200917132207p:plain

左のアイコンから「長方形ツール」を選択して長方形を描く。

色は上部の「塗り」の部分で変更可能。

f:id:eye_mememe:20200917132241p:plain

[option](Mac)、[Alt] (Win)を押しながら長方形ツールで描くと既に描いた長方形と交差するところだけが削除される。

これを調整してリボン風にする。

[command ⌘]+[T](Mac)、[Ctrl]+[T](Win)を押すと長方形ツールの変形や移動ができる。

f:id:eye_mememe:20200917132441p:plain

この操作を行うと、ライブシェイプが標準のパスに変わります。続行しますか?

と出るので「はい」にする。

f:id:eye_mememe:20200917132516p:plain

 

リボン風帯をなびかせる

レイヤーで長方形を選択した状態で、上部のメニューバーから「編集」「変形」「ワープ」を選ぶ

f:id:eye_mememe:20200917132610p:plain

枠線が複数出てくるので、これを上下左右に動かしてなびいているようにする。

f:id:eye_mememe:20200917132658p:plain

こんな感じかな?

f:id:eye_mememe:20200917132744p:plain

My KIRIN 会員限定」のテキストを入れて完成!!

f:id:eye_mememe:20200917132813p:plain