写真を使ったクールなデザインの作り方!白黒写真に+1色を加えます。

モノクロ写真に+1色で超クール

こんにちは、読むだけでデザインを学べる!デザイン研究所です!

デザイン特化のメディアでは国内最大級のTwitterインスタグラムを運営しています。

今日のテーマ:白黒写真+1色

白黒写真+1色のデザインは、写真を使ったクールなデザインを作りたい時にもってこいのデザインです。この記事ではイラレとフォトショでそれぞれ白黒にする方法を解説。

またサンプルデザインも2つ用意しているのでイメージしやすいかと思います!ぜひ最後まで記事をご覧ください。

 

 この記事で得られること
 フォトショップとイラストレーターでそれぞれ白黒写真にする方法を学べる!

 白黒写真+1色のデザインを知ることができる!

 

配色デザインのまとめ記事を作りました。こちらの記事も含まれています。ぜひご覧ください!

関連記事

こんにちは、読むだけでデザインを学べる!デザイン研究所です!デザイン特化のメディアでは国内最大級のTwitterとインスタグラムを運営しています。デザインを作る上で色について迷うこと多いですよね。。。今回の記[…]

白黒写真に+1色でクールなデザインを作れます!

白黒写真に+1色でクールなデザインを作れます!

こちらが今回のデザインサンプルです。

モノクロ写真+1色(黄色)を使ったデザインとなっています!

モノクロ写真は色がないためにどんなデザインにも合いやすくはあるのですがどうしてもさびしい雰囲気になってしまいます。

それをクールに変えるには1色を加えてあげることです!

今回のデザインサンプルでは白黒写真の、、、

  1. 左の写真の目に四角い黄色
  2. 右のタイトルにも四角い黄色
  3. 文章の強調部分に黄色
  4. 英字のi (eye) を黄色

このように黄色の一色使いを繰り返しています。

白黒写真+黄色、随所に黄色を散りばめる

今回のデザインサンプルでは黄色を使いました。

モノクロ写真の上や文字の色をこのような+1色加えることで寂しいというよりスタイリッシュなクールなデザインになります。

ちなみに過去を回想させるポイントとして白黒写真を使うことがあります。これは過去投稿115で紹介してます。

関連記事

こんにちは、読むだけでデザインを学べる!デザイン研究所です!フォローするだけでデザインを学べるTwitterアカウントと毎日デザインのポイントを解説するインスタアカウントを運営しております。こちらのブログはインス[…]

 

サンプルデザインで使用した写真は元々はカラー写真でした。それを白黒にしたのですがやり方は簡単です!実はイラレでもできるのでその方法も紹介します。

白黒写真の加工はイラレでもできる

 

Photoshop(フォトショップ)でカラー写真を白黒にする方法

フォトショを使い、レイヤーパネル下の調節レイヤー(モンスターボールみたいなマーク)をクリック、白黒を選ぶのみです。

Photoshop(フォトショップ)でカラー写真を白黒にする方法

ただこの方法だとそのレイヤーより下全てが白黒になってしまうのでクリッピングマスク(フォトショでは2つのレイヤーの間でoption押しながらクリック)すると写真だけ白黒になります!

 

Illustrator(イラストレーター)でカラー写真を白黒にする方法

写真の加工ですが、イラレでも過去にツイートしたこの方法でいけます。

 

ちなみに黄色という色は有彩色の中で最も明るい色ですので黒にかなり映える色になります。

過去投稿014では黄色について記事を書いてますので気になる方はご覧ください!

関連記事

こんにちは、読むだけでデザインを学べる!デザイン研究所です!フォローするだけでデザインを学べるTwitterアカウントと毎日デザインのポイントを解説するインスタアカウントを運営しております。こちらのブログはインス[…]

 

イラレの長方形のショートカットキーは?▼
イラレではMになります!

 

モノクロ写真にプラス1色してクールなデザインを!

カラー写真をモノクロにする方法さえ覚えれば誰でも簡単にできます。

 

デザ研
次章では白黒写真を使った別のデザインも紹介!

 

 

超クール!写真を使ったデザインにとてもおすすめのデザイン

白黒写真+1色は超クール

こちらのデザインでもモノクロ写真に+1色を加えたデザインを作ってみました。

やっぱクールですよね??笑

白黒写真を使うこと自体がクールなデザインを作る時に使う手法です。

それと+1色であることで必然的にシンプルになるのでクールになりやすいということです!

ちなみに写真の上に配置している青の図形は描画モードを変更しています。この描画モードもクールになる一つの要素ですね。

関連記事

こんにちは、読むだけでデザインを学べる!デザイン研究所です!毎日デザインのポイントを解説するインスタアカウントを運営しております。こちらのブログはインスタ投稿をより深く解説した記事になります!今日のテーマ:描画モ[…]

 

ちなみに過去記事で紹介していますが白黒写真にもパターンがあるのでおまけでそれを紹介していきます。

  1. 一部残して他を白黒にする
  2. 写真の一部を白黒にする

 

一部を残して他を白黒にする方法は、今回のモノクロ写真に+1色にもつながる写真加工になります!

今回の記事と違う点は、写真それ自体の1色を残して白黒にする点です!

主役になる写真背景、一色残して他白黒

関連記事

こんにちは、読むだけでデザインを学べる!デザイン研究所です!フォローするだけでデザインを学べるTwitterアカウントと毎日デザインのポイントを解説するインスタアカウントを運営しております。こちらのブログはインス[…]

 

またこちらのデザインでは写真の一部分だけ白黒にする方法です。そうすることで色々と意味を与えることもできます!

色がないことの可能性は無限大

もしかしたらこちらの画像の方がイメージしやすいかもしれません。

写真の一部分を白黒にしてみる

やり方も前章でお伝えした方法の応用で可能です!ソフトはフォトショップを使います。

関連記事

こんにちは、読むだけでデザインを学べる!デザイン研究所です!フォローするだけでデザインを学べるTwitterアカウントと毎日デザインのポイントを解説するインスタアカウントを運営しております。こちらのブログはインス[…]

 

白黒写真と1色でシンプルなデザインに!

シンプルというのはクールにつながりやすい表現ですね。

 

もっと白黒写真+1色のポイントを使ったデザインが見たい方!

この記事で解説した白黒写真+1色のデザインをもっと見たい方は、、、

デザイン研究所が運営する学べるギャラリーサイト「managary」へどうぞ!

もっと白黒写真+1色のポイントを使ったデザインが見たい方!

 

デザ研
クリックすると白黒写真+1色を使ったデザイン”だけ”が表示されます!

写真を使ったクールなデザインの作り方!モノクロ写真に+1色を加えます。まとめ

いかがでしたでしょうか?写真をモノクロにする方法と、+1色を加える方法を解説していきました。

また白黒写真のパターンも紹介できました!写真を使ったクールなデザインを作りたい!ってときはぜひ使ってみてください。

 

ちなみに多くの色についてのデザイン参考書も読んだことがありますが、

今回の記事のようなデザインの色について書籍で学びたいのなら「配色デザイン良質見本帳」がおすすめです!(なぜならこの本は実例+解説付きだからです)

他の配色デザインの本はただカラーのパターンが載ってるだけのものが多く、実例のデザインや解説がないのです!

 

こちらの記事はクールなデザインまとめ記事にも含まれています!

関連記事

こんにちは、読むだけでデザインを学べる!デザイン研究所です!デザイン特化のメディアでは国内最大級のTwitterとインスタグラムを運営しています。 今回の記事ではそんなデザインをクールにするテクニッ[…]

・半透明の図形を重ねて文字の可読性を上げる!
・白黒写真と1色に!

 

 

この投稿をInstagramで見る

 

デザイン研究所(デザ研)ほぼ毎日投稿(@designkenkyujo)がシェアした投稿

広告
>インスタでデザインを学ぶ

インスタでデザインを学ぶ

デザインの見る目を養うインスタアカウントを運営中!初心者から脱するデザインのポイントを解説しています。だいたい毎日更新です!

CTR IMG