見出し画像

「○○っぽい」を構成するデザイン要素

Dynamite Brothers Syndicateのデザイナー、本名(ホンナ)です。
前回の記事↓ 、予想以上に多くの方に読んでいただけて嬉しいです。

今回も見ていただいている方にとってプラスになるよう、
「デザイナーがお届けする“新しい視点のきっかけ”となる記事」であれば幸いです。

今回は、「○○っぽさ」ってどういう要素で構成されているのか?をまとめてみました。
深堀りするともっともっと色々な要素が広く&深くあるんですが、
これを参考に選択してみるとデザイナーでない方でも“○○っぽい”がつくれるようになる(はず)です。

主に、
・書体
・色
・レイアウト
の3点に絞ってまとめています。


「男性」っぽさ。

フォントメーカー:モリサワ

強さや鋭さなどを中心に演出すると、男性らしい印象を与えやすくなります。
わかりやすい演出だと、
・文字を太く、大きく
・メインとサブの要素のコントラストにメリハリをつける
・字間を狭くして1つの塊として伝える
・寒色系、明度の低いカラーを採用する
の4点です。

書体例

もちろんこれだけではないですが、例として3書体あげてみました。
それぞれ格納されているウェイト(文字の太さ)が幅広いので、見出しだけでなく本文としても使用しやすいです。

カラー例

色だと、このあたりでしょうか。
明るすぎず、鮮やかすぎず、どちらかというと落ち着いてどっしりとした印象であることが“男性っぽさ”につながると思います。


「女性」っぽさ。

フォントメーカー:モリサワ

華奢な印象や、やわらかい曲線は女性らしい印象を与えます。
わかりやすい演出だと、
・文字を細めに、小さめに
・流れるようなレイアウトが似合う
・字間を広くしてゆったりとした印象を
・暖色系、明度の高めなカラーを採用する
の4点です。

書体例

よく広告でも使用されるA1明朝を筆頭に、ながれるような美しい書体を3つあげてみました。
明朝体は太くしすぎると可読性が落ちるので、見出しにするときもウェイトを太くするよりは、フォントサイズをあげてレイアウトするときれいです。

カラー例

色だとこのあたりでしょうか。
しかし、“女性っぽさ”といってもターゲットとする世代や生き方、価値観によってデザインの方向性も調整が必要なため、一概にこの色が良いというわけではなく、この色をベースに明度や彩度を調整すると良いかもしれません。


「現代」っぽさ。

AdobeがGoogleと共同開発したオープンソースフォント

無駄が削ぎ落とされたような、ニュートラルな書体を選択することで、“現代っぽさ”が演出できます。ゴシック体やサンセリフ体のほうがしっくりきます。
わかりやすい演出だと、
・スタイリッシュに太くしすぎない
・メリハリよりは、シンプルで可読性が良いかどうか
・字間を狭すぎず太すぎずがgood
・はっきりとした色よりは、中間色や落ち着きのあるグレイッシュな色味
の4点です。

書体例

游ゴシックやヒラギノゴシックはベーシック中のベーシックな書体なため、変な印象を与えずにレイアウト構成ができます。

カラー例

色だとこのあたりでしょうか。
現代のフラットさや軽快さを表現するために、ドライや無機質といった印象を与えるような配色が好ましいです。


「ナチュラル」っぽさ。

フォントメーカー:フォントワークス

さわやかなでゆったりとした親しみさを感じる丸みは、ナチュラルな印象を与えます。
わかりやすい演出だと、
・やわらかく丸みのある丸ゴシック体を採用する
・細めの書体で軽やかさを演出
・字間をはやや広めで抜け感をつくる
・暮らしでよく見るナチュラルなカラーを選ぶ
の4点です。

書体例

筑紫A丸ゴシックや丸明オールドなど、本文でも読みやすい書体を使用すると全体的な統一感も出ます。


カラー例

色だとこのあたりでしょうか。
明度および彩度はあまり高くない、土や植物の色、空の色など自然な風合いを感じる色はナチュラルな印象を与えてくれます。


「高級」っぽさ。

フォントメーカー:モリサワ

「光朝」は、グラフィックデザイナー・田中一光氏が制作した明朝体です。欧文書体のBodoniを念頭に、明朝体のエレメントを様式としてつきつめたモダンな造形は、堂々としつつも品格と繊細な美しさを感じます。

高級感は、特別な存在感を示す重厚感や、華やかさを追求することがポイントです。
わかりやすい演出だと、
・堂々として、どっしりとしている書体を選択する
・細めの書体でも、優雅でエレガントさを基準に
・書体やカラーは統一感を大切にする(まとまり感がなくなるとチープに)
・色も明度が低めで、シックな印象のものを採用する
の4点です。

書体例

リュウミンは細めの書体ですが、「女性」らしい書体よりはやや癖があるため、存在感を出す意味では使いやすい書体だと思います。


カラー例

上でも触れましたが、
落ち着いた印象の色や、金や銀のような装飾品で実際に使用されているカラーも高級っぽさを出しやすいです。


今回は、簡易的ではあるのですが
○○っぽさを演出するためのコツをまとめてみました。

この「○○っぽいよね」は、解像度をあげていくと例えば
「水野学っぽいよね」
「佐々木俊っぽいデザインで」
「中目黒のビュリーみたいな」
というように、デザインを構築していくにあたってデザイナー同士が認識を合わせる意味でも活用したりします。

別の目的で外へ出かけた際に、その場所を広い目で見てみると
「ここのお店はなんだかすごく高級感を感じるな」
「ここにあるディスプレイはすごく力強くてインパクトあるな」
「あそこってどうしてあんなに落ち着くんだろうか」
などと考えてみたりすると、上記の○○っぽさが自身のなかで具体的になっていくので、言葉や思想に厚みがでてくるかと思います。

現代はデザインされていないものが無いほうが珍しいので、
そういったものを「どう見るか?」「どうやって自分のスキルへと昇華させられるか?」といった視点を持つだけで、思考のスイッチのひとつになると思います。

新たな視点のスイッチになりますように。


最後まで読んでいただきありがとうございます。
スキ、フォロー、シェアをしていただけるとうれしいです!


この記事が参加している募集

このデザインが好き

この経験に学べ