
Webデザイン初心者でもうまくいく!Photoshopで画像を切り抜く方法
この記事は、2015年9月2日に公開された記事を再編集しています。
Webデザイン初心者、もしくはデザイナーではないけど画像制作をやられてるような方は、画像の一部分だけを使いたい時、どのような処理をされているでしょうか。
Adobe Photoshopを利用して切り抜きするのが一般的だと思いますが、様々な切り抜き方法が搭載されており、初心者には少しわかりづらいかもしれません。
今回は、Webデザイン初心者でも簡単に行えるPhotoshopを使った画像の切り抜き方法をご紹介します。
Photoshopで切り抜きを行いたいのであれば以下の2つの機能を活用する
Photoshopでは、「切り抜きツール」と「自動選択ツール」のいずれかを使うと、簡単に切り抜きを行えます。
以下より、それぞれのツールの使い方をご紹介します。自分に合う方を選択しましょう。
切り抜きツールを使用する
1.Photoshopのアイコン「切り抜きツール」を選択します。
2.選択後、 上部にある「幅×高さ×解析度」の項目に必要な数値を入力し「enter」キーを押します。
項目の設定がなくても、「Shift +alt」キーの両押しで切り取りたい幅の調整ができるので、便利です。
3.必要な箇所だけ切り取った後、ツールメニューから「WEB用に保存」を選択し、jpgやpng形式で書き出したら完了です。
自動選択ツールを使用する
1.Photoshopの「背景レイヤー」をダブルクリックして、「レイヤー」状態にします。
(背景状態で自動選択ツールを使用しても、切り抜きが出来ないので要注意です)
2.ツール上にある「自動選択ツール」を選択します。
3.選択後、上部の選択ツールの範囲や調整を決めます。
4.レイヤーの上から、切り取りたい部分を選択しましょう。
(選択状態中はカーソルを離さないでください。選択範囲をやり直したいときは「altキー」を押しながらドラッグします。)
5.「shiftキー」を押しながら、画像内で複数選択も可能です。
6.「マスクツール」を選択します。先ほど画像を選択した部分が赤く表示されます。
自動選択ツールで切り取りたい部分が選択されていなかったり、逆に切り取りすぎた場合は「ブラシツール」を使って範囲の微調整をかけましょう。
(ブラシツールの「塗り」や「消しゴムツール」で余分箇所を消すことも可能です。)
8.マスクツールで微調整が終わったら、マスクを解除します。
ツールの「選択範囲」から「選択範囲を反転」を選択すると不要な箇所のみ選択できるので、「delete(消去)」ボタンを押します。
9.切り取れたら選択を解除し(ctrl+D)で完了です。(この段階で選択した画像の境界線の調整もできます。)
ツール紹介記事
カテゴリから記事をさがす
Web マーケティング
- SEO(検索エンジン最適化)
- SNSマーケティング
- アプリマーケティング
- Web広告
- グロースハック
- ABテスト・EFO・CRO
- LP制作・LPO
- CMS・サイト制作
- 記事制作・ライティング
- コンテンツマーケティング
- メールマーケティング
- マーケティングオートメーション(MA)
- リードジェネレーション
- カスタマーサポート・カスタマーサクセス
- アクセス解析・広告効果測定
- データ解析・BI
- リサーチ・市場調査
- 口コミ分析・ソーシャルリスニング
- O2O・OMO
- EC・通販・ネットショップ
- 多言語・翻訳
- 動画・映像制作
- AR・VR制作
- マーケティングお役立ちレポート
- Web接客・チャットボット
- Web会議
- 動画マーケティング
- フォーム作成
- CRM(顧客管理)
- ABM
その他のカテゴリ
