「キャンバスをクリップ」が超便利-Affinity Photo
も・く・じ
ここではAffinity Photoの数ある機能の中から主にブログサイトや商品・サービス紹介サイトでの利用を前提としたweb用画像の作成・加工についての使い方をご紹介します。
(記事中の画像もAffinity Photoで作成してます)
このページは知ってればより効率アップのTips系記事になります。
Affinity Photoの基本的な使い方はこちらにまとめてあります。
画像加工ソフトのFireworksで何が便利だったかというと、いくつかの画像を配置したあとぴったりの枠内に収める「カンバスを合わせる」機能でした。
「カンバスを合わせる」は必須機能だった
たとえばこんなふうに2枚の画像を配置したとします。
ここから枠内にぴったり収めるよう切り抜きをやる場合、Fireworksなら「カンバスを合わせる」ボタンをクリックするだけで一瞬で下のような切り抜きが完了します。
私としてはもしもAffinity Photoに同じような機能がなければAffinity Photoは購入しない、そのくらい使いまくってる機能でした。
そしてほぼ同等の機能と思われたのがAffinity Photoでは「キャンバスをクリップ」だったんです。
「キャンバスをクリップ」の使い方
通常、画像を編集・加工したあとは切り抜きツールで最終的な描画サイズを決めることでしょう。
これが最初から描画サイズが決まっていてそこにきっちり画像をはめていくやり方なら切り抜きもカンタンです。
微調整で済みますから。
しかしながらキャンバス内で自由に編集・加工しつつ最後に出力サイズを決めるようなやり方の場合は切り抜きも微調整だけでは済まなくなるときがあります。
たとえば先ほどの画像を使って切り抜きをやってみます。
切り抜きツールをクリックすると下の画像のように格子窓が出るので、周囲に散らばるポイントをドラッグしながら切り抜きサイズを決めていきます。
このとき面倒なのが余白を出さずに表示画像ギリギリのところで切り抜く作業。
画像の縁に切り抜き線を合わせる作業がけっこう面倒なんです。
しかしここで「キャンバスをクリップ」をポチットやると、切り抜きをやらずとも一瞬で表示領域ぴったりに切り抜いてくれます。
メニューの【ドキュメント】→【キャンバスをクリップ】のすぐ下には【キャンバスのクリップを解除】というのがあります。
「キャンバスのクリップを解除」は”キャンバス内に収まらない”つまりキャンバスサイズを超える画像があった場合、その画像が全部見えるサイズまでキャンバスを広げてくれる機能です。
しかしながら例えば最初から横幅700px以内で収めると決め打ちでキャンバスを作成している場合、横幅が700px以上の画像を読み込んで「キャンバスのクリップを解除」を行うとキャンバスサイズが画像の大きさに合わせて700pxを超えて広がってしまいます。
これでは700pxでキャンバスを作成した意味がなくなるので使い方には注意が必要です。
(最終的には700pxまでキャンバスを縮める作業が待ってる...)
「キャンバスをクリップ」の予想外の弱点
とっても使い勝手のいい「キャンバスをクリップ」なんですが、(予想外だった)デメリットもあります。
画像がボケる(時がある)
「キャンバスをクリップ」をかけるとまれにですがxとyの座標が少数になることがあります。
そうなるとどうなるか…画像がボケるんです。
Affinity Photoの紹介記事を書いてる最中にその現象にたまたま出くわしたのでそれをサンプルにご説明します。
コチラ↓、大方の画像配置を終えた時点のキャプチャ画像です。
そしてコチラ↓が「キャンバスをクリップ」を実行した後のキャプチャ画像です。
この時点で”キャンバスのサイズ”が少数表示になってるのが気になりますね。(なんで?)
ここで「キャンバスをクリップ」の実行前と後を見較べてみます。
右側の「キャンバスをクリップ」を実行した方の画像がほんのちょっとボケてるのがわかるでしょうか。
(JPEG画像での圧縮出力なのでちょっとわかりにくいかも)
それではぐ~んと拡大して同ポジでの比較画面にしてみます。
今度はわかるんじゃないかと思いますが。
(スライダーをドラッグしてみてください)
さらに座標込みのキャプチャ画像もご覧ください。
「キャンバスをクリップ」を実行する前は整数だったのに実行後は少数になってます。
結局、これがボケる原因だったんです。
なんでこうなるかは…(いろいろ調べたんですけど)アルゴリズムはわかっておりません
※画像のボケについてはコチラ↓が詳しいです。
画像がボケるのは小数点が原因…詳細はコチラ

上の画像例だとボケ具合は少々かもしれませんが、商品画像といったクリアに見せたい場面では致命的にもなりかねませんぜ。
特定の処理を行うと必ず少数になる
冒頭で紹介した画像ですが、ある処理をかけると「キャンバスをクリップ」後にx,yの座標が必ず少数表示になってしまいます。
それが「アンシャープマスク」というフィルター処理。
たとえば0.5pxでアンシャープマスクをかけた場合、「キャンバスをクリップ」後の画像のxおよびy座表が本来なら(0,0)になるところが(0.5,0.5)になってしまいます。
つまりはキャンバスの境界線ぴったりにくっつかなくなるってことです。
(※すき間発生)
拡大してみると周囲が1pxほどのアンチエイリアスをかけたような雰囲気になっています。
これを解消するには座標を(0,0)にするだけ。
でも毎回それをやるのはさすがに面倒です。
今のところ「アンシャープマスク」でしかこの現象は発見してませんが、いずれにしても『アンシャープマスクは最後の最後にやるもの』と教えられてきたのを忠実に守るのであれば、今後は出力直前に「アンシャープネス」をかけるクセをつけるしかないですね。
そうはいっても厳密な配置が求められる印刷仕事なら別ですが、ウェブで紹介する画像程度なら実際のところは大したトラブルでもないので無視していいレベルと言えなくもありません。
一応こんな症状もあるということで。
【Affinity Photo ver.1.9.2で検証済】
記事はお役にたてましたか?
記事に興味をもっていただけたらソーシャルボタンでの共有お願いします^^
↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓