※本ページは広告を含む場合があります。

デザイン学習【初心者】

グラフィックデザイナー初心者のNGデザイン【カラー編】

つい先日、デザイナーとして片足突っ込んだ頃に、私がデザインしたフライヤーを発見しました。

グラフィックデザイン初心者のNGデザイン例
知人に頼まれたハロウィンイベントのフライヤーです。
(表面カラー印刷/裏面白黒印刷)

当時の私はいたって真剣に作っていましたが、

なんとツッコミどころ満載のデザイン!!!

このツッコミどころ満載のデザインを、10年後の私が添削してみようと思います。

※注意※ この記事を初めて書いた時点では、デザイナー歴10年でした。

 

具体的にどういった理由でデザインがダメなのかも合わせて紹介するので、デザイン初心者の方は是非過去の私を反面教師として参考にしてください(笑)。

デザイン初心者がやりがちなNGデザイン例として、見ていただけたらと思います。

 

この記事を書いている人

4年制美大卒。デザイナー歴15年。

メーカーのインハウスデザイナーを9年経て、現在までフリーランスとして活動。
当サイト運営にあたり63社のWebデザインスクールを徹底調査しました!

 

※当記事では、オモテ面(カラー印刷)の方の添削をしています。
裏面(白黒印刷)の添削はこちらから グラフィックデザイナー初心者のNGデザイン「裏面・白黒編」

 



スポンサーリンク

 

 

グラフィックデザイナー初心者がやりがちなデザイン

グラフィックデザイン初心者のNGデザイン例
まずは、全体を通してデザイン的に「NG」な部分を挙げていきます。
(オモテ面のみ)

  1. 色を使いすぎている
  2. ごちゃごちゃ配置しすぎ
  3. 文字がまともに読めない
  4. アイキャッチ写真とイラストの世界観が合っていない
  5. 裁ち落としギリギリの位置に大事な情報を配置

「NG」な部分を、ひとつずつ解説していきますね。

 

NG① 色を使いすぎている

まず最初に目に留まる箇所は、色使いの派手さ。

青やらオレンジやらピンクやら緑やら・・・
色のバランスなんて一切無視した配色に仕上がってますね。

案の定、色が喧嘩しあい全体的にまとまりがなく、ハロウィンの世界観もぶち壊してしまっています。

 

NG② ごちゃごちゃ配置しすぎ

知人から制作を依頼された時に、この画像を使用して欲しいと、センターに配置している猫の写真をもらいました。

せっかくもらったインパクトのある面白い写真なのに、周りがごちゃごちゃしすぎて写真に目が行きません。

色も多用しているので、なおさらまとまりがなく見えてしまっています。

 

NG③ 文字がまともに読めない

フライヤーとは、イベントに来てもらうための大事な集客ツールです。

フライヤー内の文字の癖が強すぎて「いつ」「どこで」「何がある」といった大切な情報を解読するのに、時間がかかってしまっています。

文字の色使いも、読みづらさに拍車をかけています。

 

NG④ アイキャッチ写真とイラストの世界観が合っていない

猫の写真と周りに散らばっているガイコツやかぼちゃのイラストが、全然マッチしていません。

奇妙な雰囲気で行きたいのやら…可愛い路線で行きたいのやら…方向性がバラバラ。

 

NG⑤ 裁ち落としギリギリの位置に大事な情報を配置

イベント名は大切な要素のひとつなのに、配置が裁ち落とし線ギリギリ。

裁ち落とされても文句は言えない場所に配置してしまっています。

入稿データの基本的な作り方をまだよく理解していない結果ですね(苦笑)。

 

大まかに挙げると、こんなところでしょうか。

色がバラバラ、オブジェクがごちゃごちゃ。
デザイン全体の世界観もハチャメチャ(苦笑)。

その結果、非常に見づらいデザインになっています。
(ほんと良くこれで、OK出たなと思うくらい・・・)

 

「あえて、ごちゃごちゃしたデザインを狙った!」と当時の私はイメージしてデザインしたのでしょうが、あえてどころか本当にごちゃごちゃしているだけのデザインに仕上がっています。

本当に計算されたデザインはごちゃついていても、まったく見づらくなく、むしろオシャレで完成されたデザインに見えるのです。



スポンサーリンク

 

 

NGデザインを添削!デザインは読み手側の目線を持つことが大事

  1. 色を使いすぎている
  2. ごちゃごちゃ配置しすぎ
  3. 文字がまともに読めない
  4. アイキャッチ写真とイラストの世界観が合っていない
  5. 裁ち落としギリギリの位置に大事な情報を配置

デザインのNG部分を抽出しました。

続いては、具体的にどのように改善していけば、少しはマシなデザインになるかを解説しますね。

 

①「色を使いすぎている」対処法

→色数を減らす
→ハロウィンのイメージや紙面のテーマに合う配色にする

 

とにかく色数が多いので、色数を減らしてハロウィンを連想しやすい配色に変えた方が良いです。

色の使い方や配色については、こちらの記事で詳しく解説しています。

こちらもCHECK

デザイナーが色の配色の時に取り入れたいポイントとアドバイス

続きを見る

デザイナーが色の配色の時に取り入れたいポイントとアドバイス

 

 

②「ごちゃごちゃ配置しすぎ」対処法

→ガイコツなどのオブジェクトを取り払い、もらった猫の写真素材を活かす
※この猫の写真の雰囲気をそのままフライヤー全体の世界観にしても良いかも

 

デザイン初心者は「スペース」があるとつい埋めたくなりますよね。

つい色んなデザインに取り入れたくなりますよね。

その気持ちはすごく分かるのですが、必要のないものを削ることの方がもっと大事なんです。

せっかく仕上がったものを削っていくのは断腸の思いかもしれませんが、良いデザインに仕上げるには必須の作業となります。

こちらもCHECK

デザインにおける余白(スペース)の広さは「高級感」に比例する!

続きを見る

デザインにおける余白(スペース)の広さは「高級感」に比例する!

 

③「文字がまともに読めない」対処法

→文字同士が近すぎて読めないので文字間の調整
→イベント名はロゴ化して、フリガナを振る
→フォントの種類を見直す

 

読みにくい文字を使ってしまっては、伝えたいことが伝わりません。

文字間を丁寧に調整することで、可読性も上がります。

 

フォントにはそれぞれ持っているイメージがあるので、イメージを崩さないようなフォント選びをすることも大切です。

フォントの選び方や役割については、こちらの記事で書いています。

こちらもCHECK

そのフォント適切?デザイン全体の雰囲気やTPOを考えた選び方の極意

続きを見る

そのフォント適切?デザイン全体の雰囲気やTPOを考えた選び方の極意

 

▽文字をデザイン化するテクニックはこちらから▽

こちらもCHECK

文字のビジュアル化!デザインを格段に見やすくする為のテクニック

続きを見る

文字のビジュアル化!デザインを格段に見やすくする為のテクニック

 

 

④「写真とイラストの世界観が合わない」対処法

→猫の写真メインでいくか、イラストメインでいくかどちらかにする

 

写真・イラストの両方を大きく配置しているので、主張のし合いが激しいです。

結果的にミスマッチな世界観になっているので、どうゆう方向性にするのか決めてからデザインを組み直した方が良いでしょう。

 

 

⑤「裁ち落としラインを気にせず情報を配置」対処法

→裁ち落としギリギリに大事な情報を載せたオブジェクトを配置してはいけない

 

裁ち落としから7〜10mm以内に大事な情報を配置しないのはデザインの鉄則です。

(裁ち落としセーフラインは印刷会社にも寄るので、事前に確認しておきましょう。)

 

特に文字情報は切れてしまったら読めなくなるので、文字を裁ち落としラインギリギリに配置するのは厳禁です。

その他、入稿の注意事項はこちらの記事で紹介しています。

こちらもCHECK

初心者デザイナー必見!入稿データを作る時の14の注意点

続きを見る

初心者デザイナー必見!入稿データを作る時の14の注意点

 

添削後の対処法まとめ

デザインを添削して、実際にはどうすべきだったか対処法もまとめてみました。

まず一番に言えることは、このフライヤーをもらった相手が

「読みやすいか」
「情報を素早く的確に得ることができるか」

を考えること。

受け取った側のことを考えずに、デザインをしてしまっているのが、このフライヤーのダメな点ですね。

色や配色がごちゃごちゃしているから文章が読みづらいのは言うまでもありませんが、それによってハロウィン特有の世界観もぶち壊してしいます。

 

当時の私は、あれもやりたい、これもやりたいと、盛り込みすぎたのでしょう。

デザインは削っていくことも大切な工程です。

せっかく苦労して作ったものを削っていくのは断腸の思いですが、良いデザインのためには必要な作業なのです。

 



スポンサーリンク

 

 

10年越しにデザイン修正してみた

ということで、10年後の私がデザインを修正してみました。

10年前の素材は活かしたまま、色やレイアウト変更だけでの「リデザイン」になります。

※注意※ この記事を初めて書いた時点では、デザイナー歴10年でした。

 

グラフィックデザイン初心者のデザイン例を修正してみた

  • 猫の写真をメインにして、ドクロやかぼちゃのイラストをアクセントとして一箇所に採用
  • まとまりのなかった色を、ハロウインらしい配色に
  • イベント名をロゴ化して、全体的にスッキリと
  • 日時や会場名など大事な文字情報のフォントの見直し

以上のことに気をつけて、リデザインをしてみました。

「え!?10年経った今のデザインもダサい!」というご意見もあるかもしれませんが、その辺はご容赦ください(苦笑)。

10年前のデザインよりは、幾分か見やすくはなったはずです。

 

 

グラフィックデザイナー初心者に見習わなければならない点もあった!

10年前の自分のデザインにダメ出しばかりでしたが、ひとつだけ褒めておきたい部分があります。

それは、キャラクターやタイトル部分のフォントを、全部自作していることですね。

現在は「時間がない」を理由に、既存のフォントや素材を配置するだけでデザインを完成させてしまっていますが、当時の私は素材もすべて1から自分で作っていました。

初心忘れるべからず。
そんなところは見習わなければいけないなと思いました。

 

さて、次回はグラフィックデザイナー初心者のNGデザイン「裏面・白黒編」を添削します。

こちらは白黒印刷なので、その際の注意点も合わせてまとめます。

 

「NGデザイン」を添削するのは、デザインスキルの向上にはとても良い方法です。

 

良いデザイン・悪いデザインのBefore〜Afterをわかりやすく紹介しているデザイン書もあるので、こちらも参考にしてみてくださいね。

Beforeの改善点やデザイン知識が要所に盛り込まれていて、独学デザイナーには是非読んでいただきたい本です。

もちろん私も愛読書です!

 

スポンサーリンク



最大70%割引になるWebデザインスクール厳選

Webデザインスクールの受講料金が70%も安くなる裏技を知りたい方はこちらの記事へ

記事本編はこちらから

   

グラフィック・Webデザイナー向けの転職サイト8選はコレ!

グラフィックデザイナー・Webデザイナー向けのおすすめ転職サイト・転職エージェントを比較しながら詳しく解説しています!

記事本編はこちらから

   

学び方〜仕事の探し方まで!未経験からデザイナーになるための完全ガイド

デザインまったくの未経験者が、プロのデザイナーになるまでのステップを詳しく丁寧に徹底解説しています。

記事本編はこちらから

   

長時間労働?人間関係?みんながデザイナーを辞めたくなる3つの理由

「デザイナー辞めたい!」一度は考えたことありませんか? そんなデザイナーの不平・不満を調査してみました。 デザイナーのみなさんならこの苦労を分かち合えるはずです!

記事本編はこちらから

   

Webデザインを安く勉強できるオンラインスクール厳選

Webデザインを勉強したい方に向けて、価格や授業内容を比較しながら、おすすめできるオンラインスクールをまとめてご紹介しています。

記事本編はこちらから

© 2024 デザイナーの道しるべ