Rojiura

東京で働くWEBデザイナーのブログ。デザイン(WEB・DTP)や日常の出来事を書いています。

印象をガラリと変える、文字のデザインの基礎。

f:id:S_ind_5:20190221111513j:plain

今回のお題は、文字の扱いについて。

あくまで基礎的な内容なので、現職バリバリのデザイナーの人から見たら大した内容ではありません笑
が、営業の方の資料作りや学生さんの卒業制作のプレゼンなど、デザイナーじゃない人にはちょっぴり役に立ったりする内容なので、是非参考にしていただければなぁ、と考え書いてみました。




文字にメリハリをつける

まず最初は、文字のメリハリについて。
要は「伝えたいこと」に優先順位をつけ、それに応じて文字の大きさや色、太さに変化を加えてみましょう、という事です。
これが出来ていないと、「伝えたいこと」が分かりにくく、ぼんやりした印象になってしまいます。
「全部大事な情報だから…」と全部の文字を大きくしたりすると、逆に全部伝わらなくなっちゃうこともしばしば。
逆に、ここを押さえておけば、そこそこ見た目は良くなります。

f:id:S_ind_5:20190218175507p:plain
文字のメリハリがあまり無いパターン。

使用する色を絞る

次は、文字の色の扱いです。
これは内容によりけりだったりもしますが、なるべく2~3色程度に絞りつつ、細かい説明文は黒など落ち着いた色にするとまとまります。
逆に多色を扱い過ぎると、どの箇所も悪い意味で目立ってしまい、読み手は目のやり場に困ってしまいます。

f:id:S_ind_5:20190218175511p:plain
多色用いてみたパターン。

また、、もしコンセプトの様なものがあるならば、それに沿った色を使うのが吉です。
(海に関する内容だったら青を使う、など)

使用するフォントも絞ろう

フォントの種類も色々ありますが、あまり多く使わない方が全体的にまとまりが出ます。(だいたい2~3書体)
見出し(大きめの文字)に関しては和風であれば明朝体を使ったり…など色々試してみましょう!
(わかんねー!となったらとりあえず太めのゴシック体を使っておきましょう)
説明文に関しては、あまり変わった書体を使うとかなり読みにくくなってしまうので、読みやすいゴシック体(あまり太くないもの)などが良いです。
また、ポップな書体や手描き文字などの少し変わった文字を扱う場合は、アクセントで添えるぐらいの扱いにしておくと丁度いい塩梅になります。

f:id:S_ind_5:20190218175516p:plain
色々なフォント、使ってみた。

文字の「余白」を考える

こちらもかなり重要な要素、余白です。
文字の要素の間に適度な隙間を作ってあげることで、読みやすさが劇的に変わります。
なので、意識的に余白を作ることに慣れておきましょう。
なかなかその辺が慣れていないと、余白を埋めたくなったりしますがそこはガマンです。

f:id:S_ind_5:20190218175524p:plain
文字をギッチリ詰め込んでみた

※ちなみにデザイナー界隈でも余白を取る事に不安を感じる「余白恐怖症」たるものが存在します…。

以上が、文字を扱うときに意識すると良い、文字のデザインの基礎でした。
本当にデザインの基礎的な部分ですが、これらを意識すれば、作ったものの印象がガラリと良くなる(はず!)

最後に、正解ではないですが個人的にコレぐらいのバランスだと良いよ、という一例を載せておきます。

f:id:S_ind_5:20190218175502p:plain
丁度良い塩梅のデザイン(のつもり…)

ではまた!