デザインスキル情報

デザインがダサくなる原因19選|プロ視点で原因と改善を初心者向けに解説

デザインを制作していて「あれっ?なんかダサい」「なんか上手くいかない」と感じた時どうしたら良いでしょうか?

今回は、新人デザイナーがやりがちなデザインがダサくなるポイントと明日から使える即効性のある解決法を紹介します。

ダサいデザインになってしまう原因は才能やセンスの問題だと思われがちですが、実はそうではありません。

結論
ダサいデザインができてしまう原因は、デザインのセオリーを踏まえていないことにあります。

私も15年デザイナーとして色々なデザインを手掛けてきましたが、デザインがダサくなるポイントには共通点があります

良いデザインを作るためには「なんとなく良い・悪い」ではなく原因を言語化することが非常に重要になります。

この記事でわかること

・なぜデザインがダサくなるのか

・ダサいデザインを回避できるのか

・デザインの4大ルール

aki

この記事は、現役デザイナーのaki(@aki_0415a)が書いています。
デザイナー歴15年でWEBとグラフィックを中心に手掛けています!

目次

“ダサいデザイン”になる原因19選

「ダサい」とは、単なる好みの問題ではなく、次の状態を指します。

  • ・違和感がある
  • ・情報が伝わらない
  • ・意図が分からない
  • ・メリハリがない

ここからは、「ダサいデザインの典型パターン」の原因・解決方法を実例付きで解説します。

感覚ではなく、論理的に改善できる観点でまとめていますので参考にしてみてくださいね。

余白に問題がある

初心者あるあるで

「余白が空いている=もったいない」

と感じて詰め込みがちですが、実際は、余白をうまく使うのがデザインのポイントであり質を大きく左右します。

① 余白がない/詰め込みすぎ

要素が密集し、窮屈になっている状態です。

読む側の負荷が高くなり違和感を感じます。

・テキストや画像がぎゅうぎゅうに配置されている

・要素同士がぶつかりそうな距離になっている

・行間・段落間のスペースが不足している

・見出しと本文の区別がつきにくい

余白を活かして見る側に違和感を与えないバランスを心がけるのが重要です。

② 余白が揃っていない(ガタガタ)

全体として余白はあるものの、文字と端までの距離がバラバラで統一感がない状態。

アンバランスで雑な印象を与えます。

・左右の余白が不均等

・セクションごとに間隔がバラバラ

・ボタンやカードの内側の余白が統一されていない

・行間・文字間・要素間の距離が場当たり的

要素を整列させると一気に素人感が抜けます。

③ 余白が多すぎる(間延び)

余白を意識しすぎて、逆にスカスカになっている状態です。

情報が散らばり、何を見ればいいのか分からない状態になっています。

・一番見せたいものがどこか分からない

・情報が点在してまとまりがない

文字間・行間などにも注目して調整することを心がけるとデザイン全体のクオリティーがグッと上がります。

情報量が多すぎる

初心者デザイナーに最も多い失敗の一つが「情報の詰め込み」です。

クライアントの要望をすべてそのまま載せようとすると、結果的に優先順位分からない、伝わらないデザインになります。

クライアントからの依頼では必ず優先順位をつけるようにしましょう!

① 優先順位がない

あれもこれも入れた結果、「結局何を見せたいのか分からない」状態です。

何が一番伝えたいのかが明確でなく、すべてが同じ強さで並んでいます。

・見出し・本文・補足が同じ大きさ

・重要情報が埋もれている

・視線の流れが設計されていない

優先呪印をつけることでメリハリが出るデザインを作成することができるようになります。

② 文字だらけ

ビジュアルよりも文字情報が多く、読者に負担をかけています。

文字情報が多いと人は本能的に読むことをやめてしまいます。

箇条書きや改行や段落分けで整理するとスッキリして見えます。

色使いが雑

配色はデザインの印象を大きく左右しますが、色は絞らなくてはいけません。

初心者ほど「目立たせたい」という理由で派手に色を増やしがちです。

その結果、統一感やデザインのイメージが損なわれます。

ちなみにデザインにおける配色についてはこちらの記事でさらに詳しく解説していますので参考にしてみてください。

【もう悩まない!】デザインが上達する配色のルール7選色はデザインにおいて方向性を決める大きな要素です。今回は、「3色ルール」「75%:25%:5%」の法則や色の心理効果、統一感を出す配色テクニックまで、初心者でもわかりやすく解説しています。見やすく・伝わるデザインの秘訣がぎゅっと詰まっています! ...

① 原色・蛍光色が強い

刺激が強すぎて、安っぽく見え目が疲れます。

真っ赤・真っ青などの高彩度色を多用したり目がチカチカする配色には注が必要です。

② 色の数が多すぎる

統一ルールがなく、場当たり的に色が増えています。

5色以上のメインカラーが混在しアクセント色が定まっていないと統一感が出ず安っぽい印象を与えます。

3色以内に抑えるようにするのがベターです。

③ カラーバランスが悪い

組み合わせが不調和で、全体に違和感がある状態です。

・色相(赤・青・緑など)がバラバラ

・明度(明るさ)や彩度(鮮やかさ)が不統一

・ブランドイメージと合っていない

解決方法として配色支援ツール(Adobe Color など)が参考になるのでおすすめです。

ただ、ツールに頼りすぎると意図のない配色になりやすいので、あくまで補助として使ってみましょう。

装飾が過剰

装飾は、

「意味がある時だけ」使う

のが基本ですが、初心者ほど「盛れば良くなる」と勘違いしがちです。

① 枠・影・グラデーション・袋文字の多用

不用意に影がついていると装飾が重なり、ダサく初心者っぽく見えます。

他にも過剰なグラデーションの使用も注意が必要です。

② 要素を盛り込みすぎて焦点がない

・画像・アイコン・バナーが多すぎる

・キャッチコピーが複数ある

・ボタンやリンクが散らばっている

どれもデザインが素人っぽく見えてしまう原因になるため要素を追加する時は本当に必要なのか吟味するようにしましょう。

フォントの扱いが悪い

文字は情報伝達の中心であり、フォント選びと扱い方がデザインの質を左右します。

① フォントのイメージが合っていない

フォントには、それぞれ適切な使用場面があります。

子ども向け媒体に硬い明朝体、高級ブランドにカジュアル書体など内容と書体の印象がズレているとイメージが崩れます。

② フォント数が多い

統一感がなくなり、雑な印象になります。

見出し・本文・補足で3種以上の使用や特殊な装飾系フォントの乱用も控えましょう。

装飾系フォントが決して悪いわけではないのですが、クセのあるフォントは使用どころを見極める必要があります。

③ 可読性が低い

そもそも読むことができなかったらデザインとしての意味がありません。

読みにくい書体やサイズ・色は使わないようにしましょう。

これらにも注意が必要です。

・小さすぎる文字サイズ、細すぎるウェイト(線の太さ)

・背景と文字のコントラスト不足

④ 文字間隔・縦横比がおかしい

レタリングや変形のミスが目立ちます。

無理な縦伸ばし・横伸ばしをおこなうとフォントのバランスが崩れ違和感が生まれます。

基本的にフォントの縦横比はあまり変えずに使用しましょう。

⑤文字間が詰まりすぎ/空きすぎ。

文字間が以上に狭い・広いと間延びした印象を与えてしまいます。

細かい箇所ですが、このような細部もちょっと調整するだけで全体のクオリティーがアップします。

写真・素材の使い方が悪い

素材はデザインの印象を左右しさまざまな表現ができる素材ですが、、編集、配置が雑だと全体のクオリティが下がります。

① 素材のテイストがバラバラ

統一感がなく、寄せ集め感が出ます。

・リアル写真とイラストが混在

・明るさや色味が統一されていない

・雰囲気が異なるストック素材の混在

アイコンはかならず同じテイストのものを使用しましょう。

また素材サイトのイラストなどを使用するときも同様です。

② 写真をそのまま使っている

明るさ・コントラスト未調整など最低限の調整がされていません。

また。トリミングが適当で不要な背景が残っているとせっかくの素材の良さを十分に引き出すことができません。

他にも

・背景が複雑で文字が読みにくい

・文字と写真のコントラスト不足

・テキストの配置に配慮がない

などがありますので、自分のデザインがこのような状態になっていないか注意しましょう。

④ 縦横比が崩れている

無理な拡大・縮小が目立ちます。

写真が横に伸びている・人物が歪んで見えるなどデザイン全体へ悪影響が出ます。

ダサいデザインになる原因と改善方法

デザインがダサくなる原因は、単なるスキル不足やセンスの問題ではありません。

共通しているのはセンスではなく「考え方」の問題です。

ここでは、初心者が陥りやすい思考パターンと、その改善の方向性を整理します。

なぜダサいデザインになるのか(初心者向き)

デザインがダサくなる原因って実は共通しています。

話題になるデザインの共通点を探すのは難しいですが、初心者が躓く箇所は基本的に同じと言えます。

ダサくなる4大原因

・デザインの基礎を押さえていない

・正解が分からず「足し算」になる

・不安だから情報を削れない

・判断基準がなく「なんとなく」で決めている

過去にいろいろな新人デザイナーをみてきましたが、

修正が多い人・上達しない人の共通の傾向といえます。

次からより具体的に解説していきます。

①デザインの基礎を押さえていない

デザイン4つの基本基礎は【近接】【整列】【反復】【対比】です。

この基礎を抑えることによってデザインの全体の構成を整えることができます。

近接(きんせつ:Proximity)

“関連するものは近く、関係ないものは離す“。

見出しと説明文を近づけるなどバラバラに散らさないことです。

情報のグループが一目でわかるようになります。

整列(せいれつ:Alignment)

左揃えに統一など“位置を揃え“ましょう。「なんとなく中央」などはNGです。

要素をそろえることで、画面が整理され、プロっぽく見えます。

反復(はんぷく:Repetition)

同じデザインの“要素を繰り返す“。

見出しは同じフォント、ボタンは同じ色・形アイコンのテイストを統一などデザインに統一感が生まれ、ブランドらしさが出る。

対比(たいひ:Contrast)

違いを“はっきり”つける。

見出しは大きく、本文は小さく、重要なボタンは目立つ色に、細い線か太い線か、曖昧にしない

対比を意識すると視線の誘導、優先順位が明確化され重要な情報が伝わりやすくなる。

②正解が分からず「足し算」になる

初心者ほど、「余白」が怖くていろいろな要素を追加してしまいます。

しかし、デザインは足し算ではなく引き算が基本です。

「なんかデザインが寂しい」とするあまり、迷ったら装飾・要素を足してしまう

見栄えを良くしようとして影やエフェクトを増やす

結果として、情報が散らかり、かえってダサくなります。

③不安だから情報を削れない

クライアントや上司からの指示をそのまま詰め込み、「削る」判断ができないことが大きな要因です。

「入れてほしいと言われたから全部載せる」

削ること=手抜き・失敗だと思うかもしれませんがそれは大きな間違い!

実務では、むしろ「何を削るか」がデザイナーの腕の見せどころです。

また重要な要素にも順番をつけ視線誘導を意識しましょう。

④判断基準がなく「なんとなく」で決めている

多くの初心者は、明確な基準を持たずにデザインを決めています。

色は「なんとなくキレイだから」選ぶ

・フォントは「好きだから」使う
・レイアウトは「バランスが良さそう」程度の理由

この状態では、修正のたびに迷いが生じ、改善が進みません。

デザインは全てに意味があります。

なぜそのデザインにしたか説明できない状態は好ましくありません。

全ての要素、色、レイアウトをなぜその状態にしたのかしっかりと説明できるのが好ましいですよ。

ダサさを回避する考え方

デザインが上手いデザイナーは特別なツールを使っているわけではありません。

制作のたびに問題意識を持ち、デザインを言語化しているだけです。

ここでは、デザイン制作していく上で押さえておくべきポイントを4つ紹介します。

デザインが上達するる4つの考え方

デザインが上達する考え方は、

・これは誰向けか?

・何を一番伝えたいか?

・なくしても成立する要素は何か?

・なぜこの色・文字・配置なのか?

この4つになります。

どれもデザインの制作において重要な考えなのでぜひ参考にしてみてください。

①これは誰向けか?(ターゲットの明確化)

デザインの良し悪しは、ターゲット次第で変わります。

・「若年層向けか」「ビジネス向けか」「初見ユーザーか」「リピーターか」

これが定まらないと、すべての判断がブレます。

常にデザインの先にいるユーザーを意識しましょう!

②何を一番伝えたいか?(主役の設定)

目的が定まっていないデザインは必ずダサくなります。

・「高級感を出したいのか」「伝統的なデザインにしたいのか

他の要素は主役を邪魔していないか?
デザインの目的を意識して要素を組み合わせます。

③なくしても成立する要素は何か?(引き算思考)

本当に必要な要素だけを残します。

・「この装飾はなくても伝わるか」「この補足情報は本当に必要か」「この画像は意味があるか」

削れるものを削ることで、デザインは洗練されます。

④なぜこの色・文字・配置なのか?(説明責任)

プロはすべての選択に理由があります。

・「なぜこの色を選んだのか」「なぜこのフォントなのか?」「なぜこの位置に配置したのか」

説明できない選択は、ほぼ例外なく修正対象になります。

まとめ

デザインは「センス勝負」ではなく、セオリーを抑えることといかに違和感を言語化するかで決まります。

最後に制作後に必ず確認したい最小限のチェックリストを紹介したいと思います。

⬜︎ 情報は削れるか?
⬜︎ なくしても成立する要素はないか
⬜︎ 色は役割ごとに分かれているか?
⬜︎ ベース・メイン・アクセントの3色で構成されているか?
⬜︎ フォントは2~3種以内か?
⬜︎ 装飾系フォントの多用はしていないか?
⬜︎ 余白は意図して空いているか?
⬜︎ 「なんとなく」ではなく設計されているか?
⬜︎ 説明できない装飾はないか?
⬜︎ 見た目だけの影・枠・グラデはないか?

このチェックを通すだけでもデザインの質が変わってきます。

1つ1つ着実にレベルアップし自分のデザインを消化させていきましょう!!

読んでいただきありがとうございました。
また次回もよろしくお願いします!