ページ 11

エフェクトアニメーション・リッチUIについての情報交換所

Posted: 2010年10月17日(日) 11:13
by Dixq (管理人)
アプリやゲームの見た目を数倍にも華やかにしてくれるエフェクトアニメーション。
そしてメニュー構造をより視覚的に解りやすくしてくれるリッチUI。

何をどうしたらより効果的・効率的にこれらが作れるのか?
(ゲームにおける魔法詠唱アニメーションや爆発エフェクト等も含まれます)

まだ現場では試行錯誤で作られていることが多いのか、これが王道という方法もwebでの情報も大した書籍もほとんどありません(webアプリ開発の為の資料が少しある程度)

そこで、アニメーションやリッチUIについての情報交換をしませんか?

「このソフト(ゲームを含む)のエフェクトカッコよかったよ!」
「こんな風なアニメーションを作ったのだけどよさそうだったよ」
「この議題についての情報は●●にあるよ」

などなどコメントは何でも構いません☆

Re: エフェクトアニメーション・リッチUIについての情報交換所

Posted: 2010年10月17日(日) 11:27
by Dixq (管理人)
ではまず私から。
私は以前から美しいエフェクトに魅力を感じるタイプでした。
Aerobeatというゲームを作る時、どうすれば魅力的なエフェクトが作れるか考えました。
本格的に自分のゲームにエフェクトを取り入れるのは初めてだったので、
まずは一般的に「美しい」とされているエフェクトを参考にしようと思いました。

そして、ゲーセンをウロウロしていると「ビートマニア16」のメニューやその中身がとてもエフェクトを含めて豪快である事がわかり、これを真似する事にしました。

メニュー
[BBvideo 425,350][/BBvideo]

ロゴの演出
[BBvideo 425,350][/BBvideo]

まず自分が美しいと思った演出を真似る事にしましたが、
どうも自作では限界があり、本格的な事をしようとするとAfterEffectなどのソフトで作った方がよさそうな印象ではありました。
まだAfterEffectは15万・・と高いので手が出ていませんが;いつか使ってみたいと思っています。

エフェクトやUIについての情報もしあればコメント頂けると幸いです^^

Re: エフェクトアニメーション・リッチUIについての情報交換所

Posted: 2010年10月17日(日) 12:26
by Ciel
お疲れ様です。参加させていただきます!

私も綺麗なエフェクトは好きです。特にパーティクル系が。
今色々DirectXを直接いじりながら、色々やってるんですが、
なかなか思い通りのものができません><
大分前に文字を光らせるエフェクト↓作ってみたのですが、何か違和感があります。
ただのマスクですけどねw

[BBvideo 425,350]http://www.nicovideo.jp/watch/sm12050784[/BBvideo]
これは、DirectXのステンシルテストを使って、表現しています。

もっと違和感がなく、ロマンシングサガみたいなエフェクトが出来ればいいなーと思っています。

エフェクトって難しいですよね。
どういう画像を使ってどう動かせばこういうエフェクトが出来る
というような知識が必要ですね。。

#ニコ動の外部リンクタグって貼れないようですね;

Re: エフェクトアニメーション・リッチUIについての情報交換所

Posted: 2010年10月17日(日) 13:10
by Dixq (管理人)
ご参加ありがとうございます!
私も最近GLを使ったパーティクル系のプログラムをいじってます。
しかし綺麗に見せるにはなかなか工夫が必要ですね;

マスク良いと思いますが、違和感あります?
Aerobeatも全く同じ要領で文字を光らせてます。

[BBvideo 425,350]http://www.nicovideo.jp/watch/sm12458317[/BBvideo]
もし改善するのであれば
今は、左から光が入る時、マスクの左座標と文字の左座標が重なっている?為か突然光が入っているように見える気がします。そこを修正するか、マスクのグラデーションをもっと広くするとかでしょうか。

ニコ動のプレイヤーは使えないとこ多いですよね^^;

Re: エフェクトアニメーション・リッチUIについての情報交換所

Posted: 2010年10月17日(日) 13:28
by Ciel
キューさんありがとうございます^^

実はそのAerobeatを参考にして作ったんですw

確かに光が入る位置がちょっと文字の位置と重なっちゃってますね。。
マスクのグラデーションを広くしないと、裏で球が動いてるだけのように見えちゃいますよね。。
アドバイスありがとうございます^^

それにしてもやっぱりAerobeatのメニュー画面とか曲選択画面とかすごいですね~
かっこいいです!

Re: エフェクトアニメーション・リッチUIについての情報交換所

Posted: 2010年10月17日(日) 14:06
by Dixq (管理人)
おや、そうだったんですか^^;
私は何を参考にしたんだったかな・・。
とにかくあらゆるものがパクリの結晶です(笑

綺麗なエフェクトを見ると真似したくなるんですよね~。
FF13のメニュー画面はあれこそ「無駄に」綺麗だったなぁ・・w
しかし私全然ゲームやらない人間なんですよね。
沢山ゲームをやって色んなエフェクトを見たいんですが、なかなか時間が・・。

Re: エフェクトアニメーション・リッチUIについての情報交換所

Posted: 2010年10月18日(月) 01:54
by Justy
>効果的・効率的なエフェクト
 普通に考えるなら汎用化でしょうか。
 全て毎回一からプログラムを書いていたら手間がかかってしょうがないので、ある程度簡単なものならパラメータの変更だけで表現できるように作っておけば、エフェクトの量産も可能になります。
 ツール化されていれば非プログラマでも作れますしね。

 もちろん一から作らなければならない複雑なものもあるので全てにおいて汎用的にできるわけではありませんけど。


>リッチUI
 いろいろあるのでケースを特定しないと、ところがあるのですが。
 普通のメニューとかならレイアウトやオブジェクトの動きをデータファイル・スクリプトで定義しておいて、プログラム側で操作に合わせて呼び出すレベルで十分だとと思います。


>本格的な事をしようとするとAfterEffectなどのソフト
 そうですね、動的に状況に応じて変化させることが無い静的なもののであれば Pr/AE等で動画にしたり、Mayaとか Maxとかで動きをデータ化するのが一番いいでしょうね。

Re: エフェクトアニメーション・リッチUIについての情報交換所

Posted: 2010年10月18日(月) 19:21
by Dixq (管理人)
> 普通に考えるなら汎用化でしょうか。

あ~なるほど。
効率を突き詰めるとスクリプトとスクリプトを動かすものに分かれそうですね。
さしあたりまだ3Dで滝や爆発、炎などを作ったことが無いので、
パーティクルエフェクトも含めて勉強してみようと思います♪

>リッチUI

何か画期的なUIを作ってみたいんですよね。
・・といっても世界中の技術者たちが毎日斬新なUIは無いか考えているんでしょうから難しい所ですよね;

まぁ新しい操作方法は必要ないにしても見た目で(美しさや表現の面で)「ワァ」と思わせるような物を作ってみたいのです。
Macや最近のUbuntuなんかエフェクトがきれいなのでそういうの参考にしてもいいかもしれませんね。

Re: エフェクトアニメーション・リッチUIについての情報交換所

Posted: 2010年10月18日(月) 23:00
by 釣り師
>FF13のメニュー画面はあれこそ「無駄に」綺麗だったなぁ・・w
各種魔法もやたらと綺麗でしたね。ガ魔法で盛大にw

エフェクト以前に絵がかけるかどうかw

Re: エフェクトアニメーション・リッチUIについての情報交換所

Posted: 2010年11月23日(火) 21:50
by Ultimate
皆さんはどんなツール使っていますか?

僕はGIMPを使ってます。

一応展示もしてるのでよかったら感想もほしいです。
グラフィック