どうも。中学時代に美術成績2を叩き出した生粋の画伯近所です(´・ω・`)
提出期限などもしっかり守ったうえでのこの成績。
色使いとかバランスが・・・と言われたんですが、まるっきり理解できませんでしたね。
そんな私でも色を使いながらもまとまりのある・・・そんなアイキャッチ画像やバナーが作れるようになりました!
その理由は口コミ・レビューともに高評価の「配色アイデア手帖 めくって見つける新しいデザインの本」を買って参考にして作っただけ。
中学生の時に出会っていれば成績も変わっていたかもしれない。
めちゃくちゃ素晴らしすぎる・・・そんな1冊です。
この記事の目次
配色アイデア手帖ってどんな本?
デザインを学ぶ本の中でもイメージに合う配色のお手本に特化した本です。
しかしながらその情報量がとにかく凄い。
- 全部で303ぺージ
- 配色のサンプルは127パターン
- 色に関するコラム
と言うボリューム。
中身も情報がただ羅列してあるだけではなく、イメージ別に見開き1ページで見れるのでめちゃくちゃ見やすい。
- 配色のイメージやワンポイント
- 使う色のおすすめ9色
- 配色のおすすめを何種類か
- ロゴイメージ
- 背景パターンのイメージ
- サンプルイラストバナー
と、自分が考えているイメージに沿ったカラーやデザインを探し出せます。
何気に配色のワンポイントを載せてくれるのも地味に嬉しい。
使う色をどの程度配分する・・・とかを書いてくれているのでメインカラーやアクセントカラーを決める際に役立ちます。
さらに1配色イメージ毎に全て最終完成形バナーのサンプルも載っていてバランスなども参考になります。
ただし、あくまでも【配色】の参考資料ですので、配置やロゴの作成などは自分で考える必要があります。
ブロガーにはめちゃ嬉しい「色コード付き」
爽やかなイメージには〇〇と△△と□□がおすすめ!
と書いてあっても、サイト作りで困るのが
・・・その色ってどのコード?
mediumseagreen(ミディアムシーグリーン)って書かれても
いや、だからそれどんな色やねん・・・
となりますよね・・・。
ところがこの本には色コードが入っていますのでmediumseagreen(#3cb371)と簡単に色が選択できます。
色コードが載っているので見たままコードを打つだけ!
これはめっちゃ助かります!!
似たような色がいっぱいありますので本の配色と完璧に同じ色を使えるのは嬉しいですね!
例えば【ありがとう】の雰囲気にしたいのであれば使う色は以下の9色を使うのがおすすめだそうです。
- Thank you(ありがとう) #f4b095
- I Trust you(信頼しています) #cdd866
- I Respect you(尊敬しています )#b3c399
- I Love you(愛しています) #f7c8d6
- I Take care of you(大切にしています) #dabeda
- Peace of Mind(安心) #f6e27a
- Be Honest(素直) #fff4d6
- Love(愛) #d36899
- Knot(絆) #7b5a99
使われているカラー名が色名ではなく、その色が持つイメージなので全部見よう見まねで近づけてたら恐ろしい時間と労力ですからね・・・。
配色アイデア手帖を基にアイキャッチを作ってみる
やっぱりどのぐらいレベルアップしてるのか・・・パッと見て分かるように比較をしたいってのが人情です。
そこで「本を読む前」と「読んだ後」でアイキャッチがどう変わるかを見てもらおうと思います。
また比較しやすいようにするために以下の条件を設定しました。
- この記事のアイキャッチを作る(650×366)
- イメージはポジティブ
- 本を読む前に1個、読んだ後に1個作る。
- 写真使用はNG。フリー画像・テキスト・塗りつぶしのみ使用
- 先に作ったデザインを極力崩さない
- 使うのはCanvaのみ(有料アイコンは使用可だが透かし解除しない)。
ちなみにCanvaは基本無料で画像やイラストを作れるサイトです。
一部有料ですが無料で使えるテンプレートもあり、サイズなども決めれますので今回のようなデザインをしてみたいという方は是非。
と言う事で・・・
2時間ほど頑張ったアイキャッチがこちら
これでも悪くはないんですが、良くあるベースカラー+モノトーンしか使えない(使わない)という素人感・・・。
続いて・・・
本を読んで作ったアイキャッチ
どうでしょう・・・?
元のデザインを踏襲する縛りをしたのでちょっと微妙な感じですが、色を多く使ってもまとまりある雰囲気になっているかと思います。
縛りを解き放てばもう少しマシなデザインを作れる気がする・・・!
変な自信が出てきたのでまっさらからデザインを作ってみよう!!
配色アイデア手帖を基に0から作る
アイキャッチ比較は元のデザインがちょっとアレなので、微妙な雰囲気になってしまい本の力をお見せ出来ていないと感じました。
と言う事で真価を発揮すべく0から作ってみましょう。
先ほど色使い例【ありがとうの9色】を使ってのデザインにチャレンジ!
使う素材などはデザイン手帖を参考にしていますが0から考えて配置しました。
いかがでしょうか?
美術の成績2を叩き出したヤツとは思えない色使いとデザインではないでしょうか!?(自画自賛)
上の画像も先ほど作ったアイキャッチと同じく、【Canvaで無料素材のみ】と言う条件。
数をこなせばもっと早く色々な画像を生み出せそう。
配色アイデア手帖はガチでおすすめの1冊!
アイキャッチの自作などはどうしても後回しにしがちですが、しっかりこだわって作るとブログを見た時の印象が大きく違います!
何より一目見て何が書かれているかが分かるので見に来た人も巡回してもらいやすくなりますね!
さすがに毎回0からデザインするのは骨が折れるので頻発はしませんが、写真+文字のアイキャッチは作っていく方向です。
あと何よりもこのブログのLPで使っている説明バナー・・・割とひどいことになってます(フリー画像に文字入れただけ)。
もう一つのブログのヘッダーも自分で作れそうなので時間をかけて作っていきたいと思います!
今回はブログのアイキャッチやパソコンでのデザインに重点を置いていますが、アクセサリーを作っている方や、仕事でデザインを作る方にも配色の参考に役立ちますね。
1冊1,780円(税抜)と買いやすい値段なので手にしてみて欲しい1冊です!
以上、配色アイデア手帖をレビュー!美術成績2の私でもデザインできた!!でした。