#Webデザイン
ポップな印象のデザインの作り方
ポップなデザインの作り方

こんにちは!クリエイターのMです。
前回「高級感のあるデザインの作り方」をまとめてみたので、次はポップな印象にしたいときのデザインについてまとめてみようと思います。

https://spc-jpn.co.jp/blog/26523/

ポップなデザイン、個人的には苦手な分野ですがポイントを押さえれば何とかなるなと思った次第です。

ポップなデザイン作り方

トーンのはっきりした色を複数使ってみる

ポップなデザインにするために一番大切なのは配色。
無彩色だけでデザインされてるポップなサイトは見当たらず、多くがカラフルで、かつ結構パキッとした配色になっています。
パキッとした配色=トーンのはっきりした色という意味です。

ちなみにトーンというのは、色調のことで、明度と彩度で色の調子を表します。
色についての勉強をしてると出てくる、これです。

トーン

例えば、ペールトーン「軽い  あっさりした  弱い  女性的  若々しい  優しい  淡い  かわいい」というイメージがありますし、グレイッシュトーン「 灰みの  濁った  地味な」というイメージがあります。
トーンによって、与える印象が大きく変わってくるのです。

ポップな印象にするには、ブライトトーンやストロングトーンというような、明るくはっきりした色味のトーンを使用するのがおすすめです。

フォントは太めゴシックでインパクト

ポップな文字

ポップさを出すにはインパクトも大切です。

ゴシック体と明朝体で比べると圧倒的にゴシック体の方がインパクトが出ますし、カジュアルな印象になります。
さらに「太め」にすることでメリハリが生まれ、ポップな印象に近づきます。

境界線を使って文字自体に装飾をつける

写真や文字に境界線をつけると、結構手軽にポップな印象にすることができます。
さらに、文字自体への装飾はとても有効で、斜めに配置したり、丸や四角でくくったり、散らしたり、影をつけたりと、いろんな装飾のつけ方があるので、デザインし甲斐があると思います。
ここはデザイナーの腕の見せどころですね。

与えたい印象によっては丸みをプラス

ポップな感じにしたい!といっても、「ポップで元気なイメージにしたい保育園のサイト」なのか、「ポップで疾走感のあるイメージにしたい車のサイト」なのかで、雰囲気が変わってくるのは想像できると思います。

ポップなデザインの中でも「疾走感」とか「シュッとした」とかそういうイメージにしてほしいという要望でない限りは、丸みをプラスすることでよりポップな印象に近づけることができるはずです。

丸みをプラスするには、波線や、流体のシェイプ、角丸の図形などがそれにあたりますが、文字の角も加工して丸くしたり、写真を丸くトリミングしたりと、今ある角をとっていく作業も有効です。

角の丸みを大きくすればより柔らかい印象になりますし、ちょっとだけ角を丸くするだけにとどめれば柔らかくなりすぎず、パキッとした固めな印象を残す事もできます。

まとめ

ポップな印象にするための方法をいくつかご紹介してきましたが、いかがでしたでしょうか?
結構苦手な分野のデザインですが、たくさんの参考のデザインを眺めているといくつか共通点が見えてきます。

今回挙げた4つ以外にもまだまだたくさんあるので、またの機会に書いていこうと思います!

CONTACT

この度は当社へご興味お持ちいただき
ありがとうございます。
Webに関するお悩みございましたら、
是非一度お気軽にご相談ください。
平日10:00~19:00