カレンダー
09 | 2017/10 | 11
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30 31 - - - -
カテゴリ
最新記事
月別アーカイブ
アクセスランキング
[ジャンルランキング]
ゲーム
10967位
アクセスランキングを見る>>

[サブジャンルランキング]
その他
1954位
アクセスランキングを見る>>
最新コメント
フリーエリア
にほんブログ村 ゲームブログ ゲーム制作へ
にほんブログ村

スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

各種画像素材追加

格闘ゲーム向けのグラフィック素材各種を載せます。
自作ゲーム用など気軽にお使いください。
(使用される際、報告などは不要です)

 画像形式は背景透過のPNGとなっております。
 2D格闘ツクール向けに使用する場合はBMP形式への変換や
 画像サイズの調整が必要になるので注意してください。


キャラクター 若者A
モーション一覧A
全49種

01.通常立ち
hero_motionA0.png

02.しゃがみ中
hero_motionA22.png

03.しゃがみ
hero_motionA30.png

04.立ち上がり
hero_motionA52.png

05.振り向き立ち
hero_motionA62.png

06.振り向きしゃがみ
hero_motionA72.png

07.前歩き
hero_motionA82.png

08.後歩き
hero_motionA102.png

09.フロントステップ
hero_motionA122.png

10.バックステップ
hero_motionA132.png

11.ジャンプ垂直
hero_motionA143.png

12.空中落下
hero_motionA160.png

13.着地
hero_motionA172.png

14.着地(隙あり)
hero_motionA182.png

15.ジャンプ前
hero_motionA192.png

16.ジャンプ後
hero_motionA222.png

17.空中ダッシュ前
hero_motionA252.png

18.空中ダッシュ後
hero_motionA262.png

19.弱攻撃弾かれ立ち
hero_motionA272.png

20.弱攻撃弾かれしゃがみ
hero_motionA287.png

21.弱攻撃弾かれ空中
hero_motionA302.png

22.強攻撃弾かれ立ち
hero_motionA317.png

23.強攻撃弾かれしゃがみ
hero_motionA332.png

24.強攻撃弾かれ空中
hero_motionA347.png

25.ふっとび
hero_motionA362.png

26.ダウン
hero_motionA385.png

27.ダウン立ち上がり
hero_motionA405.png

28.壁激突
hero_motionA432.png

29.復帰空中
hero_motionA452.png

30.復帰着地
hero_motionA482.png

31.復帰壁
hero_motionA502.png

32.必殺技 気合入れ
hero_motionA527.png

33.ラウンド開始
hero_motionA545.png

34.勝ち
hero_motionA557.png

35.負け
hero_motionA577.png

36.礼
hero_motionA596.png

37.弱攻撃立ち
hero_motionA627.png

38.弱攻撃立ち(近距離)
hero_motionA657.png

39.弱攻撃しゃがみ
hero_motionA677.png

40.弱攻撃空中
hero_motionA692.png

41.弱攻撃踏み込み
hero_motionA706.png

42.強攻撃立ち
hero_motionA727.png

43.強攻撃立ち(近距離)
hero_motionA752.png

44.強攻撃しゃがみ
hero_motionA777.png

45.強攻撃空中
hero_motionA802.png

46.強攻撃踏み込み
hero_motionA827.png

47.弱必殺技
hero_motionA862.png

48.強必殺技
hero_motionA912.png

49.走り
hero_motionA960.png


キャラクター 師匠A
00tuujoutatiA_anim.gif
全34モーション

01.通常立ち
00tuujoutatiA0.png

02.しゃがみ中
motionB (0)

03.しゃがみ
motionB (1)

04.立ち上がり
00tuujoutatiA0.png

05.前歩き
motionB (3)

06.後歩き
motionB (4)

07.フロントステップ
motionB (5)

08.バックステップ
motionB (6)

09.振り向き立ち
motionB (7)

10.振り向きしゃがみ
motionB (8)

11.ジャンプ垂直
motionB (9)

12.空中落下
motionB (10)

13.着地
motionB (11)

14.着地(隙あり)
motionB (12)

15.ジャンプ前
motionB (13)

16.ジャンプ後
motionB (14)

17.ガード弱立ち
motionB (15)

18.ガード弱しゃがみ
motionB (16)

19.ガード強立ち
motionB (17)

20.ガード強しゃがみ
motionB (18)

21.回避立ち
motionB (19)

22.回避しゃがみ
motionB (20)

23.攻撃弾き立ち
motionB (21)

24.攻撃弾きしゃがみ
motionB (22)

25.攻撃弾き空中
motionB (23)

26.攻撃見切り立ち
motionB (24)

27.攻撃見切りしゃがみ
motionB (25)

28.攻撃見切り空中
motionB (26)

29.負け
master_motionB523.png

30.礼
motionB (28)

31.勝ち
motionB (29)

32.カウンターの構えA
motionB (30)

33.前転回避
motionB (31)

34.カウンターの構えB
motionB (32)

35.カウンター攻撃
motionB (33)


その他背景・システムなど
背景 修行場A
BKG_c.png

システム表示 ゲージA
gauge512.png

システム表示 ハートA
heart512.png
スポンサーサイト

Spriterでのアニメ作成

最近掲示板の方でSpriterというアニメ作成ツールを教えていただいたので
これで何か作れないかと試してみました。

リンク→ Sprinter

テスト用に作ってみたGIFアニメです。
spriter_testA.gif
よくわからない動きをしていますが、
このソフトはFlashのようなアニメ作成ツールです。

上手く使えばCloneFighter(自作のキャラグラフィックツール)で
やっていたことができそうです。
今回試したフリー版には機能制限があるのですが、
上手く活用できそうならプロ版を購入するのも有りだと思います。

 似たようなタイプのソフトは色々ありますが、
 お値段的に手ごろだと思います。

ソフトの詳しい使い方について
外国のソフトということもあって言語は英語ですが
「読む」場所はそれほど無いので難しくは無いです。

Spriterの解説サイトにお任せするとして
ここでは格闘ツクール向けにキャラグラフィックを作る場合に
ポイントとなりそうな点を幾つか挙げておきたいと思います。


1.素材の用意について
Spriterでは、指定したフォルダに入れておいた画像1つ1つを素材として読み込みます。
キャラクターのアニメーションを作りたい場合は
手・脚・頭・胴などキャラクターを構成するグラフィックを
部位ごとに分けて用意する必要があります。

 普通にドット絵のキャラ絵を描いてから
 カット&ペストで部位ごとにレイヤーを分けて、
 不足部分を書き足してパーツを作ると良いです。

ポイントはアニメーションで一番よく使いそうな角度を
ベースとしてキャラ絵を描くという点。

また、実際にゲーム画面で使う原寸大の解像度で
パーツを用意するということ。
最終出力時に解像度は調整できるのですが、
拡大・縮小の処理は小さめにしておいた方が
元の絵の雰囲気を残して出力できます。

パーツには透過処理されたPNG画像を使います。
BMPではないので注意です。


2.アンチエイリアスのモード透過有りのPNG画像をメインに使うツールということもあって、
デフォルトではアンチエイリアスがONになっています。
(グラフィックのエッジ部分をぼかす機能だが、ドット絵的にはまずい)

格闘ツクール向けのドット絵を作成したい場合は、
画面上部のメニューから「Modes」を選択、
これを「Pixcel Art Mode」にセットしてください。
こうすることでエッジ部分のぼかしがカットされ
透明/不透明がはっきりと分かれた状態になります。


3.背景色の設定ドット絵でグラフィック素材を用意する時に注意したいのが
メインのグラフィック部分と背景色が混じり合わないよう
背景色を調整するという点。

Sprinterでは、背景の色を
白・黒・灰色・任意の色から選択することができます。
画面上部に4つ並んだ四角のアイコンをクリックすると良いです。


4.出力時のオプション
アニメーションの設定が済んだら、
画面上部メニューの「File」-「Export Animation to PNG/GIF」をクリック。
アニメーションの出力を行います。

解像度倍率の指定
出力設定は4つのブロックに分かれているのですが
右下のエリアで出力する画像の解像度を倍率で指定することができます。
デフォルトでは縦横100%となっているので、
用意したパーツ画像の解像度に合わせて出力されます。

出力するフレームの指定
出力設定の左上エリアでは
アニメーションの中で出力するコマを指定できます。
格闘ゲームらしい溜めなどを重視する場合は
「キーフレームを設定したコマのみ出力」するようにしてください。
ただ、等間隔(短め)で画像を大量に出力しておいて
その中から使う画像を選んだ方がお手軽かもしれません。

グラフィック切り出しのサイズ指定
出力設定の右上エリアでは
グラフィックを切り出す大きさ・範囲を指定できます。
基本的にはデフォルトの指定で問題無いです。
(グラフィックの縦横が画像からはみ出さないようサイズを自動調整)

出力の形式
出力設定画面の左下エリアでは
画像を出力する際のモードを指定できます。

separate number だと、アニメーションを1枚ずつ画像として出力します。
画像はアニメの順にファイル名が連番となって出力されるので
格闘ツクール側の「フォルダ一括読み込み」機能を使う場合に便利です。

sprite strip or sp だと、
アニメーションのコマを縦横指定した列数に
合わせて並べた一覧画像を作成します。
このモードを選んだ時、下に表示されるのが縦横の列数指定です。
これは自動計算されていて、コマ数が25で横の数を5にすると縦は段になります。
格闘ツクールの範囲指定読み込み(通常の画像読み込みモード)で
グラフィックを取り込む場合はこのモードを選択してください。

animated gif だと、
アニメーションをGIFアニメとして出力します。
ツール外でアニメーションを一般公開する場合などは
このモードで簡単にアニメーションを用意することができます。
※ゲーム用というよりは説明・紹介用の出力です。

画像の背景色指定
出力設定画面の左下には2行のオプションがあります。
下の行は作成者の証(ウォーターマーク)を入れる、というもの。
その上の行では出力する画像の背景色を設定できます。
ここをONにすると、ツールの背景色として設定した色が
画像の背景色として出力されます。
OFFの場合はグラフィックのメイン部分以外は透明色になります。

出力される画像はPNG形式なので
格闘ツクールに読み込む際はBMP形式に変換する必要があります。



わからない点など有りましたら
掲示板の方で気軽に質問してください。
私自身もまだソフトの機能を十分に把握できていませんが、
時間を見つけて調べてみたいと思います。

テーマ : ゲーム制作
ジャンル : ゲーム

tag : 格闘ツクール グラフィック アニメ 解説

5つの質問と回答

掲示板であった質問への回答です。
※外国の方向けに翻訳しやすい文章にしています。


質問:
画面の揺れを使用したが、背景が消えました!
絵板で白い下地に黒い色鉛筆で描いたいい加減な背景だからかもしれません。

回答:
背景のグラフィックを作る時は、色の選択に注意する必要があります。
完全な黒色=RGBの値が(0,0,0)のもの は、格闘ツクールに読み込んだ際、
透明色として扱われます。

また、グラフィック読み込み時のオプションによっては
画像の左上端1ドットに塗られている色を透明色として扱います。
この時、グラフィックの中で同じ色で塗られている部分がすべて透明色となります。

そのため、背景グラフィックとして以下のような画像を適当に描いた場合、
背景は何も表示されません。
2015_09_18_BKG1
上のグラフィックは白地に黒(0,0,0)で描いた背景です。
左上1ドットが白なので、白色部分は透明色扱いとなります。
そして、黒色部分も黒(0,0,0)なので透明色扱いとなります。
結果、画面内には何も背景が表示されません。

同じようなグラフィックでも、色を変えた場合は大丈夫です。
下はその例です。
2015_09_18_BKG2
上のグラフィックと似た形ですが、色が変わっています。
この画像の場合、左上の赤色部分が透明色として扱われるので
白色部分はちゃんと読み込まれます。
また、黒で描いていた部分は緑色になっているため
ここも透明色扱いされることはありません。

キャラクターや背景のグラフィックで黒を使いたい時は
RGB値(10,10,10)など、黒に近い色を使うようにしてください。

背景の設定方法について詳しくはこちらのページをご覧ください。
2D格闘ツクール2nd チュートリアル解説008 「ステージ」編集


質問:
パレット機能を使用したが、キャラクターが元々の色に戻りません。

回答:
EB(パレットアニメ・揺らし)機能でキャラクターの色を変えた後、
元の色に戻したい時は再びEB命令を使用します。

設定内容は以下のように「未使用」のままにしておきます。
2015_09_18_EBデフォルト
こうすることで、パレット機能で変えた色をリセットすることができます。

ただし、キャラクターがこの2つ目のEB命令を実行する前に
別の行動をした場合は、色のリセットは行われません。

例1:
空中でパレットアニメさせで、その後で色をリセットする動作の場合。
キャラが色をリセットする前に地面に着地すると、色のリセットは起きません。

例2:
キャラがダメージを受けた時にパレットアニメさせて、その後で色をリセットする動作の場合。
キャラが色をリセットする前に別の攻撃を受けると色のリセットは起きません。
(その後で色リセットの命令が成功すると、ちゃんと色は元に戻ります)

上の例のように、色のリセットが失敗するのが心配な場合は
「通常立ち」や「しゃがみ」、「着地」動作など
よく実行されそうな動作の先頭にEB命令を追加しておくと安心です。
(設定内容は何も変えず、未使用のままにしておきます)

なお、EB(パレットアニメ・揺らし)機能について詳しくは
こちらのページを参考にしてください。
2D格闘ツクール2nd コマンド解説023 「パレットアニメ・揺らし命令」


質問:
必殺技を使用するときカットインを作ってみたくてオブジェクト発生命令を使いました。
キャラクターが移動すると、とんでもない場所から出てしまうので画面XYにチェックしました。
それで解決されたと思ったのに、2pでプレイする時も1pの方の位置で発生しました。

ここで1pと2pの区分という書き込みを見た記憶があります。
探したが、見つけられなかったです....

回答:
あなたの考える通り、こういう時は1P/2Pを判別する処理が役に立ちます。

1P/2Pを判別する処理について、
詳しくは以下のページで説明しているので参考にしてください。
2D格闘ツクール2nd テクニック解説025 「1P/2Pの判別」

分岐処理を上手く使って上手にカットインを表示してください。
必殺技カットイン
必殺技のカットイン。


質問:
実はこの間一生懸命に教えてもらったボタンガード作ることあきらめました。
ガードの途中に、相手方がジャンプしてきてバックアタックしているようなイメージを想像しました。
しかし、現在私の実力では作れませんでした。
あまりにも多いことを作ろうと無理なようです。

回答:
ガードの途中に、相手方がジャンプしてきてバックアタックしているようなイメージ。
確かに難しいと思います。
かっこいい動きを表現する、というだけであれば
ゲーム全体のルール・システムとして作らなくてもよいと思います。
まずは、キャラクター固有の技・演出として表現してみると良いかもしれません。

例えば・・・
見た目はただのパンチ攻撃。
2015_09_18_ガードしないと普通のダメージ
相手にヒットしても普通の小さいダメージを与えるだけです。

しかし、相手にガードされると動きが変化。
2015_09_18_ガードすると背後から攻撃
相手を飛び越えて背後から強い攻撃を当てます。

普通の技として考えると、ちょっとゲームバランス的に強いように思いますが
特別な必殺技の演出の一部としてならこういうものも無理なく表現できます。


質問:
いつもゲームを作る時、スピーディーな時期に完成して早く成果を見たかったです。
それで小学生の時から完成作品がありません。
いつもこんなふうに無理さえしていて疲れてやめるようになります。
今回もそうなっていないだろうか 怖いです。
もとより、最も大きな問題は私の根気ということを知っています。

回答:
形としての完成よりも面白さのことを考えると良いかもしれません。
キャラが画面に出た、歩いた、ジャンプした、
こういった1つ1つの進歩やそれに対する感動がゲームを作る活力になるはずです。
また、作成中のものを人に見せて反応を聞くのも良いかもしれません。

テーマ : ゲーム制作
ジャンル : ゲーム

tag : 格闘ツクール 解説 ゲーム

「空中やられの作り方」と「空中での左右調節」

サイトBBSの方であった質問への回答・解説です。
質問は2つ。



質問1.襲撃後に空中に浮かぶリアクション
空中でのやられ動作設定についてでしょうか。
空中やられのスクリプト
まずはやられのリアクションを用意します。
※これについて詳しくは以下のページを参照してください
格闘ツク-ル・チュートリアル「やられ動作の作成」

リアクションが用意できたら、そのスクリプト内に
「M」座標移動命令 を追加してください。
座標移動命令
移動の設定値は、以下の通りです。
移動X:-0.35 移動Y:-5.32
重力X:0 重力Y:+0.36
実際の値は作製するゲームに合わせて調節してください。

この設定を入れておけば、攻撃を受けたキャラは
少し浮き上がってやられ動作をするようになります。

もう1つ注意点として、
リアクションの割り当ての設定もチェックしておく必要があります。
img20150910_リアクションの割り当て
「地上でのやられ」には「地上のやられ動作」スクリプトを、
「空中でのやられ」には「空中のやられ動作」スクリプトをセットする必要があります。

「空中でのやられ」に「地上でのやられ」をセットしてしまうと、
空中で攻撃を受けたのにキャラは「地上やられ」の動作をとってしまいます。
さらに、地上やられはX方向に移動するだけの動きなので
キャラは少し後ろに下がるだけで空中に浮かんだままになってしまうので
十分に注意してください。



質問2.空中での移動距離の調節
ここでは、キャラがジャンプした後に
空中で落下しながら左右への移動を調節する処理を作成します。

キャラは「ジャンプ垂直」を行った後、
「空中落下」スクリプトを繰り返しながら地面に向かって落下します。
2015_09_10_空中落下のスクリプト
そのため、空中での左右移動を入れるのであれば、このスクリプトに処理を追加すると良いでしょう。

用意する処理は以下の通りです。
2015_09_10_空中落下の条件分岐
処理を繰り返すたびに前後へのキー入力をチェック、
前方向に入力されていれば前方向の移動力をプラス、
後方向に入力されていれば後方向への移動力を大きくします。

 座標移動命令の設定について
 代入ではなく加算モード にしておくことに注意してください。
 こうすることで、空中落下しながら徐々に移動力を変更することができます。

※空中落下のスクリプトで使っている画像命令のWAIT値が大きい場合、
 空中落下スクリプトのループ間隔が長くなります。
 この場合、着地するまでに「空中落下」スクリプトを実行する回数は少なくなるため
 結果として空中で左右移動するチャンスも少なくなります。

 気になる場合は、「空中落下」スクリプト内で使う画像命令のWAIT値を小さめに設定するか
 「条件分岐」「座標移動」のセットを行内に複数用意するとよいです。
 判定のチャンスが増えれば増えるほど、空中での左右移動を細かくコントロールできるようになります。

テーマ : ゲーム制作
ジャンル : ゲーム

tag : 格闘ツクール ゲーム ゲーム制作 解説 講座 質問 格闘ゲーム

Flashでのアニメーション作成

エフェクト_音符A
最近、Flashを使えばエフェクト素材用のグラフィックをより手軽に作れそう、
と思いチャレンジしてみました。

上のFlashファイルはその実験結果です。
実際に作ってみてアニメーション自体は組みやすいのですが、
BMP出力した際、画像圧縮のためかどうしてもぼかしが入ってしまいます。
ドット絵の輪郭・境界部分に背景色がにじんでしまうのです。
ただ、アニメ作成で効率的なのは間違いないので
何かいい方法がないかな~と考え込んでいます。

ちなみに、ホームページの更新頻度が落ちていますが
もうちょっとしたらダークソウル2をクリアできると思うので …
それまで、しばらくはのんびり更新で行きたいと思います。(すいません)

テーマ : 雑記
ジャンル : ブログ

tag : 報告 グラフィック 素材

decoboko.jp

このブログについて

茫然

Author:茫然

カウンター
アルバム
FC2ブログランキング

FC2Blog Ranking

リンク

上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。