こういうホームページが作りたい

質問

ttp://www.ryu-raku.co.jp/
こんな感じにキャラクターをかぶせてアクションさせたりしたいのですが、どういう仕組みなのでしょうか？
背景画像に横長のFLASHをかぶせているだけでしょうか？？
また、FLASHは透過させてあるんですよね？
仕組みがよくわからないので教えてください
こういったデザインの場合、どんなソフトが必要ですか？

回答No.2

noname#35109 · ベストアンサー

まずFlash の部分について解説します。

ソースを見てもらうとわかりますが，
Flash を貼り付けているタグは以下のようになっています。

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="780" height="135">
<param name="movie" value="swf/oni04.swf">
<param name="quality" value="high">
<param name="wmode" value="transparent">
<embed src="swf/oni04.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="780" height="135" wmode="transparent"></embed>
</object>

とりあえず，このタグの
width="780" height="135"
を見てもらえばわかるとおり，本当はキャラクターの部分だけがFlashなのではなく，
動く範囲全体がFlashなのです。

OBJECT タグ内の
<param name="wmode" value="transparent">
これが，Flash の背景を透明にするというタグです。
もう一箇所あって，
EMBED タグ内にも
wmode="transparent"
があります。

この２箇所を付け加えれば，Flash の背景が透過し，バックのJPEGなどの背景が透けてみえます。

もしマクロメディアの Flash をお持ちでしたら，
Flash の パブリッシュ設定で，HTMLタブを選択して，
半分よりやや下にある，

ウィンドウモード(O)：[ 標準　　　　 　]　の部分を
ウィンドウモード(O)：[ 透明表示　 　]　にしてパブリッシュしたHTMLのタグを使用してみてください。

自動的に背景が透明なタグがHTMLに書き出されます。
ただし，このタグは Flash閲覧可能な 全てのブラウザで解釈されるわけではありません。
紹介されているサイトは，なぜそのようにしているのかよくわかりませんが，
普通はそのサイトのようにするより，
JPEG を Flash 内に読み込んで Flash 内の背景として使う方が無難です。

本家 Macromedia より，
「背景が透明な Flash ムービーを作成する方法」
http://www.macromedia.com/jp/support/flash/ts/documents/fl0306.html

この辺も参考になるかもしれません。

>> こういったデザインの場合、どんなソフトが必要ですか？

Flash は必須ソフトです。
そのサイトの場合 Flash MX（２世代前） のバージョンで作られているようですが，
今バージョンだと最低，Flash Basic 8 は必要です。
できれば， Flash Professional 8 の方が良いですね。
http://www.macromedia.com/jp/software/flash/flashpro/

その他は，Adobe Photoshop CS2
http://www.adobe.co.jp/products/photoshop/main.html

と，HTMLエディタですね。
これは ＃１ の方もかかれている通り，
デザインのセンスと知識さえあれば，メモ帳でもできますし，
ホームページビルダーでも可能でしょう。

Flash Professional 8 を買われるのでしたら，
HTMLエディタ である Dreamweaver 8
グラフィックツールの Fireworks 8
そして Flash Professional 8　も同封された
STADIO8 が良いです。
http://www.macromedia.com/jp/software/studio/

Fireworks 8 があれば，Photoshop は不要かもしれません。

それより何より，デザインセンスが最も重要ですよ。
いくら良いソフトを買っても，
白紙からデザインを始めるわけですから，
ある程度の才能と知識や努力が必要です。

お礼

とても分かりやすい説明ありがとうございます。
単純に、背景と統合したflashをつくるほうが良いのかもしれませんね。
では、ああいうキャラの動きをどういうソフトでつくっているんでしょうか？
キャラ自体のアニメーションのことも今後、知っていきたいです。
ありがとうございました。

回答No.1

Dorohedorer

デザインはソフトを使用せず手打ちでも問題はないですよ。
htmlとCSSを理解していればいいんではないでしょうか。

トップのものはフラッシュで制作されてることはわかっていられるようなので、制作ソフトを参考URLに記述しておきます。

参考URL：

http://www.macromedia.com/jp/software/flash/flashpro/

お礼

親切な回答ありがとうございます。
これからがんばってみたいとおもいます。
ありがとうございました