2014年09月26日

ゲーム改善の本番 (8) | ユーザーに伝える情報を増やそう(3)

さて、前回はミサイルの残り発射可能数がわかりにくいんじゃないか?って問題を解決!!(した気になってる)

他の問題としては、ミサイルがどこを狙ってるか分かりにくい!
ここが表示の説明不足なので、ミサイルが外れたときに納得いかない人も居るんじゃないかと思います。

ここで、ミサイルが外れても、喜んで納得してもらえる様に、タッチ位置を元にした、レーザーサイトみたいな物を追加して見ようかと思います。
これで、外れても、"お前のせいじゃ、ボケ!!"ってユーザー様に言えますね♪


まず変更する仕様をまとめてみる
レーザーサイトを表示するのはいいんですが、じゃあ、今の仕様で、”いつ”表示できるんだろう?
そう、実は表示するタイミングなんてないんですねぇ〜。タッチした瞬間発射してるから。^^;
なんで、実は、ミサイル発射のタイミングも変えないといけないんですよね。
実際の変更内容はこんな感じ
  • ミサイルの発射を、タッチした瞬間から、タッチが離れた瞬間に変更。
  • タッチされている間、レーザーサイトを表示する。


準備!テクスチャとマテリアル
さて、また自作のテクスチャを作りました。
LaserPointer.png
しょぼい!!
ライトセーバーみたいなイメージだったんですが、全然です。-_-
ま、もともと絵描きの才能ないので、このまま進んで、動きでごまかしますね。
まずインポートですが、タイプは "Texture" で。実は、このテクスチャでUVアニメーションをしようとしてるんで、Wrap Mode は、"Repeat" としておきましょう。
Screen Shot 2014-09-23 at 5.15.19 PM.png

前回の SpriteRenderer だけでなんとかしたかったんですが、ちょっと試してみたら、どうもマテリアルも作っておいた方が便利そうなんで、新規の "LaserPointer" マテリアルをつくりますね。
Screen Shot 2014-09-23 at 3.32.09 PM.png
で、さっきインポートしたテクスチャを設定して、
Screen Shot 2014-09-23 at 3.32.55 PM.png
これで、マテリアルの準備は完了!


新規の "Laser" GameObject を作る!
さて、さっきのマテリアルを使って、 "LaserSite" GameObject を作りましょう!
今回は、"Plane" を新規作成!で、必要ない "Mesh Collider" は削除して、さっきのしょぼいマテリアルを貼ってますね。
Screen Shot 2014-09-24 at 12.16.12 PM.png

で、適当にスケールとかを調整して見た目を良くして...
Screen Shot 2014-09-24 at 11.45.55 AM.png
一応、こんな感じですね。
あとは、これから動きでごまかしましょう!


アニメーションを入れてみる
さて、これまでちょっと避けて来たアニメーションですが、ちょっとこの LaserSite obj で使ってみましょうかね。

まず、初期状態では隠れてる、Animation タブを表示しましょう。
Window -> Animation でタブが開くので
Screen Shot 2014-09-23 at 8.10.02 PM.png
どこかお好みの場所にレイアウトしましょう。
Screen Shot 2014-09-23 at 8.11.56 PM.png
こんな感じでもいいし
NewClip.png
赤丸の所をクリックすると、[Create New Clip] で新規のアニメーションファイルが作成出来るんで、ここから新規クリップを作成。保存場所と名前を設定します。
Screen Shot 2014-09-23 at 8.15.05 PM.png
さて、この [Create New Clip] をクリックした時に選択している GameObject に、新規のアニメーションが関連付けられる様なので、作成前に、ちゃんと選択しておきましょうね。
これが完了したら、アニメーションを管理する、Animator コンポーネントはもう GameObject にくっ付いているみたいですね。
AnimatorComponent.png

で、Animator ビューの AddCurve を選択して、実際のアニメーションを付けていくんですが、
文書で書くと、なんか分かりにくそうなんで、動画にしてみました。
基本は、左上の録画ボタンがアクティブな間は、変更した値が記録される。で、各フレームの各プロパティの値を設定可能。
で、再生ボタンで、アニメーションの確認が可能。
"Delete Keys" してるメニューは、右クリックで、赤いバーを動かしてるのは、マウスの左ボタンホールドね。

で、ちょっと動きが単調なんで、スケールの変化にカーブを付けましょうかね。
カーブの編集も付いてて、便利ですよね。Unity。
"Add Key" の所も右クリック。

これで、一応ベースになるアニメーションデータはできたのかな?


テクスチャのUVアニメーションを入れてみる
これも、さっきのアニメーションで出来るといいなぁ〜、と思ってたんだけど、ちょっと思う様に動かないみたいなんで、スクリプトで流れる様にしちゃいますね。(スケールアニメは一回だけだけど、UVスクロールは永遠に続いてほしい。)

今回は、テクスチャのUVをコントロールしたいので、テクスチャの情報をもっている、MeshRenderer を[SerializeField] で LaserSite からのアクセスを確保してます。
スクリプトはこんな感じ。
Screen Shot 2014-09-24 at 12.31.05 PM.png
MeshRenderer からマテリアルをゲットして、現在の uv 値を取得。それに流したい方向の v 方向に毎フレーム加算して、それをテクスチャの情報として戻してる。
"_MainTex" というのがプロパティ名らしいんだけど、他に何があるのかは、よく知らないんですよね。
なんで、今の所、これを使うとメインのテクスチャの情報がいじれると言う事で。

これで実行してみると....
しょぼいテクスチャの割には、それなりになって来ましたかね?


さて、なんか、アニメーション使ったら、説明も長くなっちゃったんで、実装部分は次回ですわ。

        にほんブログ村 ゲームブログ×PlayNCBlogへ
 初めてみました。よかったらクリックお願いね ♪

これとか読んだらもっと絵上手くかけるのかなぁ〜
posted by やまけん at 10:04| Comment(0) | Unity | このブログの読者になる | 更新情報をチェックする
この記事へのコメント
コメントを書く
お名前:

メールアドレス:

ホームページアドレス:

コメント: