株式会社ヘキサドライブ | HEXADRIVE

初めまして。今年の4月から東京開発に新卒で入社したプログラマーのゴボウです。

つい先日まで、風邪でのどを破壊されていました。季節の変わり目で気温も急激に下がっているので、皆様も体調にはお気を付けください。

それでは本題に入らせていただきます。皆様はくるくると回るルーレットが止まるとき、どのように止まるのを思い浮かべますか？人生ゲームでは比較的きゅっ、と止まりますが、例えば東京フレンドパークのダーツルーレットのようにだんだん遅くなって止まる、というようなものもご覧になられたことがあると思います。

もしくは、数字や何かのゲージが増えたり減ったりするときにその増え方や減り方が滑らかに早くなって、最後はだんだん遅くなって止まるような演出をご覧になられたことはありませんか？

今回は最初は滑らかに加速して、最後は逆に少しずつゆっくりになって止まるカウントダウンを、UnityのAnimationCurveを使って実装したという話をしたいと思います。

AnimationCurveとはUnityの機能の一つです。キーを設定して、その間が補完されることで連続的な値を扱えるものです。キーフレームアニメーションをイメージするとわかりやすいと思います。時間とともに変化する値などを扱う場合に便利です。Unityでは以下の図のように、インスペクターウィンドウで直接カーブをいじることができます。

インスペクタからなら感覚的にカーブを変更できます。自分でカーブを決めるのにも便利ですが、特にゲームデザイナーさんやアーティストさんと相談しながらカーブをいじるときにグラフとして視覚化されていると説明や調整がしやすいです。

このAnimationCurveでカウントダウンを作るわけですが、今回は原則として加減速の強さがカウントを開始する数字によらないようにするために、AnimationCurveを一つではなく加速と減速に分けます。加速用のAnimationCurveに従って加速して最高速に達したらその速度でカウントを続けます。カウントが一定以下になったら減速用のAnimationCurveに従って減速します。これでカウントを始める数字が大きくなっても加減速が同じように行われます。

ただし、そのままだとカウントする数字が小さく加速が終わる前に減速が始まってしまう場合に計算が破綻してしまいます。そこで加速と減速が重なってしまったらうまいことブレンドするようにしてあげましょう。ついでにブレンドにもAnimationCurveを使ってあげると、ブレンドの仕方もインスペクターで操作できるようになります。

AnimationCurveのグラフは横軸をカウントしている数字の現在の値、縦軸をカウントの速度としてとらえます。

以下のコードは加減速するカウントダウンの例です。あとはインスペクターで各種値を調整してあげればイイ感じの加減速カウントダウンができると思います。

会社でゲーム開発に携わるようになると、他セクションの方と相談する機会が増えます。まだまだ私も勉強中ですが、視覚化したり感覚的に調整できるようにすると相談相手の手間も自分の手間も減らすことができます。私もこれから経験を積んで、ストレスレスに調整できるプログラムを書くようにしていきたいと思います。

では、また次回で。