▼そのUnityの作業、依頼しませんか?
アニメーション

【Unity2D】アニメーションを作って、再生してみよう

UnityでAnimationを使う

以前の【Unity2D】2分でわかる!アニメーションの説明・知っておくべき4つのことの続きです。

実際にアニメーションを作って、作成していきます。

レイアウトは【2 by 3】です。見にくい方は【Unity】効率アップ!レイアウト(Layout)を変更してできる5個の開発画面で【2 by 3】に変更してください

素材を集める

アニメーションに使うスプライト

素材の集め方はさまざまあります。今回はぴぽや倉庫の炎の画像を使わせていただきます。右クリック→保存でダウンロードしてください。

横につながっていますが、切り分けるので安心してください。

関連記事

【まとめ】ゲーム開発で使えるフリー素材<キャラクター・モンスター編

Projectウィンドウに素材を追加する

Projectウィンドウに素材を追加

【さっきダウンロードした素材をProjectウィンドウにドラッグ&ドロップする】

これで先ほどの素材をUnityで使うようにできました。ちなみにこの時点でスプライトと呼ばれる素材データに変わります。

スプライトを切り分ける

Unityでスプライトを切り分ける
Unityでスプライト(画像が1つまとめてあるやつ)を切り分ける方法【Unity】ゲームで使える素材を探しているときに、1つの画像にいくつかの画像が貼り付けてある画像を見たことがありませんか?その切り分け方法をお伝えします。...

スプライトがつながっている場合は行ってください。今回は横につながっているので、切り分ける必要があります。

スプライトを切り分けた後

このように切り分けられていればOKです。

【Fire-Animation-min_0】をSceneビューに設置する

Sceneビューに設置する

【Fire-Animation-min_0をSceneビューにドラッグ&ドロップ】

いままのままではとても小さいですね。大きさを変更します。

大きさを調整する

スプライトの大きさを調節する

【Fire-Animation-min_0選択】→【Inspector】→【Transform】→【Scaleを上のようにする】

Animation Clipを作成する

以前の記事【Unity2D】2分でわかる!アニメーションの説明・知っておくべき4つのことで「Animation Clip」「Animator Controller」「Animator Component」って用語が出てきましたが、実際は「Animation Clip」を作成するだけで、ほとんどの要素は完成です。

●Animation Clipを作成すると

  • Animation Clipが作成される
  • Animator Controllerが作成される
  • Animator ComponentにAnimator Controllerがセットされる
  • アニメーションさせたいオブジェクトにAnimator Componentがアタッチされる

「Animation Clip」を作成するだけで、アニメーションに必要なものが作成されます。ではAnimation Clipを作成していきましょう。

Fire-Animation-min_0を選択してAnimationウィンドウを開く

Animationウィンドウを開く

【Hierarchy】→【Fire-Animation-min_0を選択】→【Window】→【Animation】→【Animation】

アニメーションウィンドウはこんな感じ

こんな感じのものができていればOKです。

【Create】→【Fire】とつけて保存

Animation Clipを作成する

【Animationウィンドウ】→【Create】→【Fireと名前をつけて保存】

これで「Fire」Animation Clipと「Fire」Animator Controllerが作成され、「Fire-Animation-min_0」にAnimator Componentをつけられ、Animator Controllerがセットされています。

次にAnimation Clipの中身を編集していきます。

Animation Clipを編集していく

2Dでのアニメーションは複数枚のスプライトをあわせて、動いているように見せることです。Animation Clipを編集することで「なん秒でなんのスプライトを表示させるか」を設定することができます。

スプライトアニメーションを作る

スプライトアニメーション

【Add Property】→【Sprite Renderer】→【Sprite】→【1秒後のスプライトを削除する】

1秒後のスプライトを削除する理由は、1秒間のアニメーションを作成する理由がないかです。

スプライトを設置する

スプライトを設置する

【Projectウィンドウ】→【好きな時間の部分にスプライトを設置】→【アニメーションを終わらせる時間を選択】→【Add Keyframeをクリック】

ここはセンスです。だんだんと火が激しくなるように設置し、最後に弱くなるようにすると、実際に燃えているようにみえます。

アニメーションを再生してみよう

アニメーションを再生してみよう

【Animationウィンドウの▷で再生できる】

これでアニメーションは完成です。普通にゲームに使ってみてください。

Animator Controllerを使えばいつどのタイピングでAnimation Clipを再生するか設定できる

「Animator Controller」を使えば、ジャンプしたときジャンプのアニメーションを再生するとか、水中にいるときに潜っているアニメーションを再生するとかを指定できます。

ただそれは1つのゲームを通して理解する方が覚えやすいので、他の記事で説明します。

最後に

基本的な流れを知っていれば、あとは応用がききます。アニメーションがあるだけで、ゲームが華やかになりますので、ゲームに使ってみてください。

以上さぎのみや(@saginomiya8)でした。SNSでシェアしてね( ・∇・) 明日からも一生無双でやったりましょう。

Unityサンプルゲーム
【Unity2D&3Dサンプルゲーム】動画よりわかりやすく記事でゲームを作ろう【チュートリアル】【Unity2D&3Dサンプルゲーム・チュートリアル】Unityにおいてのサンプルゲームの作り方が書いてある記事って少ないですよね。そこで当サイトUnishar(ユニシャー)が動画よりわかりやすいサンプルゲームを無料で提供します。...
ABOUT ME
さぎのみや
さぎのみや
超書手。現在はUnityメディア「ユニシャー」の運営とゲーム開発がメインです。Unity、ライティング関係のお仕事お待ちしております。 >>詳しいプロフィール >>Amazonほしいものリスト
【Unity3D】新しいサンプルゲーム(チュートリアル)を作りました!!!
Unity有料サンプルゲーム

「Unityで3Dゲームを本格的に作っていきたい!」という人におすすめのチュートリアルとなっています。

画像のようなゲームの作り方を販売しています。色々と応用できるサンプルゲームとなっています。ぜひ、作ってみてください。

詳細
>>【Unity3Dサンプルゲーム・チュートリアル】「フリスビーを犬に届けよ!」の概要

>>BOOTHでこのチュートリアルを見る

【RT・フォローであなたのスキルが上がる】

シェアフォローする

さぎのみやのモチベが上がる

コンテンツの質が上がる

あなたの能力も上がる

あなたの
Twitterでのシェア

であなたの能力が上がります。

>>さぎのみやのツイッター(@saginomiya8)

 

COMMENT

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

CAPTCHA


このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください