【初心者向け・バナー編03】WEB用ボタン作成 – レベル2

シュムデザインの新里です。

今回の動画の主な流れは、下記のようになっています。

・バナー作成の下準備
・長方形ツールで任意の大きさの長方形を作成 ※長方形ツールの状態で、何もない箇所をクリックするとウインドウが開くので、そこで縦横のピクセル数を入力してもOK
・長方形の塗りにグラデーションを適用
・グラデーションの色を設定する
・長方形の端をドラッグして4つの角を角丸にする
・長方形をctrl+Cでコピー、ctrl+Fで全面に張り付けて複製しておく
・楕円形ツールで適当な大きさの楕円形を作成
・楕円形と、長方形を同時に選択する
・パスファインダーの「交差」をクリックして、共通部分だけをくり抜く
・事前にコピーしておいた長方形と、くり抜き部分を同時に選択
・整列パネルで2つを上端を基準に合わせる
・くり抜き部分のグラデーションの向きを変える
・長方形に輪郭線(白)を設定する
・アピアランスパネルの新規効果追加でスタイライズ→ドロップシャドウで「影」を設定
・長方形の線の位置を「外側」に設定

バナー作成用の下準備は前回作成したバナーと同じになっています。

今回のバナーの作成ポイントは、一度、長方形をctrl+Cでコピーしてctrl+Fで複製したり、楕円形を作成して「パスファインダーパネル」でくり抜き部分を用いている所です。

最初は少し難しい操作のようにも思えますが、「パスファインダーパネル」やオブジェクトの複製は今後、かなり使用するテクニックですので、しっかりと理解できるようにしましょう!

ベネッセUdemyでも学習できます

Udemyとは、プログラミングやデザインなど幅広いジャンルの専門知識を超お手頃な値段で学習することができる教育動画プラットフォームです。

私自身も、Udemyにてコースを公開しており、複数のコースで「最高評価」を頂いています!

もし、今回の内容を含む全ての動画をご覧になりたい方はUdemy公開コースの記事よりご参照ください。

【前の動画へ】

【次の動画へ】