Articles

Illustrator で .jpeg 画像の白い背景を削除する方法

Posted on

Forest と Ance の 2 人は、さまざまなソフトウェアを使用しており、プログラムのテクニックや見識を他の人と共有することを楽しんでいます。 Adobe Illustratorのツールを使って、.jpeg画像の白い背景を除去する方法をご紹介します。

背景が白い画像は、プレゼンテーション、ドキュメント、その他のメディアにうまく組み込むことができません。 Adobe Illustratorのツールを使って、.jpeg画像の白い背景を除去する方法をご紹介します。

Stanley Dai via Unsplash

白い背景を透明にする方法

最近、ウェブ開発の仕事で、.jpeg画像から白い背景を取り除くという単純な問題に直面しました。

画像から背景を削除する方法はたくさんありますが、この方法はIllustratorで適用できる方法の1つです。 この方法は、単純な.jpeg画像には効果的ですが、写真にはあまり効果的ではありません。

これは、この記事の目的でプロセスを実演するために使用するサンプルの.jpeg画像です。'll be using to demonstrate the process for the purposes of this article.

これは、この記事の目的のためにプロセスを実演するために使用するサンプルの.jpeg画像です。

Forest and Ance Kvasnikoff

Adobe Illustratorで.jpegファイルを開きます

  • Illustratorを開きます。
  • 「ファイル」→「開く」を選択し、.jpegファイルを探します。
背景を削除したい画像ファイルを開きます。

背景を削除したい画像ファイルを開きます。

透明度グリッドを有効にする

実際に.jpegの背景を透明にしているかどうかを簡単に確認するには、次のようにします。

  • 「表示」を選択し、「透明度グリッドを表示」を選択します。
透明度グリッドでは、画像のどの部分が白ではなく実際に透明になっているかを確認することができます。

透明度グリッドにより、画像のどの部分が白ではなく実際に透明なのかを確認することができます。

Forest and Ance Kvasnikoff

画像をトレースするための準備

これから作業を行うために、トレースウィンドウを開く必要があります。

  • 「ウィンドウ」→「画像のトレース」を選択。
画像のトレースツールは、画像の被写体を白い背景から分離するのに役立ちます。

イメージトレースツールを使うと、白い背景から画像の被写体を分離することができます。

Forest and Ance Kvasnikoff

トレースの設定

.jpegから白い背景を取り除くトレースを作成するには、トレースウィンドウで次の設定を選択します。

  • Preset: Defaultのまま(他の設定を変更すると変更される可能性があります)。
  • View: Tracing Resultを選択。
  • Mode: Colorを選択。 Colorを選択。
  • Paletteを選択。
  • Advanced: 拡張して詳細設定を表示し、方法以外のすべてのオプションをデフォルト設定のままにします。 方法を[隣接]に変更します(左のアイコン)。
  • オプション。
  • [トレース]を選択します。
  • 注意:各設定の変更が画像にどのような影響を与えるかを確認するために、トレースする前にプレビューをチェックすることができます。

    画像をトレースする前に正しい設定を選択してください。

    画像をトレースする前に、正しい設定を選択してください。

    Forest and Ance Kvasnikoff

    画像の確認と保存

    これで背景が透明な画像ができました。 背景のない画像を保存するには、次のいずれかを実行します。

    • 「ファイル」→「名前を付けて保存」を選択して、ファイルを .png としてエクスポートします。
    • 「ファイル」→「Web用に保存」を選択して、.png形式で保存します。

    注:透明な背景をサポートする他のファイル形式には、.gif、.bmp、.cssがあります。

    画像を.jpegとして保存しないように注意してください。 エクスポートすると真っ白な背景になってしまいます!

    画像を.jpegで保存しないようにしてください。

    Forest and Ance Kvasnikoff

    背景に別れを告げる!

    すべての非矩形の.jpeg画像には背景色があり、通常は白です。 これらの画像を、背景自体が白ではない文書、Web ページ、またはプレゼンテーションで使用する場合、背景は厄介で、気が散り、まさにプロフェッショナルではありません。 このガイドが、.jpeg 画像を修正して、メディアの品質を低下させるのではなく、追加するのに役立つことを願っています。

    © 2015 Forest and Ance Kvasnikoff

    Rose on February 13, 2020:

    いくつかの画像ではうまくいきましたが、他の画像ではうまくいきませんでしたか?

    Julia on November 29, 2019:

    Hi! 最初はうまくいきましたが、今ではとてもピクシル化して保存されています! Any help would be great.

    Danny on October 04, 2019:

    Who else is from La rue’s class?

    McKenna on June 25, 2019:

    SO helpful!!!!

    Amir Ghafari on October 08, 2018:

    tank u so much

    Jojo on August 30, 2018:

    Thank you soooooo much!!!! 🙂

    Erica on April 12, 2018:

    私のロゴには白が入っているので、トレースが白を検出し、トレースが完了すると、ロゴの白の部分の真ん中にまっすぐ線が入ってしまうので、まだ困っています。

    Erin Riley on March 26, 2018:

    You are a badass! Thank you so much!!!

    ricben on March 18, 2018:

    私も感謝の言葉を述べさせていただきます。

    私は何時間も費やしましたが、あなたのおかげで今後数え切れないほどの時間を節約することができました。 Thank you SO MUCH!

    MOBEEN on February 10, 2018:

    THANKS ALOT . Its helped me in my business

    The Chosen One on January 09, 2018:

    OMGGG this helps a lot!!!! Thaaaanks.~~

    Elsa on December 20, 2017:

    THANK YOU SO MUCH!!!!!!!!!!!!!!!!!!!

    waro on October 15, 2017:

    thaaaaaanks a lot

    Ducky on September 18, 2017:

    Thank you very much

    Ashley on August 02, 2017:

    awesome thank you so much!!

    Bri on July 17, 2017:

    うまくいきません。

    Dave on June 17, 2017:

    Thanks Bro, I was started to be realy p-o’d and about to punch my computer screen before I came across this!

    Jim on June 06, 2017:

    Thank you!

    JASKJosh on May 12, 2017:

    Perfect thanks!

    Awful Grace on May 11, 2017:

    Excellent! それは動作します。 Thank you!!!

    Tiffany on March 20, 2017:

    Easiest tutorial – thank you!!!

    Nicholas on March 07, 2017:

    Thank you, but my opinion, i have the easier way.

    1. 画像を選択する

    2. 不透明度」をクリックする

    3. 通常」を「暗くする」または「乗算」に変更する

    4. タダ

    5. You’re Welcome

    JEFFREY on February 21, 2017:

    I Can’t find the image trace function on my menu?

    The Guy Who Was Doing IT ALL WRONG!! on January 12, 2017:

    DUDE… HOLY BAWLS, you just saved me an descriptionable amount of time…. 私はずっとアンカーポイントツールを使っていました…。 I wanna hug you.

    Mark on October 28, 2016:

    Forest! 助けてくれてありがとう。 You never come visit us in Seldovia!

    Kat on October 28, 2016:

    This helped me SO much! ありがとうございます!

    martin on October 24, 2016:

    i am trying this but with a black background and I am struggling, any tips?

    Jawhar Petersen on October 18, 2016:

    Awesome, saved me some time in trying to understand it out! great tutorial!

    deepsea on October 16, 2016:

    bloody great help – WORKED for me

    Thank you

    Dave on October 13, 2016:

    Illustratorをあまり使ったことのないユーザーとして、psdレイヤーからテキストをsvgに取り込むのに大変助かりました。 かなりシンプルで簡単なように見えますが、この投稿に出会うまでは、この作業にあまりにも多くの時間を費やしていました。

    Much Thanks!

    Linda on October 05, 2016:

    wonderful tutorial, made my life a hold lot easier….

    Thanks

    Clipping Path India from United Kingdom on September 27, 2016:

    It is just for specific images… like yours. Thanks for the tutorial!

    momo on September 15, 2016:

    this was great but when I try copy and paste the image somewhere else it doesn’t show up

    Lara on September 09, 2016:

    Thank you – really beautiful!

    Laura on August 19, 2016:

    Great – thank you!

    Jacquelyn on August 02, 2016:

    Thanks so much!

    … on March 20, 2016:

    thank you ! extremely helpful

    sume on October 05, 2015:

    あなたのチュートリアルは、オンラインの他の誰と比べても絶対的に最高でした! 素晴らしい仕事です。

    コメントを残す

    メールアドレスが公開されることはありません。 * が付いている欄は必須項目です