Unity仮面が教える! ラクしてゲームを作るためのAssetStore超活用術

Track.1 ファーストコンタクト ~Playmaker編

仮面:ダァす!Unity仮面だ!

秋山:こんにちは、編集の秋山です。あのー、Unity仮面さん、私ゲーム作りたいんですけど。

仮面:いきなりだな。普通はこういうとき前置きを説明するのだ……。まあいい、アキヤマよ。それでUnityでどんなゲームが作りたいのだ?

秋山:うーん、あんまりよくわからないんですよね。

仮面:...(遠い目)貴様……作りたいものがないのに、軽々しく作りたいとかいうなー!!

秋山:まあいいじゃないですか、それは、おいおい考えるとして。

仮面:はあはあ……それでいいのか……?

秋山:えーと。それで、どうすればいいんですか?

仮面:じゃあまず、Asset Storeを…。ってアキヤマ! Unityインストールしてないじゃないかっ!

秋山:はい。そこからお願いします。

仮面;そこからか……(白目)

Unityダウンロードの説明

Unityのダウンロード
画像

いきなりハイテンションで始まりましたね。さて、Unityのインストールですが、とりあえず、ココのサイトから最新版Unityのインストーラーをダウンロードできます。

ダウンロードを完了したらダブルクリックでインストールが始まります。ライセンス使用許諾を読んで、インストールしていきましょう。途中でアカウントも聞かれますが、名前、メールアドレス、パスワードを入力して、アカウントを作ってください。

インストールが完了したら、早速Unityを起動してみましょう。最初にライセンスの種類を聞かれますが、個人開発の方は「Activate the free version of Unity」をチェックして進めてください。

秋山:はい、起動しましたよ、Unity仮面さん。

仮面:よしアキヤマ。じゃあUnityの操作をざっと説明していく。

秋山:はい、でも私、あんまりプログラムとかわからないですよ。

仮面:大丈夫だアキヤマ。Unityはな……。

秋山:はい。

仮面:(クワッ)プログラムを書けなくてもなんとかなる! 最初はな(小声)

秋山:そうなんですか? 安心しました。私、全角と半角の区別がつかないくらいなんですよー。

仮面:そ、それはそれでちゃんと区別しようぜ……。

Unityエディタの説明

Unityエディタ
画像

Unityには5つのビューがあります。いったん見え方を揃えるために右上の「Default」となっている項目を「2 by 3」にしてください。

1.シーンビュー

シーンビューには製作中のゲームの世界(シーン)が表示され、自由な位置・角度から眺めることができます。このビューでゲームの世界を構築していきます。

2.ゲームビュー

実際のゲーム画面が表示されます。上のシーンビューは開発過程で使う画面でものを配置することができますが、ゲームビューはゲームを動かすだけになります。例えばiPhone用ゲームを作る際は、iPhoneでみる画面と同じものがゲームビューに表示されます。

3.ヒエラルキー

シーンに存在するすべてのゲームオブジェクトがこの画面で確認ができます。

4.プロジェクトブラウザ

このゲームに含まれるプログラムやデータすべてがここで確認できます。ファイルシステムと同じですので、エクスプローラーやファインダーからも同じものがみれます。

5.インスペクター

選択されたゲームオブジェクトの属性(Unityではコンポーネントと呼ぶ)が表示され、編集することもできます。どのゲームオブジェクトにも位置、回転、スケールのコンポーネントが存在します。カメラにはカメラの、球なら球表示のコンポーネントがついています。そしてこのコンポーネントを作ることがUnityにおけるプログラミングになります。

ビューに関しては詳しくはこちらをご参照ください。

次にシーンビューでの操作を説明します。このシーンビューでの操作を覚えると、その後の操作が楽になるので、是非ここで覚えてください。

シーンビューでのカメラ操作
画像
1.ゲームオブジェクトへのフォーカス

ゲームビューで(またはヒエラルキーで⁠⁠、なんらかのゲームオブジェクトを選択して、⁠F」キー(Focusの頭文字)を押すことで、そのゲームオブジェクトが中心の位置にカメラが移動します。

2.カメラの角度の操作

Alt(MacはOption)を押しながらドラッグで、カメラが回り込むような動きになります。

3.カメラのズームインズームアウト

マウスホイールを前にするとズームイン、後ろに回すとズームアウトになります。

4.カメラの平行移動

マウスホイールボタンを押しながらドラッグすると、カメラが平行移動します。

シーンビューでは以上の4つの操作でだいたいカメラを操作できます。特に「F」キーによるフォーカス操作は重要なので、覚えてください。

それと念のために補足しますが、Unity仮面はプログラム書けなくてもなんとかなるとか言っていますが、ある程度はプログラムできなくてもなんとかなりますよ、という話です。もちろん、ゲーム作るとなったらプログラミングの知識は必要になりますよ。

仮面:でだ、アキヤマ。Asset Storeというのは知っているか?

秋山:まあだいたいは……。Unityのオンラインショップですよね? 楽天みたいな。

仮面:だぁ! 全然違ーう! Asset Storeというのは、Unityで使うツールとか3Dモデルとかサウンドとか、ゲームに使われるありとあらゆるものが販売されているのだ。

秋山:へー。あ、そういうものなんですか。

仮面:つまりこれを使えば、自分で作らなくてもいいということだ。

秋山:でもそれってズルじゃないですか?

仮面:あ?

秋山:だって人の作ったのをそのまま使ったりしたらパクりですよ。

仮面:アキヤマ、いいか……ひとつ良いことを教えてやる。

秋山:はい、なんですか?

仮面:(クワッ)Asset Store で買ったものはパクり放題だ!

秋山:えええ!!

仮面:自分のゲームに使っていいっていうライセンスなのだよ!

秋山:そうなんですか? なんかステマっぽいやり取りですけど。

Asset Storeの説明

Unity Asset Store
画像

Unity Asset StoreはUnityのメニューから「Window⁠⁠→⁠Asset Store」から開けます。そこにはありとあらゆるツールが販売されています。これらは世界中の開発者が販売しているものです。やろうと思えば、あなた自身も商品を販売することもできます。

商品は様々で、プログラムから、ツール、3Dモデルデータ、アニメーション、サウンド、音楽、エフェクトなどが販売されいます。価格は無料から$100程度(日本円で1万円程度)ですので、気軽に購入することもできます。たまにセールも行われて50%オフもされるので、毎日チェックされることをお勧めします。

Unity仮面も触れていますが、Asset Storeで買った商品はすべて商用利用が可能です。ですので、気に入った商品があれば、是非購入して自分の手間を省いてください。

仮面:そして、今回はその中から超有名アイテムの「Playmaker」を紹介する。

秋山:「ぷれいめいかー⁠⁠?

仮面:これはUnityエディタ上で状態遷移図を使って、プログラミングすることなく、イロイロなオブジェクトの動きを付けられるというものだ。

秋山:「じょうたいせんい⁠⁠?

仮面:分かってない様子だな……。よろしい。アキヤマは自動ドアを知ってるか?

秋山:はい。普通の現代人なら知ってると思いますけど。

仮面:あの人が近づくと開く、という仕組みあるだろう? あれも状態遷移だ。

秋山:え? どういうことですか?

状態遷移の説明

状態遷移図
画像

自動ドアの最初の状態は「Closed⁠⁠。つまり、閉まっているわけ状態です。そこに何か物体を検知したら「Opened」状態に遷移します。そして時間が経って、かつ物体が検知しなかったら「Closed」状態に戻るということです。これらの一連の仕組みを状態遷移といい、上記の図を状態遷移図と言います。

仮面:つまり、Playmakerでこの状態遷移図を作っていけば、3D空間に自動ドアのような仕組みは簡単に作れるということだ。

秋山:へー、じゃあ早速作ってみましょう。

仮面:その前に、まずはAsset StoreでPlaymakerを購入だ。

秋山:えー、お金いるんですか?

仮面:ちょ! おま! このPlaymakerの作者様がどんだけこれを作るために時間を費やしたかわかってんのか!!!

秋山:まあまあ。Unityって無料なので、これも無料かと思っただけですよ。

仮面:はあ、はあ……。まあいい。価格はたったの$90だ(価格はセールによって変わりますので実際のか価格はこちらでご確認ください⁠⁠。

秋山:うーん、ちょっとキツいですねえ……。

仮面:貴様……。

秋山:わかりましたよ、買いますよー。

Asset Storeの購入の説明

状態遷移図
画像 画像 画像
  1. 「Buy」をクリック(ここでUnityアカウントがない場合はアカウントを作り、ログイン⁠⁠。
  2. 「Checkout Now」をクリック。
  3. クレジット情報を入れる。⁠Credit Card Type」はカードの種類、⁠Card Number」はカード番号、⁠Card Security Code」はカード裏面にあるセキュリティコード、⁠Card Expiration Month」⁠Card Expiration Year」はカード期限の月と年、⁠Billing Address」に住所をそれぞれ入力。 またはPaypalを使えるのであれば、⁠Payment Method」「Paypal」に変更。
  4. 「Purchase」をクリック。
  5. 課金処理が正常に終わると、先ほどの「Buy」ボタンが「Download」に変わるので、そのボタンを押しダウンロード。
  6. ダウンロードが終了すると、ウィンドウが出てくるので、右下の「Import」で自分のプロジェクトに持ってくることができます。

秋山:領収書、落ちるのかな……。

仮面:アキヤマ。自腹で行け。

秋山:えーやですよー。

仮面:身銭を切るということは、それだけの覚悟を背負うということだ。

秋山:何、格好いいことを言った気になってるんですか。

仮面:確かに9,000円は安い額ではないが、手が出せない額じゃない。飲み会3回我慢すればいいという金額だからな。

秋山:(……どんだけ安い居酒屋に行ってるの?)

Playmaker

Playmaker
画像

仮面:さて、アキヤマ。ようやくPlaymakerを教える時が来た。

秋山:はい。長かったです。待ちくたびれました。

仮面:お前がUnityをインストールしてないからだろ! ……まあいい。じゃあまずはメニューの「File⁠⁠→⁠New Scene」で新しいシーンから作っていこうか。

秋山:はい、⁠New Scene」と……なんかでますけど。

仮面:それは保存するかどうか聞かれているだけだから、⁠Don't Save」でいい。そうしたら、上の「PlayMaker⁠⁠→⁠PlayMaker Editor」を選択だ。

秋山:はい。あ、なんか出ましたよ。

仮面:「ようこそ」画面はオフにして、それじゃない左上のタブが「playMaker」のウィンドウがPlayMakerエディタだ。ここで状態遷移図を作っていくのだ。

秋山:ああ、さっき自動ドアの例で説明に出てきたアレですね。

仮面:そうアレだ。そうそうPlaymakerのナイスな点として、日本語の表示に切り替えができるという点だ。

秋山:あ、それはイイですね! 私英語はまるっきりできないので!

仮面:切り替える方法は簡単で、Playmaker エディタの右下のタブの「Prefarence」を選択して「Language (beta)」という項目を「English」から「Japanese」に変更すればOKだ(注:最初から日本語になっている場合もあります⁠⁠。

秋山:あ、変わった! これ見やすくていいですね! Unityも日本語のメニューならいいのに。

仮面:まあ、それは言うな。中の人もイロイロ大変なのだ。じゃあ、とりあえず「GameObject⁠⁠→⁠Create Other⁠⁠→⁠Cube」で適当な立方体を出してみよう。

秋山:……「Cube」と。あ、なんか出ましたよ。

仮面:あと、⁠GameObject⁠⁠→⁠Create Other⁠⁠→⁠Directional Light」でライトを点けようか。

秋山:……ライトを、つけまし、たと。

仮面:じゃあ、準備OKということで、Playmaker を操作していこう。

Playmakerで簡単な状態遷移を作ってみる

Playmakerエディタ
画像
  1. まず、状態遷移を付けたいオブジェクトをヒエラルキーかシーンビューで選択します。
  2. そして、Playmakerエディタの左の画面内で、右クリックして「Add State/状態遷移を追加」を選択して、状態遷移を追加します。
  3. 「State 1」が作られます。これを選択して、右の画面で名前を「Initital」に変更しましょう。最初の状態、という意味です。
  4. 同様にもうひとつ状態を作ってみましょう。今度は名前を「Moving」にしましょう。つまり動いている状態を作ったわけですね。
  5. 「Moving」を選択し、⁠Action Browser/アクションブラウザ」をクリックすることで、アクションブラウザが立ち上がります。タブ動かして、適当なウィンドウに当てはめましょう。
  6. アクションブラウザで「Transform」というカテゴリの「Rotate」を選択し、下の「Add Action To State/状態をアクションに追加」をクリックして、アクションを追加します。⁠アクション」というのはその名の通り何らかのアクションを追加します。ここでは「回転」というアクションを追加しました。ちなみにアクションは複数登録することも可能です。
  7. PlaymakerエディタにRotateアクションが付加されます。その中で「Y Angle」「180⁠⁠、⁠Per second」をチェックしてください(つまり1秒間にY軸180度の回転しろ、という意味です⁠⁠。
  8. そして、次は遷移を作ります。⁠Initial」を右クリックし、⁠Add Transision / 遷移を追加⁠⁠→⁠System Events⁠⁠→⁠MOUSE DOWN」を選択すると、遷移が追加されます。これは「マウスを押されれば遷移するよ」という条件です。
  9. すると赤い「!」がつきます。これがあるというのは、何かどこかに間違いがあるということです。今回は「遷移があるけど、矢印で繋がっていない」ということですので、⁠MOUSE DOWN」をクリックして、矢印を「Moving」まで持っていき、そこでもう一度クリックしましょう。それで矢印が繋がり、赤い「!」がなくなるはずです。つまり、これで「初期状態⁠⁠→⁠ボタンを押す⁠⁠→⁠回転する」という一連の状態遷移が完成したということになります。

仮面:さあ、これで一番簡単な状態遷移はできた。さあプレイしてみよう。上の「▶」をクリックしてプレイしてくれ。

秋山:はい、クリックと。あれ? なんか何も出ませんけど。

仮面:あ、そうか。Cubeの位置は原点にしていなかったか。じゃあ一回止めて。

秋山:はい。これをクリックしてと……。

仮面:で、Cubeをヒエラルキーで選択して、インスペクターで一番上の方の「Transform」「Position」をXYZすべてゼロにするのだ。

秋山:はい。しました。

仮面:それでもう一回プレイしてみてくれ。

秋山:あ、四角が今度は真ん中に出ましたよ。

仮面:それをクリックすると……。

秋山:あ、回転した。すごーい、これだけでこんなことできるんですね。

仮面:じゃあ、次のアクションはアキヤマが決めろ。どうしたい? このCubeを。なんでもできるぞ。

秋山:そーですねー、じゃあフリック操作で左右に動かせて、上フリックでジャンプできるようにしてください。

仮面:お、おう……。できるにはできるが……。アキヤマ、モノは相談だが……。

秋山:はい?

仮面:クリックするとジャンプする、程度で手打ちにしてもらえないだろうか。

秋山:はあ……。

Playmakerで簡単な状態遷移を作ってみる(2)

Playmakerエディタ(その2)
画像
  1. ジャンプするということは、物理挙動が必要になりますし、地面が必要になります。というわけで、Cubeに「Component⁠⁠→⁠Physics⁠⁠→⁠Rigidbody」として、物理挙動を付けましょう。それとCubeのちょうど真下に地面のCubeを配置しましょう。
  2. Playmakerエディタで、新たに「Jumping」という状態を作ってください。
  3. そこに「Add Force」というアクションを追加して下さい。パラメータは「Y」「300」(右の「=」記号をクリックすることで編集が可能になります⁠⁠、⁠Force Mode」「Impluse」に変更してください。
  4. 「Moving」に遷移を追加して、先ほどと同様「MOUSE DOWN」の遷移条件で新たに作った「Jumping」に繋げましょう。
  5. 最後に「Jumping」から「Moving」に戻す遷移条件を「FINISHED」にすれば完了です。

仮面:ふう、なんとかできたぞ。って、アキヤマー!! 携帯メールしてる場合か!!

秋山:あ、終わりました? いやだって長いんですもん。

仮面:おのれ~!

秋山:あ、ほんとだ、ジャンプできますねー。こんな短時間で凄いですね!

仮面:お、おう……。

仮面:どうだ!? プログラミングできなくてもそれっぽくはできただろう?

秋山:一応それっぽくなりましたねー。

仮面:感動薄ッ! うすうすだぞ!

秋山:まあ、あんまりゲームっぽくないので。この後はゲーム作るところまで行くんですよね!?

仮面:そうだな。次回はもう少しイロイロなAsset Storeアイテムを紹介していきたいな。それとアキヤマはどんなゲームが作りたいかを決めてこい。

秋山:ああ、そうですね。⁠ハイスコアガール』ってマンガ面白いんですけど、それ読んでると2D格闘ゲームが良いですよね。

仮面:また、そういうハードルが高いことを……。

いかがだったでしょうか? すでにUnityを使っている人にとっては、ちょっと内容が初心者向けだったかもしれません。そういった方々の対象に「One more thing」も用意しています。

おすすめ記事

記事・ニュース一覧