WEB業界で働く人や興味がある人に役立つ情報サイト“qam(カム)”

スーザン

2018/04/11

知らないと損をする!本当に便利なPhotoshopの小技

投稿者: スーザン
カテゴリー: デザイン >Photoshop

日々Photoshopを使用していて、本当に便利だと実感した小技をご紹介したいと思います。これを使うことによって手間も省け、かなりの時間短縮に!

Photoshopの「検索・置換」機能を使って一括置換!

この表記を別の表記に変更したいという修正。デザインの段階でもよくあると思います。
上から下まで、一文字一文字確認しながら修正をしていくのは時間もかかるし、見落とす可能性も・・・
そんな時に使用したい、Photoshopの「検索・置換」機能をご紹介したいと思います。

【今回は「Web」(黄色下線)表記を「WEB」表記に一括で置換をします。】

1)Photoshopのメニューバーから「編集」>「検索と置換」をクリック。


2)「検索と置換」パネルが出てくるので、検索文字列に「変更前の文字(Web)」、置換文字列に「変更後の文字(WEB)」を入れます。必要なチェックボックスにはチェックを。

今回、水色下線文字「web」はそのままにしておきたいので、置換しないように「大文字と小文字を区別」(赤枠部分)にチェックを入れておきます。
※「すべてのレイヤーを検索」にチェックを入れておくと、別レイヤーに同じ文字が使われていても一緒に置換してくれるので便利です!

3)書き換え該当箇所は6箇所でした。こちらの表示がでてきたら「OK」を押します。

すると一瞬で黄色下線の文字だけ「Web」→「WEB」に変換されました!


WEBサイトやデスクトップからそのままカラーを取得しよう!

デザインの中で使用されている色であれば、スポイトツールを使って簡単に真似ることが出来るのは知っている方がほとんどだと思いますが、この小技を用いれば今開いているWEBサイトやデスクトップ上にある色をそのままPhotoshop上に持ってくることが出来るのです。今回はグレーのシェイプをWEBサイトで使用されているオレンジ色に変更したいと思います。


1)カラー変更したいシェイプをダブルクリックし、カラーパネルが出ている状態にします。

2)カーソルがスポイトツールに変更されるので、その状態でカンバス内のどこか適当な場所を右クリックします。

3)右クリックを離さず押した状態のまま、欲しいカラーの場所まで(WEBサイト上のオレンジ色部分)カーソルをもっていきます。該当箇所の上にカーソルがきたら右クリックを離します。



4)右クリックを離すとグレーのシェイプがサイトと同じオレンジ色に早変わりです。

まとめ

元々の機能を使用したり、ちょっとしたやり方の工夫で時間短縮につながり、さらにミスも少なくなって一石二鳥の小技です。
カラーの取得は、キャプチャ画像やWEBツールを使わなくても変更が出来るなんてとっても楽チンです。
まだ使ったことない方は、ぜひ今日から使ってみてくださいね。

最後までお読みいただき、ありがとうございました。
よろしければシェアしていただければ幸いです。

  • このエントリーをはてなブックマークに追加

関連記事

よろしければこちらの記事もお読みください。

WEB業界ならqam!qam(カム)はWEB業界で働く人や興味がある人に役立つ情報サイトです。
マーケティングやデザイン、マークアップ(コーディング)、プログラム、トレンドなどの情報をqamライター陣が執筆。噛めば噛むほど(読めば読むほど)制作・開発や運営・運用、業界知識やノウハウを学ぶことができます。

トップへ