【バナー】バレンタインバナーデザイン

Photoshopの学びの覚書として作成しています。

作成のポイント

• 曲線を含んだ図形の作り方
• グラデーションオーバーレイの使い方
• グラデーションのかかったゴールドの枠の作り方
• 数字と日本語の混じったテキストの整列方法

作成の流れ

1. 画像を配置する
2. 曲線を含んだ図形を作る
3. 作成した図形にゴールドの枠（中央曲線部分）を作る
4. タイトルを入力する
5. サブタイトル「バレンタインデーフェア2024」を入力する
6. 開催日時を入力する
7. 全体のゴールドの枠を作る
8. PDFファイルを保存し、JPGを書き出す

作成の詳細

曲線を含んだ図形を作る

曲線ペンツール（パス）でキャンバスの中央に3点打ち、ドラッグで波型にする。1点目と3点目はキャンバスからはみ出させる。

ペンツールに変えて、キャンバスからはみ出した状態のまま枠を作る

Ctrl＋Enterで選択範囲に変えて、塗りつぶしレイヤー → べた塗りで適当な色で塗りつぶす

レイヤースタイル → グラデーションオーバーレイ を選択して適当な色を選択、スタイル：円形、グラデーションエディターを開き、カラーピッカーで仕上げたい色に変更する

※図形の中心軸（光っている部分）はドラッグで移動できる

作成した図形にゴールドの枠（中央部分）を作る

レイヤースタイル → 境界線 → 塗りつぶしパターン：グラデーションを選択

グラデーションエディターを開き、カラーピッカーで仕上げたい色に変更する

※図形の全体に枠ができるが、デザインとして見えるのは中央曲線部分になる

日本語のサブタイトルを入力する

「バレンタインデーフェア2024」の上下のラインはペンツールを使う

「定規」を使ってテキストとラインを整列させる

上下のラインとテキストの3つのレイヤーを「垂直方向に分布」で整列させる

開催日時を入力する

数字と日本語はフォントを変える（数字は欧文フォント）

数字は大きく目立たせる

異なるフォントを使ってテキストが上下にズレる場合はShift＋Alt＋↑↓でベースラインを調整する

なばな

Webデザインを勉強中の主婦です。シンプルで快適な暮らしを日々模索中。デザインの学びの記録と暮らしのヒントを綴ります。