商品写真を切り抜くならCANVA - Webデザイン・プログラミングオンライン個別指導のAkros

「画像切り抜き」今昔

「綺麗に画像を切り抜くならIllustratorを使いペンツールでクリッピングマスクじゃないの？」と思ったあなたは15年遅れています。
「画像切り抜きならphotoshopの「選択とマスク」機能じゃないの？
と思ったあなたは、1年６ヶ月遅れています。2020年6月に実装された「被写体を選択」機能を使うと、とても切り抜きにくいアフロヘアーの人物などでも難なく切り抜けてしまいます。

photoshopの苦手な切り抜きとは

photoshopはとても進化し、申し分のない切り抜きができ切り抜いた商品や人物を別の背景に持っていっても違和感なく自然な画像が作れるようになりました。しかしながら、photoshopの自動処理機能は色の差分を検出して境目を設定する機能なので、例えばガラスなどの透明な製品を入り抜くのはとても難しいことに変わりありません。白いテーブルに置かれた透明な色のないカットグラスやダイヤの散りばめられたアクセサリーの切り抜きはphotoshopの機能を使用しても中々うまくいきません。

CANVAがphotoshopにできないことをやる？！

そんなphotoshopの苦手分野を補ってくれるのがCANVAなのです。ダイヤのブレスレッドが白いテーブルに置かれている画像をphotoshopで切り抜いてみましょう。

「被写体を選択」機能を使いブレスレッド切り抜いたら、「選択とマスク」機能を使って切り抜きの境界線の調整をします。白い被写体の場合背景色を黒に設定するとより、しっかりとした切り抜きが調整できます。

アウトラインは「選択とマスク」機能の「エッジの検出」や「エッジのシフト」機能を使えば、他の背景に持ってきた時もまるで1枚画像に見えるほど自然な切り抜きに調整する事ができます。
物体が網目状になっていたり、輪郭が細かく入り組んでいても「選択とマスク」ダイヤログの左にあるツールバーの「境界線ブラシツール」背景画違う色の場合はとても精巧に切り抜くことができます。
しかしながら、色味が切り抜くし車体と全く同一の色だった場合は自動調整がほとんど不可能で、手動のペンツールで丹念に消していくしかないのです。

CANVAの切り抜き機能とは？

CANVAの場合は、切り抜きに調整機能はなく「背景リムーバー」という機能ボタンを押すことしかできません。自分でスペックのゲージを動かし細かい調整をしたい調整をしたいところですが全くできません。

「背景リムーブ」の処理後はこの様に背景が切り抜かれ、白バックになります。これをPNG形式でダウンロードすると透過ピングが出来上がります。

photoshop vs CANVA切り抜き対決

さて、photoshopの苦手とする透明なものを白バック背景で撮った場合の切り抜きをCANVAの「背景リムーブ」の自動処理のみで切り抜いたものと比べてみましょう。

背景を黒バックにしてみると一目瞭然です。CANVAの方は、細かく入った透かし部分もしっかり切り抜いているのがわかりますね。しかも、人間の微調整を全くしない「背景リムーブ」１クリックの処理がこの出来です。驚くべき機能ですね！

CANVAというWEBサービス

そんな訳でCANVA「ああ、あの劣化photoshopね」とおっしゃる方にも全く初耳の方にも知っておいてもらいたいサービスなのです。
そういう田中自身も、CANVAの存在は去年の4月ごろ、コーディングやプログラミングは得意だがデザインは苦手である美容皮膚科医の受講生から教えてもらいました。彼女は外注するととても高くつくLP（1ページものの広告サイト）をご自分で制作されたくてAkrosで受講している方です。彼女はXDを使ってサイト構成を学んでいましたが、photoshopでの画像加工に手こずっていました。ある日彼女が「先生！とっても簡単な画像制作ツール見つけました！」と言ってCANVAを紹介してくれたのです。彼女が紹介してくれた時には、使用できるイメージ素材が充実していて、デザインテンプレートがそこそこかっこいい、かなり良いサービスだとは思いましたが、プロ仕様に耐えられるものだとは、正直思っていませんでした。

簡単にプロ並みの画像が作れる無料サービス！

簡単にプロ並みのレイアウトが作れることから、最近メキメキ人気になっているCANVA、
このサービスは2013にオーストラリアで始まったwebサービスで、あらかじめ用意された様々なレイアウトテンプレートがありweb用画像制作や紙に印刷するためのデザインレイアウトテンプレートが数えきれないほどあります。商用でなくてもSNS用でも6種類のカテゴリーがあり、動くインスタストーリーのレイアウト済みテンプレートも準備されていてサンプルの画像の代わりに自分のセルフィーや飯テロをアップしてオリジナルで洒落たストーリーを数分で作り出すことができます。
また、2019年5月、同社はドイツに拠点を置く2つの無料ストックフォトサイトであるPixabayとPexelsの買収認め、両イメージ素材サービスにある画像であれば無料で使用可能で、個人が制作物を置いておけるストレージの容量は５GBまでです。

画期的な「背景リムーブ」機能は有料

サブスクで1500円払えば下記の機能が追加されます。

使える素材が増える
ストレージ容量が増える
画像のサイズや解像度を変更できる
フォルダーを無制限に作成可能

詳しい無料版と有料版の違いはこちら→

「背景リムーブ」機能を知ったきっかけ

この学校では私の元教え子が経営する制作会から実案件を流しています。
彼女はAmazonショップ運営会社の商品説明画像の制作を請け負うっており、取引会社は400軒ほどだそうです。

Amazonショップへの掲載画像で求められるクオリティはそんなに高くないので、受講初期に実案件の演習をするためのとても良い教材になります。

その彼女と受講生3名でグループ勉強会を開きました。2名はリアル参加、2名はリモートでの参加になりました。

そのグループ勉強会での事、
制作会社運営の教え子：「先生、CANVAって知ってますか？」
講師田中：「うん、知ってるよ。簡単なデザインならいいものが作れるよね。良いイメージ素材も充実しているし。何しろテンプレートがかっこいい！」
制作会社運営の教え子：「先生、それが最近CANVAはすごいんです！」
講師田中：「え？どうすごいの？！」

そこで彼女が教えてくれたCANVAの凄さを実証してみることになったという訳です。

「背景リムーブ」は「被写体を選択」に勝てるのか？

photoshopが最も得意とする、いわゆる印刷業界の言葉で「毛抜き合わせ」というものがあります。アナログの印刷技術では絶対に不可能だった髪の毛の切り抜きはphotoshopの数々の機能によって、今や難なくできてしまう時代です。特に新機能「被写体を選択」を使えばアフロヘヤーだって難なく切抜くことができ、別の背景に配置しても違和感なく全く自然です。果たして、その優れたphotoshopの切り抜き機能に「背景リムーブ」は勝てるのでしょうか？

アフロへやー切り抜き対決

結果は一目瞭然でした。完全に軍杯はCANVAに上がりました。下の画像は、アフロヘアーを切り抜き、別の背景に配置した画像です。photoshopで処理した画像は元の背景のエメラルドグリーン系の色味がアフロヘアーの輪郭に少し残ってしまっています。一生懸命調整で消したのですが。。。消し去れませんでした。方やCANVAの方は全く残っていません。