カテゴリー別アーカイブ: Unity

ずんだ餅を転がすアプリをゲーム化し始めた (その3)

だいたい実現したいことは実装したので、細かなネタも含めて解説していきます。  前回からいろいろ実装したあたりを書くべきな気がしましたが、だいぶん忘れたので総集編っぽくゲームを起動してからのネタを記述していきます。

以下、基本的にネタバレしかないので、未プレイの人は、とりあえず遊んでください。
http://hyakuren-soft.sakura.ne.jp/ZundaClicker/

タイトル画面

では、タイトル画面から解説していきます。
最初はこんな感じに、どこにでもありそうな無難なタイトル画面だったのですが、

ZundaClicker_title

「ずんだ餅が降ってくる理由とか意味がわからない。 なんで?」 というコメントをもらったので、プロローグが表示されるようにしました。

ZundaClicker_prologue

プロローグの文章は、時間でスクロールするようになってて、ずんだ餅をなぜ穴に落としているのか、東北ずん子たちは何をしているのか、の説明が表示されます。 30 分くらいで考えた文章としてはいい感じの説明になっていると思います。 なので、遊んで確認して見て下さい
(タイトル文字列の「Zunda Clicker」が背景と重なって読みづらくなったのは気にしないことにしました。  「Zunda Mochi Clicker」じゃないの? ってあたりもです)

ゲーム中の演出

ずんだ餅を食べるずん子

では、東北ずん子のスキルを説明していきます。 このゲーム中では3姉妹とも詰まったずんだ餅を穴に落とすためのスキルを持っているわけですが、ずん子のみ姉妹と違うスキル、そう、ずんだ餅を食べることができる、というスキルを持っています。  その理由は、ずんだ餅を食べる画像素材があったのはずん子のみ、だからです。(見も蓋もないな…)

zzm_taberu01

このスキルがあるがために、ずん子は他の2人よりもスキルが発動しにくくなっています。 それはずん子に実装した処理ルーチンが

ずんだ餅が地面にあれば、そこに移動して食べ始める

ずんだ餅が詰まっていればスキルを発動する

適当に移動したりする

という優先順位になっているからです。
しかも、地面にあるずんだ餅を食べ終わるとずん子は寝ます。 寝てる最中はスキルが発動しないので、なおさらスキルが発動しにくいのです。 スキル、2つもあるのに…。

zzm_utubuse_a

まぁ、気にせずその2つのスキル「ずんだアロー」と「もちもちジャンプ」について説明しましょう。

「ずんだアロー」

文字通り、普通のもちを ずんだ餅に変えてしまう技なわけですが、降ってきてるのは最初から全部ずんだ餅なんですよね。 じゃぁ、このスキルをどう表現すればいいか、そう、簡単です。 普通の餅がなければ召喚すればいいじゃない、ってやつです。

ZundaClicker_shoot

実装としては「ずんだゲート」から餅が出現するようにして、矢が餅に衝突したときに、その餅を消して、新たにずんだ餅を生成するようにしています。 ときどき、生成されたずんだ餅の速度が早すぎて壁を突き抜けることがありますが、物質が変換されてずんだになるレベルのエネルギー量を考えると、それは当然のことだと自分に言い聞かせながら作ってました。 みなさんも、そう理解してくれると助かります。

「もちもちジャンプ」

このずん子が壁の中に入って餅を落とすスキル、これは実は「ずんだアロー」より先に思いつきました。 ずん子にスキルが2つあるのは「もちもちジャンプを実装したけど、ずんだアローを実装しないわけにはいかないよなー」って悩んだ結果です。

ZundaClicker_jump_drop

で、ずん子の足先にずんだ餅や壁との当たり判定のための透明な円があるわけですが、ここだけずんだ餅がない空間ができてます。 上の画像では足先に透明な領域がありますが、「見えるべきは足先ではなくて太ももではないか!」って気づいたので、透明な領域が太ももになるように最新版では調整しなおしました。 自分で気づけてよかったと思っています。

ZundaClipper_mochimochi
修正後

あとは、ずん子がジャンプしたときに茶色の壁を飛び越えて左右端から地面に落ちてしまうことがあったので、ずん子専用の見えない壁「ウォール・ずん子」が配置されています。 この壁のおかげで、ずん子の進撃は防がれているのです。

それから、みなさんお気づきだと思いますが、ずんだ餅に埋もれたずん子がときどきジャンプするのは呼吸をするためです。

ZundaClicker_fall_1 ZundaClicker_fall_2

最後に「もちもちジャンプ」で穴に落ちたずん子がアプリ外に落ちてくるやつ、作る前は「このネタ最高じゃね?!」って思ってたんですけど、作ってみたら案外普通でした。 面白さを作る前に評価するのは難しいですね。

きりたんの「きりたん砲」

パワーアップ前後で威力が全然ちがう「きりたん砲」ですが、最新版では爆発と同時に画面外に飛び散ったずんだ餅をデスクトップに描画するようにしました。

ZundaClicker_bomb_1 ZundaClicker_bomb_2

ずんだクリッカーを起動したまま開発してて、ときどきずんだ餅がデスクトップに飛び散るのを見て「あぁ、動作させてるんだっけ?」って思ったりしました。 現状ではアプリ外に出たずんだ餅ごとにプロセスを起動してるのですが、複数個のずんだ餅を描画する 1つのプロセスを起動する方が負荷が少なかったなー、と反省しています。

それから「きりたん砲」のカットインが「焼き払え!」って感じのポージングなのは大変お気に入りです。

ZundaClicker_cutin_kiritan

イタコの「ずんだ口寄せ」

なんというか「ずんだ口寄せ」っていうスキルの名称だけは決まったけど、どういう演出にすればいいかが全然決まらなかったです。  そのせいか、無難な作りになってしまってちょっと反省です。 ごめんね! でも ZPS (Zunda Per Second) は大きいスキルだから許してね!

ZundaClicker_itako_kuchiyose

クリア後のずんだ餅の登録

ZundaClicker_donate

登録のボタンを押すと、本当に貯めている数だけのずんだ餅が落ちてくるようにしました。  なので、登録するずんだ餅の個数が多い場合は延々とずんだ餅が落ちてきます。 それを見てると変な笑いがこみ上げてくるから不思議です。

それから、左下のずん子は固定せずに山盛りずんだ餅の中腹に配置して、落ちてくるずんだ餅に流されるように変更しました。 いい感じです。

ZundaClicker_mount_ticket

後から見なおしても、この処理を実装するときに作ったチケット(ソフトウェア作成タスクを管理するもの)は、意味不明な方に属すると思います。  (アプリ自体はネタを追い求めてますけど、ソフトウェアの開発自体は真面目にやらないと動作しないのでちゃんと管理してるのです)

さいごに

作ってて楽しかった。
ありがとう。

やる気になったら登録されたずんだ餅の個数をグラフ化するあたりを作ります。

ずんだ餅を転がすアプリをゲーム化し始めた (その2)

前回までで、

ZundaRolling_sisters

こんな感じだったアプリをゲーム化するべく実装を行っていった。 今回も淡々と何をやったか紹介します。 興味があればソースコードを見てもらえればと思います。

で、基本的にネタバレの嵐なので、まだ「ずんだ餅クリッカー」で遊んでない方はご注意ください!

スキル「きりたん砲」の実装

ずんだ餅が詰まったときに、きりたんが「きりたん砲」を撃って詰まりを解消したら面白いんじゃね? と思ったのがきっかけです。  「面白いかも! って思ったら作ってみる」が、今回の合言葉です。

ZundaRolling_kiritan_hou
まずは、きりたんが穴の下に移動し、きりたん砲を撃つポーズを取るようにしました。

ZundaRolling_fire_1
次に、 Detonator Explosion Framework を適用しました。

ZundaRolling_fire_2
なかなかいい感じだと思います。 実際には爆風エフェクトが Sprite2D より手前に表示されたり奥に表示されたりして、それの修正に時間がかかっています。 結局 Detonator 側の C# スクリプト内に Renderer の layerSortingName を設定するコードを追記して解決しました。

ZundaClicker_explode
このスクリーンショットなどは、姉たちが寝ているなかで「きりたん砲」をぶっぱなす感じが気に入っています。

ZundaClicker_cotinuous

つぎに、爆風だけだと微妙なので、Rigidbody2D を適用した透明なアセットを用意して爆風と同時に穴の下から上に移動する速度を設定して配置しました。 これで、爆風と同時にずんだ餅が微妙に飛び散って詰まりが解消されました。

で、連続で「きりたん砲」を撃ち続けると、餅が飛び散って積み上がってしまい、ずんだ餅が落ち続けてしまうのが確認できました。 これに対処するために、地面に落ちたずんだ餅はずん子に食べさせることにする決心をしました。 よろしくね、ずん子ちゃん。

ZundaClicker_cutin_kiritan

次に、カットインを作成しました。 「きりたん砲」を使う前に表示することにしました。 このカットインの背景素材も「ぴぽや」のものを利用しています。 いい感じです。

あ、このあたりのキャラクターが移動したり砲撃するあたりの処理はコルーチンで実現しています。 わぁい、コルーチン。 私、コルーチン大好き!

ZundaClicker_cutin_zunda_arrow
次に、ずんだアローのカットインだけ先に作ってみました。

ZundaClicker_giridan_hou
で、カットインの表示が重なると「ぎりだん砲ー」になるのが確認できました。 スキル発動は同時に起きないようにする必要があるのがわかりました。

ZundaClicker_zundamochi_oishiiyo
あとは、ノリと勢いだけでずんだ餅のカットインも作りました。 いい感じです。

ZundaClicker_dropped_eating
地面に落ちたずんだ餅を食べるあたりを、いろいろどうにかして実装したときのスクリーンショットです。(たしか

zunda_loop
それから、そろそろ紹介ページでも作るか、って思ってて作った悪循環コラがこれです。 インパクトが不足しているのでボツにしました。

ZundaClicker_jump_drop
スキル「もちもちジャンプ」を実装したり。

ZundaClicker_title
タイトル画面を作ってみたり。

ZundaClicker_itako_kuchiyose
スキル「ずんだ口寄せ」を実装したり。

ZundaClicker_english_logo
タイトル画面にロゴを適用したり。

ZundaClicker_shootZundaClicker_hitどういう実装にするか決まらなかった「ずんだアロー」を実装したり。

ZundaClicker_skill_cooldown
スキル発動までのクールダウン時間を表示するためのアイコンを右側に配置したり。

とかをしました。
まだまだ完成じゃないので、引き続き実装してます。

つづく!

このアプリのソースコードは、下記プロジェクトで管理されています。
https://bitbucket.org/satofumi/zunda_clicker

 

ずんだ餅を転がすアプリをゲーム化し始めた

以前に作ったずんだ餅を落とす脱穀機シミュレータを、ちゃんと Google Play とかでリリースすべく作り込みを始めた。 淡々と変更する様子のスクリーンショットを貼り付けながら、何を変更したのか簡単に書き出していく。

ZundaRolling_zps
ずんだ餅が落ちる速度 zps (Zunda Per Second) を表示するようにした。

ZundRolling_dropped_per_click
クリックしてない間に落ちるずんだ餅の数を表示するようにした。(右下)

ZundaRolling_background
背景画像を適用した。 草原だとずんだ餅の色と同じなので雪原にした。
(素材は東北ずん子のもの以外は「ぴぽや」の物を使ってる。

ZundaRolling_hole

ずんだ餅が画面下まで落ちていくのは違和感があったので、穴を描画してそこにずんだ餅が落ちるかのような表現にした。
穴の画像と、穴の下部分の画像を用意して実現した。

hole
穴の画像。これを左右に伸ばして使ってます。

hole_front
↑ここに穴の下の部分が白色で、それ以外が透明な画像があります。(見えませんが

ZundaRolling_zunko_import
次に、キャラクターを配置しようとして東北ずん子ちゃんの画像を取り込んだ。
取り込んだら、ちょうど足が穴にはまっていて吹いた。

ZundaRolling_sisters
他の姉妹も配置した。
あと、ここまでで Anrdoid の加速度情報でもタップしたのと同じ操作になるようにしたり、ハイスコア相当の値がゲームの起動をまたいでも保持されるようにした。

今後の予定としては「ずんだ餅を 1,000 個ほど落とそう!」とかの実績を追加したり、キャラクターが動作するあたりを実装しようと思う。

タイトル画面を用意するかは、悩み中。

このアプリのソースコードは、下記プロジェクトで管理されています。
https://bitbucket.org/satofumi/zunda_clicker

Unity の Window を透過させてみた

今回は Win32 API を呼び出して Unity アプリを実行させるウィンドウを透過させてみました。

作ろうとしたもの

Unity で exe ファイルを生成して、実行するとウィンドウ枠がなくなって、ウィンドウ背景も透過するようなものを作ろうとした。 最終的に、デスクトップマスコットとして動作させようとした。

途中経過

このフォーラム中のソースコードを書き写し、Query ちゃんと Cube とを配置して実行してみた。
http://answers.unity3d.com/questions/869378/viewing-desktop-in-scene.html

できたもの

こういう風にモデルを配置して
HowIsTheProgress_unity

実行すると、こんな風になる。
HowIsTheProgress_exec

 

感想、今後の予定

現状では、こんなふうに背景もモデルも関係なく透過しているので、個々の Win32 API の機能について調べたり、調べなおしたりして対処したい。

今回のソースコードは、下記プロジェクトのリポジトリ中の HowIsTheProgress です。
https://bitbucket.org/satofumi/unity_learning

Unity を使って狙ったところのオブジェクト情報を取得してみた

Grappling Hook でもって、クリックした先にフックを引っ掛けるような動作をさせようとしたときに、自キャラとカーソルの先にあるブロックの情報を取得しようとしてできなかったので、その情報を得るだけのサンプルを作ってみました。

作ろうとしたもの

画面内にブロックをたくさんと自キャラを配置し、自キャラとクリックした位置の先にあるブロックの情報を表示するサンプル。

途中経過

RayCastInformation_blocks

ブロックと自キャラ(緑)を配置した。

RayCastInformation_rays

Game ビューでクリックすると Scene ビューで Debug.DrawRay() の線が描画された。 あ、ここまででブロックには Blocks っていう名前のレイヤーを定義しておいた。

できたもの

動いた。 主なコードは下記の通り。

void Update()
{
  if (Input.GetButtonDown("Fire1"))
  {
     Vector3 direction = Camera.main.ScreenToWorldPoint(Input.mousePosition) - OwnCharacter.transform.position;
     RaycastHit2D hit = Physics2D.Raycast(OwnCharacter.transform.position, direction, Mathf.Infinity, 1 << LayerMask.NameToLayer("Blocks"));
     if (hit)
     {
        Debug.Log(hit.collider);
        Debug.Log(hit.point);
      }

      Debug.DrawRay(OwnCharacter.transform.position, direction, Color.red, 10f);
   }
}

感想、今後の予定

ここまでに勘違いしてたことは

  • Physics2D.RayCast() の2番目の引数は「目的座標」じゃなくて「向き」であるということ。
  • Debug.DrawRay() の内容は Scene ビューにしか表示されないこと。

です。
正しく理解できてよかった。

今回のソースコードは、下記プロジェクトのリポジトリ中の RayCastInformation です。
https://bitbucket.org/satofumi/unity_learning

Unity を使って Grappling Hook を作ろうとしてみた

フックを使って天井にロープをひっかけて移動していくやつ。 今回はそういうのを作ろうとしてみます。

作ろうとしたもの

天井にロープ付フックをひっかけては進み、ひっかけては進みができるサンプル。

途中経過

GlapplingHook_blocks
ブロックを配置した。

GlapplingHook_rope
Hinge Joint を連続でつなげてロープを作った。

GlapplingHook_connected

ロープに自キャラを接続した。

GlapplingHook_fixed

ロープの質量を軽くしたり、自キャラへの重力の影響を変更した。

できたもの

この次に、自キャラとクリックした先の延長線上にあるブロックに新しいロープを作り直す、って処理を実装しようとして失敗した。 自キャラとマウスの先にあるはずのブロックの情報が適切に処理できなかった。 わからん。

感想、今後の予定

よくわからないので、仕切りなおすことにする。
次は、自キャラとクリックした先にあるブロックの情報を取得するサンプルを作ってみようと思う。

今回のソースコードは、下記プロジェクトのリポジトリ中の GlapplingHook です。
https://bitbucket.org/satofumi/unity_learning

Unity の NavMesh を使って目的地まで移動させてみた

障害物を避けながら移動する仕組み NavMesh を試してみた経過を、スクリーンショットに適当なコメントをつけながら紹介します。

作ろうとしたもの

障害物を避けながら移動する何か。

途中経過

MoveToGoal_objects

とりあえず、移動する物体と障害物になる予定のブロックを用意しました。

MoveToGoal_0

障害物はプレハブ化して、ランダムな位置に配置しました。 このスクリーンショットのように、初期位置が他のブロックと重なると場外に落下することがあります。 諸行無常です。

できたもの

MoveToGoal_1 MoveToGoal_2 MoveToGoal_3

で、Nav Mesh を地面に適用し、Nav Mesh Agent を赤い球に適用し、Nav Mesh Obstacle をブロックに適用しました。

で、クリックした位置を指定して SetDestination() を呼び出すと、赤い球がちゃんと動くのが確認できました。

これらのスクリーンショットから移動の様子を読み取るのは不可能だと思いますが、動画を用意するのは

めんどう

なので、このままでよいことにします。

感想、今後の予定

Unity すごい。 C++ で書くと面倒で仕方がない処理が調べながらでも2時間くらいで実装できるの、やっぱりすごいです。

ただ、移動については速度や加速度を調整しないと障害物間際でプルプルしたりします。

今回のソースコードは、下記プロジェクトのリポジトリ中の MoveToGoal です。
https://bitbucket.org/satofumi/unity_learning

 

Unity を使ってずんだ餅が転がるだけのアプリを作ってみた

前回からの間に「よし、ちょっとカッコイイ陣取りゲームを作ろう!」って思った結果、「良い物を作ろうとして進捗が止まる病」にかかっていました。 で、それを指摘されたので原点回帰として適当な Unity アプリを作りました。

作ろうとしたもの

漏斗に粒をたくさん流しこんで眺めるやつの 2D 版を作ろうとしました。

途中経過

とりあえず画像を貼り付けて簡単な説明を書いていきます。

ZundaFunnel_add_prefab

棒とボールを作って配置しました。 isKinematic がそのままの状態で実行してしまい、棒も落ちていく様子を見ることができました。
あ、ボールには画像として「東北ずん子」のサイトにあるずんだ餅を使用しました。
東北ずん子のイラスト、素材のページ: http://zunko.jp/con_illust.html

zzm_zunda

ZundaFunnel_last

ずんだ餅の粒を Prefab 化して、ある点からランダムな方向に発射されるようにしました。 なんというか、それっぽい感じです。

ZundaFunnel_tumaru

それから、出口が狭いと詰まってしまうのが確認できました。

「つまらないアプリじゃないな!」

とか喜んだりしました。

できたもの

ZundaFunnel_continuous

ここまで実装して、

「あ! これ完全に米の脱穀機だ!!」

って思いました。

感想、今後の予定

今回、無事に米の脱穀の様子を表現することに成功したので、次はまた別の何かをしようと思います。 A* アルゴリズムでキャラクタを移動させるのとか作ってみたいです。

今回のソースコードは、下記プロジェクトのリポジトリ中の ZundaFunnel です。
https://bitbucket.org/satofumi/unity_learning

Unity を使って縦シューティングを作ろうとしてみた

前回のジャンプする何かに引き続き、縦スクロールシューティングを作ろうとしました。
で、途中で挫折しましたが、その挫折するまでの経過と挫折した理由を書き出します。

作ろうとしたもの

ゾンビがわらわらと出現するのを、ショットガンで撃つようなゲーム。

zombieshot_idea

主人公を操作できるようにした

主人公のアニメーションを定義して、指でのスライド操作にしたがって動作するようにした。
素材は「ぴぽや」のものを利用した。 http://piposozai.wiki.fc2.com/

zombieshot_animator

ちゃんと調べた結果、前回よりもアニメーションのステートをシンプルに作れた。 調べることが大事なのが再確認できた。

ゾンビを出現させた

zombieshot_zombies

もとは肌色だった村人の絵を Gimp で色を変えてゾンビっぽくした。 で、それを1秒毎に画面中央に配置した結果、ゾンビが出現するたびに外側に押し出されて、ちょっと怖いスクリーンショットになった。 主人公とゾンビの描画の重ねあわせ順が変なのは気にしないことにした。

zombieshot_rotate

あと「Z 軸で回転しない」のチェックを忘れてたせいで、宇宙遊泳な状態になったりもした。

弾が発射されるようにした

ゾンビが画面上の外側から出現するように調整して、弾を一定間隔で自動的に発射するあたりを実装した。 最初は間違えて右側(ゼロ度)の方向に弾を発射するように実装したけど、修正して上(90 度)の方向に発射されるようにした。

zombieshot_bullets5 zombieshot_bullets5_front

作っててワクワクしなくなったので中断した

ここまで作ったときに「次は弾の命中処理、命中後の処理、ゾンビの体力表示か。 判定のあたりはレイヤー使えばいいか、めんどいな…」って思ってそのまま更新しなくなったので、中断することにした。

仕事ではなくて趣味でやってることなので「作ってて楽しい!」 って思っているうちに一気に作るべきだったと思う。 時間をかけると、どうしても作った直後の高揚感は減る。

まとめ

縦シューは、縦シューを好きな人が作ればいいと思った。 私はもっと…、こう…、私しか作らないような意味のわからない何か作ろうと思った。

あと、最初に Unity で作ったのがそれっぽく動いたせいで「よし、ちょっとカッコイイものを作るぜ!」って思ったのもよくなかった。 変にカッコつけようとすると実装は進まない。 カッコつけるのは Lisp だけでいいと思うんだ。 このブログはもっと適当にいろいろ書こうと思う。

ここまでのソースコードは下記プロジェクトの ZombieShot で管理されています。
https://bitbucket.org/satofumi/unity_learning

Unity を使ってジャンプするゲームを作ってみる

Moai SDK は好きだけど情報量が少なくてつらいので、Unity を使ってみることにしました。 まずは、簡単にキャラクタがジャンプしてブロックを登っていくようなゲームにします。

jump_app_720

イメージはこんな感じです。
で、詳しい作り方はそれっぽいサイトに任せることにして、作成途中のスクリーンショットと感想だけ書いていこうと思います。

TapJump_map

ここまでで Prefab 化したブロックを生成するようにした。 最初は手動でブロックを配置しようとしたものの面倒なので C# から生成するようにした。 マップエディタを使っては? という案もあったが学習コストがマップ規模に対して高い気がしたので見送った。
マップの背景とブロックの素材は「ぴぽや」というサイトのものを利用しています。

TapJump_platform

プロ生ちゃんのサイトからキャラクター素材を持ってきて利用した。
http://pronama.azurewebsites.net/pronama/download/

ここまでに Platform Effector 2D とキャラクターのアニメーションまわりとかを設定した。
Platform Effector 2D をブロックごとに適用するとキャラクターがブロックの継ぎ目で立ち止まったりすることが確認できた。 つらい。
なので、Platform Effector 2D は高さが同じブロックに一括で適用されるようにした。

TapJump_goal

画面にラベルを配置したりして、ゴールに触れたらゴールのアニメーションをするようにした。 ゴール直前でジャンプすると、落下しながらピースしたりと諸々の問題はあるけど気にしないことにした。 Web GL 版が、下記ページから遊べます。
http://hyakuren-soft.sakura.ne.jp/TapJump/

Web GL 版で表示を最大化すると画面枠が適切に表示されないのは…、仕様です!
(今、記事を書いてて試してて新たな実装間違いに気づいたけど、気にしないことにします。

この記事で作ったソースコードは、下記プロジェクト中の TapJump 以下にあります。
https://bitbucket.org/satofumi/unity_learning