photoshop バナートレース #5 『アウトレットモール BRANDELI』ギザギザ円で苦しむ

Design

こんにちは!

ななふ@na2factoryです。

バナートレース5回目になります。

 

過去4回はテキスト中心のバナーをお手本にしていました。

そろそろ画像を使ったバナーもやってみたいな…と。

5回目はいよいよ画像ありバナーに取り組みたいと思います。

 

お手本として、バナーデザインアーカイブさんのサイトより、

『アウトレットモール BRANDELIのバナーデザイン』を使用させて頂きます。

今回、お手本の色違いサンダルの画像を切り抜いて使用させて頂きます。(切り抜きの練習!)

 

スポンサーリンク
スポンサーリンク

#5 オリジナルとトレース画像

【オリジナル】

【トレースした画像】

#5 制作の振り返り

参考バナータイトル:アウトレットモール BRANDELIのバナーデザイン

参考バナーのサイズ (幅 x 高さ)(px):200 x 200

制作にかかった時間:3.5時間

使用したフォント

  • ¥1,900の部分 : 数字はJost(Bold), ¥はHGP創英角ポップ体
  • 均一セール、アウトレットセール、BLANDELI : HGP創英角ゴシックUB

考察

苦労した点

¥1,900のフォントを見本と似た角度で並べる部分

フォントはGoogleFontで探して、Jostが一番近いと思って決めたのですが

その後の角度変更で迷走しました。

単純にテキストを角度つけただけでは、なんか違うのです。

特に数字の向きが見本と全然違う。

今回はテキストを変形(ゆがみ)で無理やり見本に近づけて終了にしました。

もっとスマートな方法がきっとあるんだろうけど…

¥1,900を囲むギザギザ円の作り方

見本のギザギザ円に似たシェイプを発見。

(カスタムシェイプツール→従来のすべてのデフォルトシェイプ→バナーと賞→記章)

しかし、見本と比べるとギザギザの数が合わない。合わせ方も分からない。

なのでカスタムシェイプを使うのはやめて、自分で作ることに。

以下のサイトを参考にして、自分で数えたギザギザの数28で多角形シェイプで作ることができました!(辺のくぼみを10%に設定)

ギザギザ円の色

見本の色は濃いブルーからやや薄いブルーに変わっている感じに見えたので

グラデーションを使ったのです。しかし出来上がりを見るとトレースはのっぺりと平面的!

見本はもっとひと手間かかっている!

後ひと手間が必要なんだと分かったのですがここで力尽きたのでした。

今後の課題

photoshopの小技をもっと覚えること、フォントを探すスピードアップ!

今回は見本から画像を切り抜いて使ったので、次回は素材を探して使うこと、ですね!

 


今回は以上になります。

最後まで読んでいただき、ありがとうございました!

 

Design
スポンサーリンク
この記事が気に入ったらシェアしてね!
na2factoryをフォロー
スポンサーリンク
na2factory
フリーランス Webデザイナー

このサイト、
Na2 factory(なな ふぁくとりー)を運営している
"ななふ"と申します。
群馬県在住の40代女子です。

2020年8月からWebデザインの勉強を独学でスタートし、
12月にクラウドワークスでチラシ制作を初受注!
以降、細々とバナーやチラシ制作を受注しております。
2021年11月、フリーランスWebデザイナーとして開業しました。

このサイトでは、Webデザイナーになるべく自分が調べた事、
テクニック等を詳細に紹介していきたいと思います。
これからWebデザイナーを目指す方々や、活躍中の方々と
情報共有できたら嬉しいです!

詳しいプロフィールはこちら

na2factoryをフォロー
Na2 factory ななファクトリー

コメント

タイトルとURLをコピーしました