第08回 数字の表示とアニメーション

ダメージの数字を、出現して上へ動き、消えるまでの一つの表示として作ります。まず数字一つを再生し、時間とカーブの変更で読みやすさを比較します。

今回の授業内容

• Canvasへ数字を表示し、生成時に内容と色を渡す
• 表示時間を0〜1へ変換し、移動・拡縮・透明度へ適用する
• 数字を読める時間を保ちながら、用途に合う動きを選ぶ

準備と進め方

第01回で作ったURPプロジェクトを使います。追加するコードは各ステップに全文を掲載しています。この回の専用プロジェクトは配布ファイルで公開状況を確認してください。

1 / 4Canvasと数字の準備画面の中央に数字を表示し、アニメーションの開始位置を決めます。2 / 4数字の生成と一度の再生数字の内容を渡して再生し、表示時間が終わると消える状態を作ります。3 / 4表示時間とカーブの比較一つのカーブを変え、移動の印象と数字を読める時間の関係を確認します。4 / 4用途に応じた数字表示の調整ダメージか回復の表示を選び、意味と読みやすさに合う設定を残します。