Photoshopのフレームツールで画像をマスクするメリットとデメリット

Photoshopのフレームツールで画像をマスクするメリットとデメリット

2020年10月27日
Webデザイン

Photoshopのフレームツールとは画像をマスクする機能です。
長方形や円形に画像をマスクできます。

画像をマスクする方法は他にもレイヤーマスク、ベクトルマスク、クリッピングマスクなどがあります。
個人的にはクリッピングマスクを使うことが多いです。

フレームツールは2018年のアップデートで追加された新しい機能です。
すでにクリッピングマスクなど画像をマスクする手段は豊富にあるのに、あえてフレームツールを使うメリットはあるのでしょうか?
現役Webデザイナーの僕が、フレームツールを使ってみて感じたメリットとデメリットをご紹介します。

フレームツールで画像をマスクするメリット

まずはフレームツールで画像をマスクするメリットからご紹介します。

ドラッグ&ドロップで画像を配置できる

フレームツールはクリッピングマスクなどと比べて、画像をマスクするのがとても簡単です。

まずフレームツールで長方形や円形のフレームを作成します。
そして、作成したフレーム内に画像をドラッグ&ドロップするだけで画像をマスクできます。
PC内の画像だけではなくCCライブラリの画像もドラッグ&ドロップで配置可能です。

この操作感はXDのオブジェクトで画像をマスクするのに似ています。
XDの良い所をPhotoshopに取り入れた感じですね。

マスクした画像が自動的にスマートオブジェクトになる

直しに強いデータを作るために画像をスマートオブジェクトにしている方は多いと思います。
僕も画像は必ずスマートオブジェクトに変換しています。

フレームツールはマスクした画像が自動的にスマートオブジェクトに変換されます。
画像をスマートオブジェクトに変換しておけば、直しに強いだけではなく、レスポンシブWebデザイン用の画像を書き出す際も非常に便利です。
この辺の仕様は流石に新しく実装された機能だなと思いました。

クリッピングマスクなどは、手動でスマートオブジェクトにしないといけないので少々手間が掛かります。

フレームの境界線がサイズや位置の基準になる

フレームツールでマスクした画像は、フレームの境界線がサイズや位置の基準になります。
つまりマスクした画像を1つのシェイプの様に扱うことができます。

この仕様は大変素晴らしく、マスクした画像を特定のサイズに変更したい場合や、他のシェイプなどと整列させたい場合にとても便利です。
Illustratorのクリッピングマスクに近いイメージです。

レイヤーマスクなどでマスクした画像は、元画像の境界線がサイズや位置の基準になってしまうので、サイズ変更や整列が大変でした。
フレームツールはWebデザインを意識した機能だと思います。

マスクで隠れた部分を選択しない様になっている

フレームツールでマスクした場合、マスクで隠れた部分は移動ツールなどで選択できない様になっています。
この仕様により誤ってマスクした画像を選択することがなくなります。

クリッピングマスクなどで画像をマスクした場合、マスクで隠れた部分も移動ツールで選択できます。
他のオブジェクトを選択するつもりが、誤ってマスクした画像も選択してしまい、そのまま一緒に移動してしまうなどの誤操作を招く場合があります。

実は僕もこの誤操作をよくやらかします。
また、マスクした画像が一緒に選択されるのが煩わしい時も多々あります。
フレームツールでマスクしておけば、この様なことは起きないので安心です。

フレームツールで画像をマスクするデメリット

次にフレームツールで画像をマスクした場合に感じたデメリットを紹介します。

フレームにレイヤースタイルを適用できない

フレームツールでマスクした画像にレイヤースタイルを適用すると、フレーム内の画像にスタイルが適用されます。
カラーオーバーレイなどのスタイルであれば問題ありませんが、ドロップシャドウなどはフレームの境界線に適用されないので、一見何も適用されていない様に見えます。

ただし、フレームでマスクした画像をグループ化し、グループにレイヤースタイルを適用すると、フレームの境界線にドロップシャドウを掛けることは出来ます。

対処法はあるとはいえ、フレーム内の画像にドロップシャドウを掛けることは無いと思うので、ここはぜひ改善して欲しいです。

画像を1枚だけしかマスクできない

フレームツールでマスクできる画像は1枚のみです。
バナーなどを作成する場合、複数の画像を一緒にマスクしたい場合もありますが、その様な使い方は出来ません。

現時点では、フレームツールはあくまで1枚の画像をマスクするといった機能です。
バナー制作などには今まで通りクリッピングマスクを使う様にしています。
少しわがままかもしれませんが、今後のアップデートで複数の画像をマスクできる様になると嬉しいです。

Photoshopのフレームツールで画像をマスクするメリットとデメリットのまとめ

Photoshopにはレイヤーマスク、ベクトルマスク、クリッピングマスクなど、画像をマスクできる機能が豊富にありますが、1枚の画像をマスクするだけならフレームツールが最強だと思います。

マスクする方法も簡単で、フレームの境界線がサイズや位置の基準になるので、マスクした画像の拡大縮小や整列がとても楽です。

ただし、フレームツールは1枚の画像しかマスクできないので、バナー制作など複数の画像をマスクしたい場合はクリッピングマスクなどを使う必要があります。

以上、Photoshopのフレームツールで画像をマスクするメリットとデメリットの紹介でした。