• 締切済み
  • 困ってます

Fireworksで8bitの透過PNGの書出し

Fireworksで、8bitの透過PNGの書き出しをしたいのですが、 透過させたくない白い部分まで透過してしまい、うまくいきません。 かなりのFireworks初心者で、きれいに書き出す方法をネットで調べてみたのですが、 分からず困っております。 作業詳細 ---------------- 最終的に欲しいデータ : Fireworks形式のPNG(8bit) 作業環境:Windows XP、Fireworks CS3、Photoshop CS3 作業手順: (1)Photoshopにて複数の画像を作成  ドロップシャドウなどを適用している透過画像もあるので、  「Webおよびデバイス用に保存」でPNG-24で書き出します。 (2)作成した画像をFireworksで、ある決まったテンプレート(PNG)にレイアウトします。 (3)書き出し設定  「最適化」WindowにてPNG 8 を選択。    (3)「書き出し」からスライスの書き出しを行います。 ---------------- すると、PNG32では問題なく書き出せるのですが、 PNG 8 の場合は、透過させたくない白い部分まで色が抜けて透過してしまいました。 試しにPNG24で書き出そうとしたところ、今度は透過させたい部分まで透過されなくなり、 スライスの範囲通りに四角い形になってしまいました。 PhotoshopのPNG8ではドロップシャドウの部分などがきれいに透過されないことと、 最終的にFireworkのテンプレートも必要なので、 Photoshopだけで作業は完結できません。 説明が下手で恐縮ですが、 8bitの透過PNG(Fireworks)の書き出し方をお教えいただけますでしょうか。 よろしくお願いいたします。

共感・応援の気持ちを伝えよう!

  • 回答数3
  • 閲覧数3657
  • ありがとう数0

みんなの回答

  • 回答No.3
  • hatiboo
  • ベストアンサー率42% (257/602)

>この方法で書き出しウィザードを開くと、何も配置していない背景まで既に白く表示されます。 書き出しウィザードを開いて、PNG-8を選択し、「透明化なし」を「透明」にするだけで 背景の白と絵柄の白は、区別されて、背景だけ透明だけになるようでしたが・・・ ドロップシャドーは検証していません お役にたてずに、すいません

共感・感謝の気持ちを伝えよう!

関連するQ&A

  • Fireworksでpng-24で書き出すには?

    Fireworks MXでpng-24(透過)で書き出すにはどうすればいいのでしょうか?(mac 10.39) 透過を含んだ画像をpng-8とpng-32で書き出すと正常に透過した画像になるのですが、png-24にしてかきだすと、透過の部分が白になってしまいます。これは仕様でしょうか? png-32では容量が大き過ぎるので、どうしても、png-24で書き出したいのです。フォトショップでは簡単そうですが、持っていません。 できないようであれば、png-24に変換できるフリーソフトなどあれば、ご紹介頂けないでしょうか?

  • FireworksCS3で、白以外を透過したい。

    FireworksCS3で、PNGもしくはGIF画像において、 白以外を透過できないものか、と思ってあれこれやってみたのですが、 出来ませんでした。 透過は基本的には白以外は不可能菜のでしょうか? もしやり方があるのであれば、ご教授いただければ幸いです。

  • 透過PNGについて。

    OSに入っているペイントのツールバーのハケで落書きをして、拡張子をPNGにしてマイピクチャーに保存しても、落書き以外の白い部分が透過しません、何がわるくて透過しないのでしょうか?、もともとペイントでは透過PNG画像は作れないのでしょうか?。

  • 回答No.2
  • mac1963
  • ベストアンサー率27% (841/3023)

透過させたくない白い所と透過させたい部分の白が色が近いのでしょう PNG32でokでPNG8だとNGなのは同じ範囲の白だと認識されるのでしょう 白い部分に少し色をつけてみるとか PNG32じゃダメなの? 何故

共感・感謝の気持ちを伝えよう!

質問者からの補足

ご回答ありがとうございます。 PNG32ではダメな理由は、Androidで使用する画像となり、PNG32では表示できない仕様らしいのです。 背景に、画像中に使われていない色を付けてみるなどは効果がありそうですが、そうするとドロップシャドウにその背景色が混じってしまいますよね? PNG8ではグラデ(ドロップシャドウなど)を使った画像の透過は無理なのでしょうか。。

  • 回答No.1
  • hatiboo
  • ベストアンサー率42% (257/602)

スライスしたPNGを保存した後、開いて書き出しウィザードのPNG8にて透過させたい部分を スポイトで選択する方法は駄目でしょうか? 参考まで ↓ http://okwave.jp/qa/q5117099.html

共感・感謝の気持ちを伝えよう!

質問者からの補足

この方法で書き出しウィザードを開くと、何も配置していない背景まで既に白く表示されます。 結果、背景の白を透過させたい色として選択すると、元々白く塗られている画中までもが透過してしまいます。 透過させたいのは、pngを配置していない透明部分なのですが、書き出しの形式にPNG8を選択すると、 背景と画像の境は認識されなくなってしまうのでしょうか。 扱っているものがグラデーションになる部分が多い画像のため、透過色を設定するための背景色を別途用意するとしても(白は必ず画像に使用されているので)、都度その画像で使用していない色を選択する必要があり、そんなに手のかかる方法でしか対応できないのか、悩んでしまいます。

関連するQ&A

  • 8bit透過PNGを書き出すと劣化?する

    最後にソースを記載しますが、やりたいことは 8bitの透過PNG画像を複数枚読み込み、重ねた1枚の画像を出力する、ということなのですが、どうにも画質が劣化?してしまって解決法が見出せずにいます。 以下のソースで読み込んでいるPNG画像は8bitの透過PNG画像で、BufferedImage.TYPE_BYTE_INDEXEDのBufferedImageに書きだして保存しているだけ(のつもり)です。 それだけで読み込んだもの、書きだしたものの品質が大きく違ってしまっています。 Javaで画像を扱ったことがほとんど無いので、そもそもTYPE_BYTE_INDEXEDを使うとそういう結果になるのは仕方のないことなのか、というのもわかりません。 ちなみにTYPE_4BYTE_ABGRを使うと劣化なく出力されますが、32bitなので。。。 どうにか読んだ8bit透過PNG画像をそのままの品質で書きだす方法はないものでしょうか? アドバイスをお願いいたします。。 ※添付画像は左側が下記ソース中のsrc.pngにあたるもの、右側がdest.pngにあたるものです。 画像添付がjpegしかできなかったので透過していませんが、円形以外の白色部分は実際には透過しています。 -以下ソースです-------------------- public class ImageTest { public static void main() { BufferedImage pileupImg = null; try { pileupImg = ImageIO.read(new File("C:/src.png")); } catch (IOException e) { return; } PixelGrabber pg = new PixelGrabber(pileupImg, 0, 0, -1, -1, true); try { pg.grabPixels(); } catch (InterruptedException e){} Image img = Toolkit.getDefaultToolkit().createImage(new MemoryImageSource(256, 256, (int[])pg.getPixels(), 0, 256)); BufferedImage bi = new BufferedImage(256, 256, BufferedImage.TYPE_BYTE_INDEXED, (IndexColorModel)pileupImg.getColorModel()); Graphics g = bi.getGraphics(); g.drawImage(img, 0, 0, null); try { ImageIO.write(bi, "png", new File("C:/dest.png")); } catch (IOException e) {} return; } }

  • 透過pngにも種類ある? ソフトによって透過しない

    ■状況 ・透過pngを下記3ソフトで開いたら、Photoshopでしか透過した状態で開けませんでした ・Photoshopで開いたものを保存して、新たにVieasで開いたら、透過した状態で開けました ・ペイント ・Vieas ・Photoshop ■質問 ・透過png形式の中で、さらに何種類か形式が分かれているのでしょうか?(画像ヘッダ?) ・それはどこで判断すれば良いのでしょうか?

    • ベストアンサー
    • CSS
  • FireworksのPNG書き出しについて

    Fireworks MXを使用しております。 書き出し時に「PNG32」として その画質で、背景を透過状態で書き出したいのですが、 プレビューの段階では異常はないのですが いざアップして見てみると、背景(マット)に色が付いてしまいます。 (もちろん、プレビュー前のマットは透明にしてあります) PNG8やGIFで保存の場合は背景に問題ないのですが、 この場合ですと画質が劣ってしまいます。 (具体的には「バー」の「グラデーション」に階層ができてしまうので  これをPNG32のグラフィックにして保ちたいのです) これはIEなどに原因があるのでしょうか? もしくはFireworksの設定に問題があるのでしょうか? よろしくお願い致します。

  • Fireworksの利点

    ホームページ作成を勉強しています。このたび、FireworksCS3の基本を勉強する機会がありました。このソフトを使用して、サイトのレイアウト、画像配置~画像をスライスして最適化~DWでコーディング、という一連の流れです。その結果、完成したものはGIF・PNG・JPEGで最適化され、サイズが確定した画像集ファイルです。一連の作業を履修したあとの感想ですが、これならばPhotoShopですべてできるのではないか、と感じました。Fireworksがホームページ作成に不可欠(またはPhotoShopよりも便利であるという)な理由として、皆様のご意見をお聞かせいただけませんでしょうか。勉強することが多すぎて、どこがわからないのかさえも、分からない状態です。宜しくお願いします。

  • fireworks 書き出しについて

    fireworks かなり初心者です。 先日、スライスのコツを教えていただきました。 今度は書き出しでストップしてしまいました。 書き出しをした後にdreamweaver でチェックすると、スペイサーがたくさん入っています。これの処理は、どうすればよろしいのでしょうか? スライスの仕方が悪いのか、それともスペイサーが多量にあっても、それをhtml タグの中で消せばよいのか? また、スライスした時に、名前を変更できると思うのですが、普通に名前をつけたらダーッと、その名前+番号が付くのですが、それで正しいのでしょうか?ひとつひとつ違う名前をつけるわけではないのか疑問です。 また、スライスして最適化する、という作業はひとつずつするものなのですか?それともまとめてできるのでしょうか? 本を見ても、まとめてしているのか分かりにくかったので・・・。 HTML を少し勉強したことがあるのですが、fireworks や dreamweaver 自体初めてで、HP作成ソフトという認識しかもたないので、どう扱ってよいのかわからないのです。 漠然と、fireworks でデザインした画像を、dreamweaver でHTML化する、という風に捉えているのですが、正しいのでしょうか? fireworks でのスライスや書き出しについて、ネットや本でも調べてるのですが、かなり詳しく書いてあるものを見つけることができない為、理解できずにいます。 言葉など、変なところもあるかもしれませんが、教えてくれる方いましたら、よろしくお願いします。

  • 名刺作成で画像pngの透過が反映されません

    オンラインサービスvistaprintにて名刺をつくる為に、 photoshop touch iPadにてある画像の背景を透明化し、 pngにてカメラロールに保存しました。 (カメラロール内では背景は黒く表示されています。) そのpngファイルをvistaprint内の名刺作成画面にて アップロード(画像を挿入)したところ背景は白く出てしまい 透過されていませんでした。 当方PC版、photoshop等は予算等もあり 持ち合わせておりませんのでiPadにてこのような作業をしております。 Vistaprintの名刺テンプレートは背景色がある為、 画像の背景が出てしまい困っております。 どのようにしたら背景が透明にできるかご教授願います。

  • Fireworks MXで書き出し出来ない

    Fireworks MXを使用しています。 画像にスライスを入れ、HTMLとイメージの書き出しを行おうとすると、 「スライスオブジェクトは無視されます。スライスオブジェクトおよびビヘイビアを書き出すには[スライスの書き出し]を選択してください。」 と表示されます。 これは一体どういう意味なのでしょうか? また、HTMLとイメージにして書き出しするにはどうしたら良いのでしょうか? ご回答宜しくお願いいたします。

  • 透過色を使用したPNGについて

    Photoshopで画像データを2種類作成しました。1つは透過色を使用していないもの、もう1つは透過色を使用したものです。作成後、エクスプローラを開いて2つのファイルのプロパティを参照すると、透過色未使用ファイルはビット深度8bit、透過色使用ファイルはビット深度32bitとなっておりました。 Photoshopで透過色を使用して作成したデータはビット深度は32ビットになるのでしょうか。詳しい方がいましたら、ご教授をお願い致します。 ちなみにPhotoshopのVersionは8.01、マシンOSはWindowsXP Proを使用しています。

  • 透過PNGの透過部分が灰色に見える

    WebSite用に透過PNGをつくりましたが、IE5.5で表示すると透過される筈の部分が灰色に見えてしまいます。原因などがわかりましたら教えてください。 PNG作成ソフトは、Padie Version35 で、元の画像をPhotoShopLE と PaintShopPro 4.2J で作って、クリップボード経由でPadieに渡しています。 環境は、Windows2000ProSP2+IE5.5SP2です。ネットスケープなど、その他の環境での検証はしていません。 また、ローカルとWeb上のどちらでも同じ症状が現れます。

  • Fireworksなどのスライスで、CSSレイアウトで書き出せるの?

    テーブルレイアウトで慣れてるためか、CSSレイアウトがどうしても馴染めません。 Dreamweaverで作ってますが、数倍も難しく感じます。 もしかして、やり方を間違ってるのかも知れません。 私は、Dreamweaverで一つずつ組んでいくため、Fireworksなどの「スライス」機能を使わないのですが、 ●質問1 もしかして、Fireworksでレイアウトしたら、 Fireworksのスライスで、CSSレイアウトで簡単に書き出せるのでしょうか? 多分、テーブルレイアウトでの書き出しだけだと思ったのですが・・・。 私の知識は古いので。 ●質問2 また、HP作成は、Dreamweaverで作るとして、 レイアウト作成や画像作成は、現在の主流は、 Fireworksでしょうか?Photoshopでしょうか? プロは普通どっちを使ってますか? 私はPhotoshopしか使った事ありません。 Fireworksに乗り換えるべきか、考えてます。 よろしくお願いします。