洋服のファンションがシュミレートできるページ

質問

こんにちは。
今度タイトルに表記のページが作りたいなと思っています。イメージとしては、ひとつのシャツをクリックするとシャツカラーのバリエーションが出てきて、カラーを選ぶと中央の人物がその服を着た写真になる、ということをしたいのですが、これをシャツのみでなくパンツやスカートもあらゆる組み合わせで中央イメージの写真を着せ替えられるようにしたいのです。
このようなものを作るのにあたって参考になるサイトやヒントなどもしご存知の方いらっしゃいましたら教えてください。よろしくお願いいたします。

回答No.4

noname#35109 · ベストアンサー

これは色々な方法がありすぎて，回答に困りますが…

「私だったら」の回答です。

MCの複製（duplicateMovieClip）とか，
ライブラリからシンボルを取得（attachMovie）とか，
座標(_xや_y)を動かすとかも考えられます。
でも，そういう方法は使わず，
シンプルに 「○○.gotoAndStop();」 と 「○○._visible」 の組み合わせで行きます。

できるでしょう。
シャツ1のMCを胴体のあたりに配置。
シャツ1のMCの中は　赤・青・緑 …　などのシャツを置いたフレームを用意しておく。
シャツ2，シャツ3… も同様。

最初は全てのMCを 「シャツ1～シャツ？._visible = false;」で消しておいて，

例えばシャツ2をクリックしたら，
カラー一覧とシャツ2MCを「 シャツ2MC._visible = true; 」 で出没させる。
赤ボタンを選んだら，「シャツ2.gotoAndStop(赤シャツのフレーム);」　を実行。
青ボタンを選んだら，「シャツ2.gotoAndStop(青シャツのフレーム);」　を実行。
次にシャツ3をクリックしたら，
「シャツ1～シャツ？._visible = false;」にして，シャツ3MCだけ， ._visible = true; で出没させる。
以降同じ。

//////////////////////////////////////////////////////////////////

でももっとシンプルに考えて，「○○._visible」 も使わず，
「シャツMC」の中のフレーム１に「シャツ1MC」を，フレーム2に「シャツ2MC」を…　と入れて，
すべて 「○○.gotoAndStop();」 で行っても良いですね。
初心に戻って，このMCの入れ子の 「○○.gotoAndStop();」 だけの単純な方が良いです。
これで行きましょう。私ならこの方法で行きます。
わかりますか。
シャツMCのタイムラインを図示するとこんな感じ↓です。

　　　　　　　　　　　　　　　　　　　赤 青 緑 …シャツ
　　　　　　　　　　　　　　　　　　　↓ ↓ ↓
　　　　　　　　　レイヤー　筆・・|●|●|●|…　シャツMC1のタイムライン
　　　　　　　　　↓ レイヤー　筆・・|●|●|●|…　シャツMC2のタイムライン
　　　　　　　　　↓ ↓ レイヤー　筆・・|●|●|●|…　シャツMC3のタイムライン
　　　　　　　　　↓ ↓ ↓
レイヤー　筆・・|●|●|●|…　シャツMCのタイムライン

Simple is Best .
Don't forget your original ..

お礼

お返事がすっかり遅くなり申し訳ございません。
それと丁寧な回答ありがとうございました。
さっそく試してみたのですが、教えていただいた通りに作成し、goto・・・で
うまく表示することが出来ました。
ただひとつ問題が出てきまして・・・お分かりでしたらまた教えていただきたいのですが・・・。
たとえば画面上の右端にシャツやパンツのボタンがあり、ジャケットをクリックすると画面下に
ジャケットのカラーバリエーションのボタンが出てきて、赤を押すと赤のジャケットが
画面中央上部に表示されます。そしてその赤ジャケットにパンツを合わせてみたい場合
画面右端のパンツのボタンをクリックするとパンツのカラーバリエボタンが出てくるのと
同時に、ジャケットのカラーバリエボタンや画面中央のジャケットの写真は消えてしまいます。
もちろん、カラーバリエのMCの中に画面中央の画像をいれているのでこのような動きは当然なのですが、
ではどうすれば画面中央の画像だけを残してパンツと組み合わせられるのでしょうか？
もしなにか説明不足でしたら、補足させていただきます。初歩的なことなのかも知れませんが
どうぞよろしくお願いいたします。

回答No.5

suzuko

参考サイト、ここはいかが？

参考URL：

http://www.adidas.com/jp/products/teamcolour/content/index.asp?strCountry_adidascom=jp&strBrand_adidascom=performance

お礼

お返事がすっかり遅くなり申し訳ございません。
アディダスにこんなページがあったの知りませんでした。やりたいことに近いのですが、自分が作りたかったものよりもすごい！着せ替えの上に、モデルが回転するんですね。
教えていただいてありがとうございました！

回答No.3

ken1low

ものすごい力技ですが、すべてのパターンで
写真をとるのはどうでしょうか？

車は単色やあってもツートンカラーですが、
服は模様など入るため写真では難しいかも
しれません。。。

お礼

お返事がすっかり遅くなり申し訳ございません。
それは私も思ったのですが・・・・。
手間とファイルサイズが心配ですよね・・・・
回答ありがとうございました。

回答No.2

COATEDPAPER

下記アドレスのＨＰへ行って見てはどうでしょうか。
Web上でファッションとHP配色のカラーコーディネートをシミュレートがあるサイトです。

参考URL：

http://www.hi-ho.ne.jp/douton/index.html

お礼

回答者No.1 natatin様、No.2 COATEDPAPER様
二人ともありがとうございます。
拝見させていただいたのですが
出来れば絵でなく写真で行いたいのです。
最近よく車屋さんのページでボディカラーを選ぶと写真の画像が切り替わるようなページが用意されていますが、シャツカラーを選ぶとシャツが。パンツを選ぶとシャツはそのままで、パンツが変わり、またシャツを選ぶとパンツはそのままでシャツだけが変わるような感じです。服を買う前にあらゆる服のコーディネイトを画面で確認できるようなページにしたいのですが、服は着丈？とかも違うし、写真を使うのはやはり難しいですかね。

お答えいただき、ありがとうございました。

回答No.1

natatin

これなんかどうでしょうか
着せ替えのシュミレーションがありますが
http://www.hi-ho.ne.jp/douton/