見出し画像

デザインのきづき05

webデザイナーに憧れるアラサー機械工、いずみです。
しばらく他の作業をやっていたり、仕事が忙しくなってきたりと、言い訳をして記事投稿をしばらく休んでおりました。

今回はコチラのバナーをトレースし、気がついたことをまとめていきたいと思います。


global workさんというアパレルブランドだそうです。


そして、今回トレースしてみてこんな感じになりました↓


今回特に、再現度が低くなってしまいました。

前日にトレースに挑戦したのですが、似たフォントがどうしても見つからず、嫌になってやめてしまいました。

そして今回、縦長系の欧文フォント「OSTRICH SANS」をダウンロードして使ってみました。
いざ始めてみると全然違うフォントだと気づいたのですが、もうこれでいこうと。

フォントを探す時間は、作業時間に当てようということで、このフォントでトレースしました。

でも、この素敵なフォントを見つけられたのでよかったです。

文字が太い

特に今回のようなテキストを読ませたいバナーでは、文字を太くしてるケースが多いと思いました。
理由ははっきりとはわかりませんが、予想はつきます。

  • サイズの小さいバナーで文字が細いと良く読めない

  • 背景色に埋もれないようにする

  • 文字が細いをスペースが埋まらず、スカスカ感がある

こんな感じでしょうか。
基本ボールド以上、見出し等はブラックも使われていますね。

逆に説明文や注意書きなど、優先順位が低いテキストは細い文字は使われている印象があります。

「MAX」、「OFF」、「SAT」、「SUN」などの文字が細くて見えづらくなってしまっています。

角がある

今回トレースしていてなんとなく思ったことですが、
今回選んだフォントは、いわゆるラウンドの角が丸いフォントでした。

しかし、こういうシンプルで装飾の少ないバナーの場合、角が立ったサンセリフ体が多く使われているような気がします。
和文でいうところの角ゴシックのようなフォントで、少し縦長系が多いイメージがあります。

文字の大きさで、コントラストをつける

一番大きな「DISPLAY」、「SALE」の下に欧文で小さな文章が書かれています。

おそらくコピーのようなものだと思いますが、これは読ませる為でなく、デザインの為だけのテキストだと思います。

他のデザインでも、「大きな和文 + 小さな欧文」の組み合わせはよく見かけます。
見出しなどで、スタイリッシュにシマっていいですよね。

今回の例も、「これじゃ、流石に全く読めないんじゃないか?」と思いましたが、
かなり思い切ったサイズ差をつけてみてもいいかもしれないですね。

オリジナルでデザインする時も、参考にしたいと思いました。

まとめ

  • 基本的に、太い文字をつかう

  • 角が立ったフォントを選ぶ(全てではない)

  • フォントサイズで、コントラストを演出する

以上になります。
最後まで読んで頂きありがとうございました。





この記事が気に入ったらサポートをしてみませんか?