WEB上でFFⅩに匹敵するほどの水表現をするには？ [Archive]

View Full Version : WEB上でFFⅩに匹敵するほどの水表現をするには？

cucu81

2002/02/28, 08:20 AM

水（＋波表現）は人に安心感を与えますが、
WEB上でのその精巧な作り方が分かりません。
どのようにすればできるでしょうか。

技術的には、FLASHあたりが良いと思うのでよろしくおねがいします。
（流行しているJavaAppletsのような幼稚なものではなく、
FFⅩのような、「おぉ!?」思うような描画が望ましいです。）

具体的な実現方を教えていただきたく存じます。

dayan

2002/02/28, 01:21 PM

具体的な実現方法というか対策として以下のものが考えられます。

(1) FFⅩの作品を隅々まで研究し技法・表現方法を学び取る（パクるともいう）。
(2) FFⅩのスタッフに人脈を作る。

raccy

2002/02/28, 01:26 PM

新しいwww用言語curlなら、簡単に出来るかも知れません。
サンプルをみると、そんな感じがする…だけなんですが、、、
オラもいまだによくわからないです、、、
やり方がわかったら、オラにも教えて欲しいです。

nisimoto

2002/02/28, 02:57 PM

http://www.anfyteam.com/

流行しているJavaAppletsのような幼稚なものしか知りません・・・・
:confused:

nyonyoru

2002/03/12, 12:03 AM

Originally posted by cucu81
水（＋波表現）は人に安心感を与えますが、
WEB上でのその精巧な作り方が分かりません。
どのようにすればできるでしょうか。

技術的には、FLASHあたりが良いと思うのでよろしくおねがいします。
（流行しているJavaAppletsのような幼稚なものではなく、
FFⅩのような、「おぉ!?」思うような描画が望ましいです。）

具体的な実現方を教えていただきたく存じます。
３DCGのプログラミングをかじったことのある人間として、
コメントしたいと思います。

#収束しているようなスレッドにレスつけるのはあれなのですが・・・
FFXのような表現を目指す、との事ですが、予想に反してJavaApplet
以外では無理です。IE限定でいいならActiveXを使う手もありますけど。
これはリアルタイムで計算して表示するならばの話で、動画を配信す
るのであれば、その限りではありません。

水の波の表現は三角関数で適当にごまかすとして、問題は表示です。
３DCGでは、（いまのところ）小さな三角形がたくさんあつまって物体を
表現しているのですが、波のような滑らかなものを表現するとなると、
小さい三角形が多数必要になります。さらに水は半透明ですから、
三角形を半透明にする処理も必要です。
これをCPUのみが行うのは結構無茶なので（表示がカクカクになり
ます）、普通はビデオカードの力を借りることとなります。GeForceや
RADEON（だったっけ？）等、最近のビデオカードは高度な3D演算
能力をもっています。

さて、そのビデオカードの力を借りる方法は、僕の知る限りでは
JavaのJava3D、Web３D、IE限定のActiveXを操作する、という
ものがあります。このうち、Web3Dは動的に三角形を動かすのには
適してません（はず）し、ActiveXを使う方法では、WindowsのIE
限定となってしまいますし、その上VBScriptやJavaScriptは、
上のような処理を行うには非力すぎます。（実行速度が遅い、
というわけではなく、言語の表現能力がヘナヘナ）
というわけで、残るはJavaApplet＋Java3Dとなります。
#Java3Dあんまり詳しくないのであれですが、多分これくらいなら
#実現できるはずです。
#http://www.win.ne.jp/~m-nagaya/program/effect/water.html
#このあたりは試行錯誤しないといけませんけど。

正直いって敷居は低くありませんが、それでも作りたいならば、
僕は色々と応援しますよ(^o^)丿

本当はJavaAppletのサンプルを僕が示せればよいのですが、
今の僕では作りきる自信がありません。すいません_(._.)_

gen-ta

2002/03/12, 12:31 AM

Javaは幼稚、Flashで、
とういうの理解できず悩ましい。

Flash6のことかいな？
SW-3D相当と聞いてるが？

WEBでアルファブレンディング？
ブロードバンド時代だね。

gen-ta

2002/03/12, 01:08 AM

レスになってなくて反省。

web上でと言った瞬間にjavaしか無くなりますがな。

cucu81

2002/03/12, 06:53 AM

＞dayan
別にスクエアに聞く必要はない。
スクエアに聞くなら、うちのプログラマなりCGなりに聞いても同じだよ～ん。

＞nyonyoruさん、ありがとう。
そうね～、Javaなら、３D関数があるので、
とりあえず、波を表現するアルゴリズムなり、なんなりがわかれば
できるでしょうか。

しかし、やはりJavaAppletsでは意味がない。
拒絶反応がでかすぎるょ～。

gen-ta　さんは、具体的に制作できる？

とりあえず、今のプロジェクトが終わったらプログラマとCGに聞いてみよ。
ゲーム制作で、プログラマやCGが作ってきた波表現を「もっとちゃんと作らんとダメダメですなぁ～」
といっているオラなわりには、波は作れませんな。

gen-ta

2002/03/12, 09:33 AM

nyonyoruさんのリンクにあるようなサンプルをswfで作ればよろしいか？
・反射や屈折を波面形状から計算せず、テクスチャで良い
従って
・上空を鳥が飛んだりしない。
・水面の下を魚が泳いだりしない。
で要求を満たしてますか？
これでよければサンプルを作ってみます。

追伸：これだと完全に2D技術だね。

dayan

2002/03/12, 10:19 AM

gen-taさんへ

cucu8重1名取は多分ここの[WATER MUSIC]の音楽演奏の背景がほしいのだと思います。

http://cucu81.s2.xrea.com/@sound/

以前は水槽をゆらしたような水表現が背景にありました。
それはそれでよかったと思うんだけど、本人がボツをくらわしたようです。

gen-ta

2002/03/12, 11:51 AM

ありがとう。
全然違う物を考えてた。
助かりました。

cucu81

2002/03/12, 03:05 PM

Originally posted by dayan
gen-taさんへ

cucu8重1名取は多分ここの[WATER MUSIC]の音楽演奏の背景がほしいのだと思います。

http://cucu81.s2.xrea.com/@sound/

以前は水槽をゆらしたような水表現が背景にありました。
それはそれでよかったと思うんだけど、本人がボツをくらわしたようです。
うぉ!! なんだそりゃ。
うごいてねーじゃん。。。
（いつからうごいてねーんだろう。。。
再ウプした時に、バイナリとテキスト間違ったんだろな～）

うごいているものは、あーと、とりあえず、こちら。
http://cucu81.jp/@sound/

gen-taさん、
なんかいいサンプル作れそうならお願いします。

nisimoto

2002/03/12, 03:08 PM

Originally posted by cucu81

http://cucu81.jp/@sound/
納得・・・・
:o

dayan

2002/03/12, 04:34 PM

「ボツ」ではなくて「ミス」だったのか。
背景が復帰したらみんなで
「お帰りなさいといってあげるわ」（Vol.4）
といってあげよう。

gen-ta

2002/03/12, 09:04 PM

>cucu81さんへ。
いいじゃないですか。

あれよりcoolな物を作るのは大変だな。
ちょっと時間を下さい。

nyonyoru

2002/03/12, 11:14 PM

cucuさんのレベルを考えず、えらそうな発言してすいませんでした。

＃cucuさんのサイトを見たとき、しまった(･o･)、と思いました。

今度から一息おいて発言します。

tamaya

2002/03/13, 02:11 AM

Originally posted by cucu81
うごいているものは、あーと、とりあえず、こちら。
http://cucu81.jp/@sound/

「ちゃぷんちゃぷん」とお水が揺れてるというより、
お水よりもっとぷるぷるした液体が「たぽんたぽん」揺れてる
というかんじなのですね

cucu81

2002/03/13, 05:34 AM

Originally posted by nyonyoru
cucuさんのレベルを考えず、えらそうな発言してすいませんでした。
＃cucuさんのサイトを見たとき、しまった(･o･)、と思いました。

そんなこたぁないよん。
「知ってる」「心得がある」「参考になれば」と思ったことは、
どんどん言ってもらったほうがみんなのためにもよいですよん。
そ•れ•が、掲示板でやんすぅ。
（それに紹介してもらったページは、グーで、違うサイト（テスターサイト）で役立ちそうダス。
　3Dマップをどうしようか～と思ってたので…）

>たま
これ水槽。でも、これはこれで、とてもマッチングしてるけんどね。

tamaya

2002/03/13, 07:51 AM

Originally posted by cucu81
>たま
これ水槽。でも、これはこれで、とてもマッチングしてるけんどね。
うん。なんだか液体の粘度？ていうの？
たゆーんたゆーんしてて音楽の流れてる画面なかんじにいいとおもうの～
もっとちゃぷんちゃぷんな感じだとどうなんだろう？
たゆーんたゆーんなのがいいかもだけど好みの問題よね～

gen-ta

2002/03/14, 03:18 AM

水面画像の研究のため検索すると、最初にヒットしたのが、ネス湖のライブサイト。

やっぱり水面・波と言えばネス湖につきるようです。
このサイトを研究し、構想を練ること一年余、ついに完成しました。
これです。 (http://readcgi.s7.xrea.com/404/015.swf)

まじめな話をしますと、
波を軽いデータで表現するには、数値計算で作るか、サイクリックなテクスチャを
使用するかのどちらかでしょう。
前者をwebで実現するには、事実上java以外の選択肢は無いように思われます。
これではcucu81さんに怒られるので、今回は後者の方法を使用しました。
格子模様にsin-waveをかけたテクスチャを用い、立体バンピングで作っています。
こうして出来た波はシンプルな周期性を持つのでアルファ合成しか出来ないFLASH
でも簡単なベクタ形状で再現出来るはずです。

が、その「簡単なベクタ形状」が実はまだ見つけられずにいます。
というわけで、上のFLASHはラスタ画像をただ並べただけです。
そのため、100KBというFLASHとしては並外れた重さになっています。

ベクタ化して軽量・高画質版が出来たらまた報告します。
要らないと言われても報告します。
これは私のライフワークになりました。

nyonyoru

2002/03/14, 07:39 AM

Originally posted by cucu81

そんなこたぁないよん。
「知ってる」「心得がある」「参考になれば」と思ったことは、
どんどん言ってもらったほうがみんなのためにもよいですよん。
そ•れ•が、掲示板でやんすぅ。
（それに紹介してもらったページは、グーで、違うサイト（テスターサイト）で役立ちそうダス。
　3Dマップをどうしようか～と思ってたので…）

以前同じ事をやって引かれたことがありまして・・・
ともかく、役に立てたならうれしいです。

それでは。

ahomin

2002/03/14, 09:46 PM

始めまして。
サンプルになりそうなページを見つけましたので紹介します。
使っているのはJavaですね。
http://www.eastsea-orchid.com/

gen-ta

2002/03/15, 03:17 PM

波のテクスチャを作るにあたり、正確なグラデーションパターンが必要ですが、
色や位置の解像度を上げるとグラデーションを作るだけで一苦労です。
そこで、標準グラデーション作成機を作りました。

添付のzipファイルを展開すると出てくるwaveptn.exeを実行すると、下記の
４種類が表示されます。
　１．輝度-直線グラデーション
　２．輝度-サイングラデーション
　３．色相-直線グラデーション
　４．色相-サイングラデーション
ウィンドウ幅の1/2の周期のグラデーションを2サイクル表示します。高解像度の
グラデーションを得るにはウィンドウサイズを大きくすれば良いというお手軽仕様です。
４番目の「色相-サイングラデーション」は耳慣れないですが、描いて見ると高彩域
が拡大されてなかなか良い感じなので残しました。

なんだか、本当にライフワークの様相を呈してきたなあ。
win95以降用。vcソース付き。

youko

2002/03/16, 01:51 AM

win95以降用。vcソース付き。
マカーもお忘れなく。

てか、見たいよー。

gen-ta

2002/03/16, 10:41 AM

そうか。こいうのはmac抜きでは語れないねー。
残念ながらmacの開発環境も知識も無いのでキャプチャ画面をどうぞ。

png24でよろしいか？横幅1600pxです。
　↓

gen-ta

2002/03/16, 04:19 PM

これまで反射でやってきたけど、透過の方が変えられる条件が多くて面白そう。
javaのも反射ばかりだし、反射はやめて、透過にしよう。 (http://gen-ta.s4.xrea.com/wave.swf)