« 駅からハイキング・桜木町 | トップページ | 中之条ビエンナーレ2015・その3 »

KUNG-FU DUEL

Kungfu_sc01

KUNG-FU DUEL」をプレイ(HTML5)

功夫対決 KUNG-FU DUEL

※ ゲームをプレイするためには、JavaScript が有効になっている必要があります。
(ダイアログが出た場合、「ブロックされているコンテンツを有効に」)

ストーリー

あなたの前に姿を現したのは、老師を闇討ちし病院送りにした、悪の功夫使い「朱伝厳(しゅ でんげん」!
ヤツを倒さない限り、村に平和は訪れない!
老師に伝授された幻の拳法「軍魔拳」を使い、朱伝厳の野望を打ち砕くのだ!

操作方法

  • 敵の頭か体の上をクリック:攻撃を繰り出します。
     (相手が疲労していないと、避けられてしまいます)
  • 敵が攻撃してきた拳をクリック:敵の攻撃を受け止めます。
     (攻撃を受け止めると、相手は疲労していきます)

ルール

画面説明

  • 画面左上の青いバー :自分の体力
  • 画面右上のオレンジのバー :敵の体力

ルール

  • 敵の攻撃を食らい、プレイヤーの体力が0になったら敗北。
  • 敵の頭や体に攻撃を当て、敵の体力を0にしたら勝利。プレイヤーの残り体力に応じボーナス得点。
  • 敵が拳を繰り出してきた時、タイミングよく敵の拳をマウスクリックできれば、攻撃を受け止めダメージを受けません。
  • 敵が元気な時は、攻撃をしても、避けられるか、受け止められる可能性が高いです。
  • 敵の攻撃を受け止め続けると、徐々に相手は疲労していきます(見た目には分かりません)。疲労したと思うタイミングで、攻撃すると、当たりやすいです。
  • 敵の疲労は、こちらの攻撃が当たるか、時間で徐々に回復します。
  • 敵の攻撃を受け止めたり、敵にあめーじを与えると、得点です。
    得点が高くなると、徐々に敵の攻撃が激しくなります。
  • 頭にヒットさせた方が得点やダメージが高いのですが、頭は稀にガードしてくるので当たりにくいです。

備考

HTML5の習作、第二弾の適当ゲームです。

最近、ジャッキーチェンの「蛇拳・酔拳」DVDセットを買って久しぶりに見たら、面白くて…。
その流れで「マトリックス」を見て、やはりその格闘シーン(ネオとモーフィアスの練習戦)で魅了されて…。

それで、カンフーゲームを作ってみたくなったのでした。

このゲームの肝としては…、
通常の格闘ゲームの場合、相手の攻撃は避けるかガードするわけですが、カンフー映画なんかだと、手で受け止めることが多いんですね。で、そういうゲーム性にしてみました。
初見だとちょっと難しいかもしれませんが、わかってくると勝てるようになると思います。まあ、要は「もぐらたたき」なんですけどね。

HTML5での制作に関して…

やっぱり、FLashの倍くらい苦労と時間がかかりますね…。(慣れの問題も大きいですが)

今回のチャレンジは、キャラのアニメーションでした。
前作「Retrocity」では、回転アニメくらいしかしてなかったし、今回でも、頭や腕の繋ぎのアニメは回転や移動だけでOKだったのですが(時々、間接が外れることがありますが、それはご愛嬌で)…今回はどうしてもポーズや表情によって絵を変える必要がありました。

Flashなら、各オブジェクト(頭とか体とか)のタイムラインにキーを打って、絵をそれぞれに設定すれば簡単にできますが、HTML5(JavaScript)でどうやったらいいのか、よく分からず…。

JavaScriptにも、CreateJSというライブラリーに、SpriteSheetというクラスがあって、それが同じような働きをするらしいのですが… 
これがどうも、ブラウザによって動いたり動かなかったりするようなんです!!
実際、参考書のサンプルプログラムも、Chromeでは動くがIEでは動かなかったので、私のプログラムのせいじゃない…。

これじゃ信用ならんと、今回は別の方法を使って無理やりしのぎました。
(実際には、絵ごとにオブジェクトを作って、状況に応じてステージ内と外でオブジェクトの位置を入れ替えてアニメしてるように見せている)

…しかし、これでアニメが多いゲームは作ってられないな…。次はなんとか考えないと。

てな感じで、一応いろんなブラウザでも動くようにはなったと思うのですが…
それでも、Safariではサウンドが遅延するとか、完全には対応し切れてません。
(さらにFire Foxとか、試してないので、動くかどうか未確認)

うーむ、今ひとつ信用できない。ポストFlashを標榜するなら、しっかり共通化してほしいです。
(HTML5自体ではなく、ブラウザ側の問題ですが。)

最後に…

絵が下手なのは、ご勘弁を。
今回は(これもチャレンジで)、紙の下書きなしに、不慣れなタブレットだけで絵を描いてみました。
あと、仕事でもないのにリソースにあまり時間かけるのが嫌で、適当に描いてるところもあります。(言い訳。まあ、絵描きが本職でもないんだけど)

Flashの方では、RPGモドキを作りかけていたのですが、これも絵リソースが必要な段階になってちょっと面倒になり逃げてました…。できるんかな…。

(2015.10.9)

(追記)HTML5の勉強ついでに、CSSも使ってみました。

|

« 駅からハイキング・桜木町 | トップページ | 中之条ビエンナーレ2015・その3 »

Flash」カテゴリの記事

ゲーム」カテゴリの記事

コメント

HTMLというのはグダグダな規格として生まれ、そのグダグダさを内包しつつずっと永らえてきたものなので、今後もずっとグダグダなままで推移するでしょうね。
やはり真っ当な製品を作ろうと思ったら合議制なんかやってたらダメで、一人の人間が強権で以って意思を統一しなきゃいかんのでしょう。

投稿: 深井 | 2015年10月14日 (水) 05時28分

だいぶお答え遅れてしまいました…。

うーむ、HTML5って、そんな感じなんですか…。ますますやる気を無くしますね。
それでも世の中はFlashからHTML5に完全移行するんでしょうか…?
(どちらにせよ、Flashの復権はもう無いとは思いますけどね)

投稿: 適研所長 | 2015年10月23日 (金) 23時49分

主流になるものが現れるかどうかは神ならぬ身には判らないのです。
ゲームはやはりネイティブ環境で動かすべきものなのかもしれません。
もう開き直ってHTML5で記述した上でブラウザを指定してしまうのが手っ取り早いと思います。

投稿: 深井 | 2015年10月28日 (水) 15時54分

コメントを書く



(ウェブ上には掲載しません)


コメントは記事投稿者が公開するまで表示されません。



トラックバック

この記事のトラックバックURL:
http://app.cocolog-nifty.com/t/trackback/533792/62437455

この記事へのトラックバック一覧です: KUNG-FU DUEL:

« 駅からハイキング・桜木町 | トップページ | 中之条ビエンナーレ2015・その3 »