00:00
こんにちは、フリーランスデザイナーのちふねこです。今日は、プロっぽく見えるデザインのコツ5選ということでお話ししていきます。
タイトルにもある通り、このひと手間で差がつくっていうことなんですけど、本当にその
よく私がこれまで自分で作ったもので、なんかその
会社員時代の上司が作るデザインと違ってなんかやぼったいんだよなぁとか、なんかイマイチ、もう一声というか
なんか足りないんだよなぁみたいな時に、その自分が作ったものと上司の素敵だなって思うデザインを見比べた時に
出てくる違いって、結構些細なことだったりするんですよね。 それができてないっていうだけで、急にやぼったくなったり
なんかイマイチっていう部分になったりするので、そのこうやってデザインのコツとして聞くと、そんな細かい部分
本当にみんな気にしてるの?みたいな、その一般的に作ったポスターを見る人たちが、一体その細かい部分の調整ってどこまで意識してるのって、こう作ってる側はふとね
その、我に返るというか、ここまでする必要あるのかみたいに思っちゃうことって、特にデザイン
学び、学んでる途中? まだ慣れてないとか、そういった時は本当にここまでしなきゃいけないのか
みたいに感じるようなことってあるんですけど、本当にこの一手間で差がつくんですよね。 っていうところで、その一度騙されたと思って、本当この一手間
それぞれ試していただきたいなっていう ポイントを今日は5つご紹介したいなと思います
はじめにサクッと5つキーワードでご紹介すると、1つ目揃える、2つ目ゆとり、3つ目フォントの統一感、4つ目
イラスト、アイコンの統一感、5つ目コントラスト、この5つです。それぞれ詳しくご紹介していきます。
まず1つ目の揃えるっていうのは、いわゆるデザインの4原則とも言われる整律っていうところなんですけど
デザインにおけるいろんな要素を揃えるっていう
コツですね。で、これは
その他のコツにも共通して言えることなんですけど、余計な印象を削ぐっていうところですごく大事というか、プロっぽいデザインに繋がるコツになってます。
03:00
なんか例えば、そうだな
名詞のデザインする時とかに、わかりやすいんですけど、結構文字の端がきちっと揃っているものが多いんですよね。
見えない線が見えるというか、名前の部分と住所の部分で文字のサイズとか
塊が違う、別の文字がたくさん並ぶと思うんですけど、それぞれの文頭をしっかり揃えるとか
そこで何か一つだけずれちゃうと、そこが気になっちゃったり、そこに意味が生まれたりするんですよね。
なので、あえてその名前を目立たせたいから、名前だけその名詞の中央ぞろえにして、他は右左ぞろえで揃えるとか、あえてずらすみたいなことはいいんですけど、そうじゃなくて
この住所とか連絡先とか細かい情報の中で、なんか電話番号の頭だけちょっと右にずれてるとか、そういう意図しないずれて、違和感に繋がるんですよね。
見てる人がなんかこれずれてないっていう、そういう余計な印象、余計な違和感を与えてしまうっていうのはデザインでやりたい、伝えたいことを伝えるとか
っていう役割としては余計なもの、余計な部分になってくるので、そういったものを避けるためになるべく揃えるものは揃えるっていうのは
この一工夫はすごく大事です。続いて2つ目のゆとりっていうのは、いわゆる余白をしっかりとるというか
その初心者のデザインでありがちなのが、枠いっぱいに文字を入れちゃうとか、なんか隙間がなくなるように何かイラストなり文字なり入れなきゃ、埋めなきゃみたいな
ことをしがちなんですけど、そうじゃなくてしっかりゆとりを持って余白を設定するっていうところをやると結構プロっぽいデザインに一気に近づいたりします。
これは、そのさっき言った余計な印象を削ぐみたいな効果じゃなくて、強調したい部分を強調するためにこの余白が大事になってきたりします。
シンプルにその余白がなくてギチギチだと、なんか窮屈な印象とか、なんかごちゃついた印象が生まれてしまうっていう面もあるんですけど、それだけじゃなくて
余白をたっぷりとることでそれが強調されたりするんですよね。その例えばタイトル、タイトル部分、資料デザインでも
はじめのページのタイトルを 画面いっぱいに文字敷き詰めるんじゃなくて
06:04
適度な大きさ、しっかり読める最低限の大きさで、さらっと真ん中にもタイトル文字あるだけで、周りにはたっぷり余白あっても十分それが目立つ
みたいなことってありますよね。そんな感じでその余白をあえてたっぷりとることによってその文字、その要素が目立つみたいなことがあるので
そういう強調という意味でもこのゆとりとして余白はしっかりとる。ギチギチにあんまり詰め込まないというか
よくあるのがそのボタンデザイン、ウェブデザインとかだとボタンとかまぁ DTPポスターとか印刷系のデザインでもそうですけど
何か枠に文字入れる時、その枠いっぱいに文字入れちゃったりとかすると思うんですけど、そうじゃなくて
枠と文字までの余白をある程度しっかりとることで結構落ち着いた印象というか
結構そこだけで垢抜ける、プロっぽくなったりするのでこれもぜひお試しいただければと思います
続いて3点目はフォントの統一感。これはよくフォントの種類は3つぐらいに絞りましょうとか聞くと思うんですけど
それももちろんあるし、もう一つはフォントのサイズを統一させる
これもいろんなフォントのサイズ使いすぎないほうが良くて
まぁっていうよりはあれですね、例えばプレゼン資料を作ってる時に
プレゼンの資料ってだいたいタイトル、見出し、本文みたいなある程度文字の役割って決まってるじゃないですか
それがページをまたぐごとに本文の文字サイズが変わるとかそういったことをなるべく避けた方がいいっていう
そういう文字サイズでも全体の資料の印象の統一感って変わってくるので
そういった余計な文字サイズも増やしすぎずに本文はこのポイント数で行こうとかを決めた方が
統一感、余計な印象、バラバラの印象を避けられるっていうところで
フォントの統一感、サイズにも、種類だけじゃなくてサイズにも
サイズも気にしてみるといいかなと思います
続いて4つ目はアイコンの統一
これはよくアイコンでテイスト色々あるんですけど、その線画なのかベタっぽいデザインなのか
なんかちょっと立体的?3Dっぽいデザインなのかフラットなデザインなのかみたいな
そういうアイコンとかイラストの素材にもいくつかスタイルとかテイストってあると思うんですけど
これをしっかり統一させた方がこれもまた全体の統一感につながる
09:04
これも違和感をなくすっていう意味でもよりプロっぽいデザインにつながる要因かなと思います
ちょっと時間がなくて駆け足なんですけど、最後のコントラストは
前回お話ししたメイアン?メイドさんの話にも通ずるんですけど
文字と背景の色をしっかりメリハリをつける、コントラストをつけることでより見やすさとか
その強調したいものをしっかり強調できるっていうところにつながるのでこのコントラスト
ちゃんと見やすいコントラストになってるかみたいなところは意識してもらえるといいかなと思います
以上5つですね、このひと手間で差がつくプロっぽく見えるデザインのコツをご紹介しました
今日も最後まで聞いてくださりありがとうございます