Adobe Photoshopを使用して背景が透明なgifを作成するにはどうすればよいですか?


8

Adobe Photoshopを使用して透明な背景の.gifを作成するにはどうすればよいですか?

私のWeb開発者にこれを行うように依頼するのは夕方遅くです。これが私が作成した画像のスクリーンショットです。

サンプル画像

ただし、文字の周りを白くしたくありませんここでは、http//wordfruit.comのように見えるはずです

これが私がやったことです:

  • 元の.gifをWebサイトファイルからダウンロードしました。
  • Photoshopで開くと、レイヤーがロックされ、新しいレイヤーを作成できません…
  • …それで、コピーして新しい.psdドキュメントに貼り付け、編集しました
  • 最後にそれを.gifとして保存しました

1
私はプロのUXデザイナーとして、アルファチャネルの透過性と優れた圧縮を備えているため、常にGIFよりもPNGを好みます。つまり、透明に設定するために色を失うことはありません。私の開発者と私はちょうど議論に入りました、彼は私に彼にGIFを送ってほしいと望んでいて、私は彼にコーディングの彼の職業に固執し、グラフィックデザイナーとして私のものに固執するように言いました。

回答:


15

GIFを保存するとき(Web用にエクスポート)、色を選択して透明にすることができます。選択できるのは1つの色だけなので、通常、画像の周囲にハローが発生し、画像から元の背景色にブレンドされます。

元のPSDファイルを取得し、それを透明なPNGとして保存した方がよいでしょう。


2

答えは私が理解したことに基づいています:|

あなたのやり方でこれを試してください

  • Webサイトからgif画像をダウンロードする
  • フォトショップで開き、画像>モード> RGBカラーを選択します(現在のGIF画像にインデックスカラーが表示されています)。

グーグルからの画像

  • 新しいドキュメントを作成するときは、必ず透明な背景を使用してください

photoshopforceからの画像

ここで画像を貼り付け、これをgifとして保存します。

GIFの保存については、こちらをご覧ください。透明なGIFを作成します(保存セクションのみを確認してください)


イメージスプライトを使用するデザイナー/開発者への私のアドバイスです。好きな方法で編集を行うことは困難です。元のpsdを編集し、保存して使用するよりも、デザイナーによるものではないこと/開発者は他のものを使用していて、あなたは他のものをやっています...


並べ替えと甘い提案:元のpsdを見つけて、テキストを編集し、.gifとして保存します。それ以外は、デザイナーを待ちます。

これが少し役立つことを願っています。


koiyu彼のイメージスプライトは彼にそれを理解させる最も簡単な方法だったと思いますか?
ジャック
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.