Home > tools > PhotoShop のレイヤー構造のまま Flash にエクスポート

PhotoShop のレイヤー構造のまま Flash にエクスポート

sitegringer.jpg

PSD2FLA」という PhotoShop 用の有料プラグインを使うと、psd ファイルのレイヤー構造のまま fla ファイルにエクスポートできます。

同様の機能は、次の Flash(Flash 側のインポート機能として提供予定)に搭載されるかと思いますので、それまで待てる方は待てばいいのですが、興味本位で「PSD2FLA」を試してみました。

    公式サイト上の機能紹介リストより:

  • 複数レイヤーを持つ Photoshop から、複数レイヤー構造のまま Flash の .fla ファイルを作成できます。
  • Flash ファイルは編集可能(各レイヤー上のパーツの移動とかかな。)
  • Flash 5 以降に対応( Flash MX2004 や Flash 8 にも当然対応)
  • Windows: Photoshop 4 から Photoshop CS2 までに対応
  • Mac OS X: Photoshop 7 から Photoshop CS2 までに対応
  • Photoshop の「レイヤー効果」もサポートしてます。
  • Flash 上の各レイヤーの位置は、Photoshop 上での状態を保持しています
  • Flash 上でのレイヤー名も Photoshop のレイヤー名に対応しています
  • Photoshop 上での非表示レイヤーを書き出さない設定も可能
  • 速くて簡単

ダウンロードのページから、「PSD2FLA」をダウンロード。「SiteGrinder」という、静的 Web ページのパーツのエクスポートに役立つらしいプラグインも一緒に付いてきます。
デスクトップにできたインストーラーをダブルクリック。インストーラーの2ページ目で、インストールするプラグインを選べます。「SiteGrinder」もインストールしてしまうと、42MB も使うらしいので、「PSD2FLA」のみ(564KB)だけを選択した方が良いでしょう。僕はあとから気づきました。
インストール後の使用の様子を操作画面でお届けしてみます。

PSD2FLA のデモ版を使う様子」(1分47秒:音声なし:1.1MB:1024px×823px)

何をやっているかというと、Photoshop 上でレイヤー構造やレイヤー効果を見せびらかせた後、データを保存、それから「ファイル>データの書き出し>PSD2FLA」で Flash にエクスポート。Flash 上でレイヤー構造を見せびらかせている、という映像です。

お気づきだとは思いますが、デモ版は Flash にエクスポートした時点で、パーツに青い斜線が入ります。有償登録(値段記載ページ)すると、解除されるらしいです。それを先に言ってよ~(実はちゃんと明記されてる)ということで、今からアンインストールしたいのですが、プラグインのアンインストールのやり方を知りません。Photoshop のプラグインフォルダの中に、SiteGrinder のアンインストーラーがありました。FLA2PSD はそのままゴミ箱かな?

追記:
Flash にインポートさせた時点で、各素材の RGB 値が1%ほど下がってしまうようです。詳細はコメント欄をご覧ください。

Comment:5

じぇぇ 2007-03-20 (火) 13:47

はじめまして。

psd から fla にできるのはいいですね~
以前FlashMX2004の頃に PhotoShop から Flash に 画像をコピーしたときに
RGB値がビミョーにずれるって現象があったんですが、そういうのはなさそうでした?

tera 2007-03-20 (火) 14:06

>じぇぇ様
はじめまして。
上のデモサンプルを使って psd → fla の RGB 値を調べてみました。

星の水色
R:0 G:252 B:213 → R:0 G:250 B:211

ピンク色の部分
R:238 G:172 B:172 → R:237 G:171 B:171

下地の茶色の部分
R:217 G:191 B:128 → R:216 G:190 B:127

あらら!どれも各1%ぐらい下がってますね。
ちなみに、いつものように、psd を1枚画像で PNG 画像として書き出し、Flash に読み込めば、psd の RGB 値のまま、きちんとインポートできました。

環境は Photoshop 6 と Flash 8 です。
こんな調べ方で良かったでしょうか?

nug 2007-03-20 (火) 21:01

いつもこのサイトで勉強させていただいてます。
PSD2FLA、私も過去に実験的に使っていました。
自動的に画像周囲に1pxの透明ピクセルをつけてくれたりと気の利くところもあるのですが、
実務でよくある「写真の差し替え」がとても困難なので、結局お蔵入りになってしまいました。
やっぱりCS3まで「待ち」ですね~。

tera 2007-03-20 (火) 23:04

>nug様
こんばんは。
写真の差し替えが困難な点、仰る通りですね!
さすが使用者のご意見だけあって、参考になりますです。
僕もCS3まで待つとします。

じぇぇ 2007-03-21 (水) 00:44

あぁ~そうです!そんな感じです!
やっぱりちょっと下がるんですね~
でも前の時はRGBそれぞれが10くらい下がっていてびっくりしたのを覚えてます。
それから比べたら良い方なのかもしれないですねw
確か俺もpngに書き出して解決させた様なきがしますw
わざわざ調べて頂いてありがとうございました!

Comment Form

コメントを表示する前にこのブログのオーナーの承認が必要になることがあります。

Remember personal info

Trackback:0

TrackBack URL for this entry
http://www.trick7.com/blog/mt-tb.cgi/503
Listed below are links to weblogs that reference
PhotoShop のレイヤー構造のまま Flash にエクスポート from trick7.com blog

Home > tools > PhotoShop のレイヤー構造のまま Flash にエクスポート

持っている Flash & ActionScript 関連本の中から、自分的おすすめの読む順番をご紹介。各書籍のレビューは books カテゴリからご覧頂けます。
この順番でどう?(AS3.0)
  • Adobe Flash CS3 詳細! ActionScript 3.0 入門ノート (DVD付)
    Adobe Flash CS3 詳細! ActionScript 3.0 入門ノート (DVD付)

    デザイン方面からFlashデビューして、そのままAS2.0を使うようになった人が、難しいと評判のAS3デビューする時の最初の1冊として、とにかく目を通しておくと良いかと思います。プログラミング経験の少ない方でも、サンプルをじっくり読めば、ゼロからのAS3デビュー可。
  • ActionScript 3.0 アニメーション
    ActionScript 3.0 アニメーション
    洋書「Making Things Move!」の日本語訳本。ActionScript3.0で数学的アニメーションを作ることがメインテーマなのですが、前半部分でAS3.0の基礎を分かり易く解説されています。後半の重力, IK, 3D表現等のアニメーション解説も楽しい。僕はこれのAS2.0洋書版を読んでFlashの面白さに気付きました。
  • Essential ActionScript 3.0 (Essential)
    Essential ActionScript 3.0 (Essential)

    900ページ以上ある相当分厚い本。基礎からOOPまでを解説。ほぼ網羅しているので、これを抑えておけばAS3博士になれそう。
  • Actionscript 3.0 Cookbook
    Actionscript 3.0 Cookbook

    ActionScript3.0のリファレンス本。問題とその解決法が1ページぐらいで細分化されているので空いた時間にちょっとずつ読み進められる。WebでAS3のソースを見て勉強する時の字引としても使う。ただ、時期的に初期の本なので、AS3自体が仕様変更してたりするので正誤表は必読。
  • Object-Oriented Actionscript 3.0
    Object-Oriented Actionscript 3.0

    7/23に発売されたFlash&OOP本。AS2.0版は持っているのだけど、オブジェクト指向の初歩的な解説から入って、後半は僕の理解を超える難度になっていきました。今度こそ理解できるか?
この順番でどう?(AS2.0)
  • Foundation Actionscript Animation: Making Things Move (Foundation)
    Foundation Actionscript Animation: Making Things Move (Foundation)

    スクリプトでアニメーションさせる方法を学べる。プログラムの知識というよりも数学や物理の知識が必要。バネの表現や3D表現など、汎用性の高いテクニックを身に付けられ、個人の表現力をレベルアップするのに最適。参考までに、僕が調べた英単語リスト。2007年4月に、AS3対応版も発売されました。
  • ゲーム開発のための数学・物理学入門 Beginning Math and Physics for Game Programmers
    ゲーム開発のための数学・物理学入門  Beginning Math and Physics for Game Programmers

    「Making Things Move!」の世界を突き詰めたい人用のステップアップのための本。行列や物理運動、2D/3D表現。Flashの本ではなく、じっくり読むタイプの本なので、あとまわしにしてもいいかも。
  • Flash 8 Essentials
    Flash 8 Essentials

    Flash8の新機能を紹介。全10章が独立した構成で、興味のある部分から読めます。フィルタやビットマップ、ビデオの使い方とかを、基礎から順を追って理解していけるので、ゼロからスクリプティングできるようになる。僕はビットマップ関連の作業の際のリファレンスとして常用しています。
  • .fla―Idea of Flash Creation
    .fla―Idea of Flash Creation

    上の本でFlash8の基本を身に付けて、それをどう面白い表現に落とし込むかを学べます。深津さんの、試行錯誤・実験しやすいスクリプティング、クラス設計に凄さを感じました。YouTubeやFlickrのAPI、PHPとの連携記事も。
  • FLASH ActionScript 2.0入門完全ガイド+実践サンプル集 [CD-ROM付]
    FLASH ActionScript 2.0入門完全ガイド+実践サンプル集 [CD-ROM付]

    ここまでで表現力が付き、テンションが上がるので、その勢いで難解なオブジェクト指向に挑戦。プログラム経験のない人がいきなり英語のOOP本を読むのは厳しい。この本で継承とかインターフェースとかポリモーフィズムとかの用語を理解しておくといいかも。
  • オブジェクト指向でなぜつくるのか―知っておきたいプログラミング、UML、設計の基礎知識―
    オブジェクト指向でなぜつくるのか―知っておきたいプログラミング、UML、設計の基礎知識―

    Flashの本ではありませんが、OOPの概念を気軽に読めるボリュームで解説してくれます。英語と日本語のOOP用語の対応を図るためにも「Object-oriented Actionscript for Flash 8」と併読するのがおすすめ。なんとなく読んでおくだけでも結構違うのでは。
  • Object-oriented Actionscript for Flash 8
    Object-oriented Actionscript for Flash 8

    前半はOOPの利便性や基本の紹介。デザインパターンやMVCの理解。13章からグッと難しくなって大変。Flash8対応。
  • Essential Actionscript 2.0
    Essential Actionscript 2.0

    上の本よりもさらにOOPプログラマ向け。同じOOP本ということでやや重複しており、こちらはMX2004時代の本なので見送ってもいいかも。分かりやすい英語で良著。この本のAS3版が出たら間違いなく買い。

Page Top