はじめに
スプライトオブジェクトを作る際にフレーム数が多いと
フレーム用の画像をひとつひとつ読み込むのは面倒ですよね
そんな時、一枚の画像から一括でインポートできると手間が省けて時短もできます
今回はPiskelを使って、スプライトシートからアニメーションフレームを一括でインポートする方法をご紹介します。
行程1:画像を用意する
まず、Piskelや外部エディターでスプライトに使う画像を用意します。
1枚の画像にすべてのアニメーションフレームを並べるのですが
必ず均等に並べてください。
見本では3×3の9フレームの画像ですが、配置が均等であれば特に決まりはありませんので
並び方は「1×11」でも、「13×2」でも問題ありません。
アニメーションのフレーム数に合わせて調整してください。
行程2:Piskelを開く
新規オブジェクト追加でスプライトを作成したら、編集画面でPiskelを開きます。
行程3:スプライトシートのインポート
右にあるフォルダアイコンをクリックして画像ファイルをインポートします。
行程4:フレームのサイズを設定
見本では48×48の画像を9分割しています。
48÷3=16ですので、16×16に設定します。
必ずしもフレームの形状が正方形である必要はありませんが、すべてのフレームのサイズが揃っている必要があります。
行程5:微調整する
プレビューを参考にしながら余白をトリミングするなど微調整を行います
行程6:完成！
必要に応じてポイント、衝突マスク、再生速度などを編集して保存します
おわりに
グラフィックエディタで画像を用意するほかに
Spriterなどのスプライトアニメエディタを使った場合でもスプライトシートにエクスポートすればPiskelで一括インポートできます。
どうでしょう。これで手間を省いて時短できるとおもいますので、フレーム数の多いスプライトにぜひご利用ください👍
cratier-gd.blogspot.com
投稿
これは便利すぎますね！😍
返信削除ですよねー！
返信削除私はアニメフレームを読み込むときは基本的にこの方法を使っています。
GDevelopには他にも便利な機能がまだまだありますので、今後紹介していきたいとおもいます！