マーカーネット株式会社

WEB制作ブログ WEBデザイン、HTMLコーディング、PHP、スマートフォン制作などWEB制作全般に役立つ情報を発信していきます。

WEBデザイン WEB制作

【Photoshop マジック】ビンテージ風の素材がさくさくカンタンに作れちゃう!

投稿日:2014年9月19日 更新日:

Webデザインのトレンド手法のひとつとして、「レトロ感」や「ヴィンテージ感」のあるwebデザインがよく見かけます。
素材がなくても、Phoshopを使えば普通の写真もステキな素材になります!
ここで写真をビンテージ風に加工する手順をご紹介します。

STEP.1
加工したい写真をPhotoshopで配置して、ツールバーの「イメージ」→「モード」→「グレースケール]の流れで写真をモノクロに変換します。
step1

STEP.2
背景レイヤーにベクトルマスクを追加して、黒く塗りつぶします。

STEP.3
背景レイヤーの上に新規レイヤーを作成します。
そして左側のツールバーからグラデーションツールを選択して、グラデーションエディターのウィンドウで希望の色を設定します。
グラデーションの調整を終えたら、グラデーションツールで新規レイヤーを塗りつぶします。
3
4

STEP4.
レイヤーパレットの描画モードを「ソフトライト」に変更すると、セピア調の写真になりました。
5
6

STEP5.
さらに背景の上にコピーなどチャッチコピーを配置したら、クラシックな雰囲気のあるビンテージ風の素材が完成しました。
IMG_1936
最初の写真と比べると違いがよく分かりますね。
IMG_1936_n

また、グラデーションの色を変えるだけで、また違う雰囲気を表現できます。
IMG_1936_2
ぜひいろいろ試してみてはいかがでしょうか?

-WEBデザイン, WEB制作

執筆者:


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

関連記事

【デザイナーをお助け!】○○に特化したフリー素材サイト5選

【デザイナーをお助け!】○○に特化したフリー素材サイト5選

なるべく早く作ってほしい!! 今週末までに提出お願い!! ・・・・・・ヤバイ、時間がない。 こんな急ぎの依頼が来たときに、デザイナーさんの手助けをしてくれる素材サイト。 今回は、特定のジャンルに特化し …

制作部隊に仕事を依頼するときに最低限必要な5つのこと。

制作部隊に仕事を依頼するときに最低限必要な5つのこと。 こんにちは。WEBデザイナーのKです。 本日はWEBデザイナーやプログラマーなど制作関係の方に、仕事を依頼するときに、 最低限抑えておかなければ …

レスポンシブにも対応!③ フリックスライダーを作成してみました。

レスポンシブにも対応!③ フリックスライダーを作成してみました。

今回はレスポンシブに対応できるスライドショーを作成してみたいと思います。 ただ、レスポンシブに対応しているだけでなく、 スマホに便利なフリックも可能なものをご紹介致します。 前回までの関連記事です。 …

【コーダーには常識!?】あなたのコーディングをチェック!

【コーダーには常識!?】あなたのコーディングをチェック!

コーディングをしたけど、エラーや間違いがないか不安に感じたりしませんか? リンク切れやソースの間違いなどを一つ一つ調べていくのは大変です。 そこで、コーディングエラー、リンク切れなどを調べてくれるお勧 …

え、うそ、なんか今っぽい。

え、うそ、なんか今っぽい。Photoshopで写真をDuo Toneにする方法 http://www.markernet.co.jp/blog/2015/09/02/post-6033/ Facebo …