JavaScript 脱衣ブロック崩し バージョンアップしました。

2014年08月24日 に作成した「JavaScript 脱衣ブロック崩し」を、バージョンアップしました。
11年ぶりのバーションアップです。
当時小学1年生だった子が、高校卒業しています。マンモスびっくりです。

JavaScript版「爆裂ブロック崩し」 ページ

バージョンアップ内容

(1)PCでゲームを実行するとゲーム画面が左上になっていました。
あまり気にしてなかったのですが、中央に寄せたほうがどう考えても良いですね。
CSSを書き換えて画面中央に配置しました。

旧バージョン(v0.01) PCでの表示

新バージョン(v0.02) PCでの表示

(2)ゲームクリア時に左上に「RESTART」ボタンが出ていました。
このボタン表示はミスで、押しても何も起きませんでした。
非表示にしました。

旧バージョン(v0.01) ゲームクリア時

新バージョン(v0.02) ゲームクリア時

(3)ゲームの設定をHTMLに移動しました

旧バージョン(v0.01) 

・JavaScript プログラムを編集してゲーム設定を変更する必要がありました

新バージョン(v0.02)

・HTMLの設定項目を編集すればゲーム設定を変更できます

<script>
var BLOCK_GAME_WIDTH = 480; // ゲーム画面幅(ブロック幅の倍数のみ設定可能)
var BLOCK_GAME_HEIGHT = 640; // ゲーム画面高さ(ブロック幅の倍数のみ設定可能)
var BLOCK_GAME_FPS = 24; // フレームレート
var BLOCK_GAME_BALL_SPEED = 10; // ボールの速度
var BLOCK_BAR_MARGIN_BOTTOM = 40; // 画面下からの反射パネルの高さ
var BLOCK_GAME_BLOCK_SIZE = 32; // ブロックのサイズ(16 or 32)
</script>

(4)ダウンロード用プログラムを GitHub に移動しました

GitHub / Bakuretu-Block

プログラムをダウンロードする場合は、GitHub からダウンロードしてください。
改造等自由に行ってください(MITライセンス)

その他

知人が AIイラスト作成のノウハウを公開していたので、せっかくなのでデモゲームを増やしました。

その他2

なんか、使用しているゲームエンジンの enchant.js の公式サイトが消えていた。
当時結構人気があった JavaScriptゲームエンジン だったのに。。。
悲しい。。。
これが、11年の重みか。。。

そういえばこのプロック崩し作った当時は「平成」でした。

JavaScript版「爆裂ブロック崩し」開発しました。

1999年に Java Applet で作った「爆裂ブロック崩し」の JavaScript版(enchant.js)を作成しました!
爆裂BOMBゲーム」に続く、JavaScript (enchant.js) ゲーム第2弾です。スマホのブラウザでも動きます。
パネルの中央に弾を当てた時の「爆裂貫通弾」も実装しました。

まさか、15年くらい前に作った自分のプログラムを、自分で JavaScript に移植するとは思いませんでした。
爆裂ブロック崩しは、当時いろいろな雑誌で取り上げられたりして、作っていて楽しかったし、思い入れのあるプログラムです。

爆裂ブロック JS版 サンプルゲーム
https://bakuretuken.com/block_demo/demo02/

bakuretublock_demo01

スマホでも PC でも動作します。今のところ、Windows Chrome、iPhone Safari のみ動作確認しています。

近日中に、ゲーム画像があれば簡単にゲームが作れるようにプログラムを公開します。
ドキュメントページも作る予定です。

■JavaApplet版との違い

  • 反射パネルを少し大きくしました
  • ボール数を1つにしました。残弾はなくなりました
  • ゲームサイズを (480 x 560) から (480 x 640) に変更
  • ブロックサイズが (16 x 16) から (16 x 16)と(32 x 32)を選べるようになりました

■公開までの残作業

  • ドキュメントページの作成
  • 効果音の追加
  • Android で全画面表示で出来てないので調査&修正
  • 各種ブラウザでの動作テスト

ブロック(服部分)の画像フォーマットが GIF から PNG に変わっただけなので、当時のゲーム画像も使えると思います。
まぁ、もはや当時ゲーム使って頂いた人が、このサイトにお越しになってないとは思いますがw

しかし、たまたま JavaApplet 版の問い合わせメールが来て当時を思い出したり、
週末予定が狂って時間ができたりでなにか作りたくなったりで作ってしまいました。

「15年ぶりだね。」

「ああ間違いない。【爆裂ブロック崩し】だ。」

eva_gendo

という ネタ を当時の友人とやりたいくらいですねwww

ちなみに1999年当時の Applet 版の「爆裂ブロック崩し」のページは、ここ】 です。
懐かしいです。最終更新日が 2003年 ですがw

■ 2014.08.24 追記

「爆裂ブロック崩し」専用紹介ページ作成しました!

ブラウザ爆弾ゲーム バージョンアップしました

久しぶりの更新になります。爆裂健です。
最近暑くて、夏バテ気味です。。。

(今は当時の日記は消してしまいましたが)2000年の頃に「爆裂健ホームページ2」で日記を書いてた時は、どうでもいい話題をほぼ毎日書いていたんですが、さすがに当時のようには行かないですねw

なんか最新版のChromneで「ブラウザ爆弾ゲーム」の効果音が出なくなってしまったので、バージョンアップしました。
サウンド再生周りの処理が今までのやり方で動かなくなったようです。やはり JavaScript と HTML5 で本格的なゲームを作れる時代になりましたが、まだサウンド周りは弱いですね。

さしあたり enchant.js のgame.assets でのサウンドデータの読み込みは行わず、HTML5 Audio でサウンド再生するようにしました。ブラウザによってサポートがまちまちなので、対応していないブラウザの場合は効果音の再生が ON であってもサウンドの再生をあきらめました。

バグや問題等があれば、是非ご連絡くださいませ。。。m(__)m

ブラウザ爆弾ゲーム
BakuretuBomb

ブラウザ爆弾ゲーム Bakuretu Bomb 公開

ブラウザで動作する萌え(?)爆弾ゲーム Bakuretu Bomb が完成したので、公開しました!

爆弾ゲーム Bakuretu Bomb

ブラウザ爆弾ゲーム Bakuretu Bomb

先日知人にネタフリされたやつですw

enchant.js が面白かったので、勉強を兼ねて作成しました。

詳細は 爆弾ゲーム Bakuretu Bomb を見てください。

私はイラストが描けない人なので、もしこれを使ってゲームを公開してくれる絵師の方がいらっしゃると、嬉しい限りです (・∀・)

enchant js でハマった

「最近、10年ぶりくらいにホームページ(ブログ)を始めたよ」と、本ブログを昔からの知人に話したら、

「爆裂健なら、昔みたいに ふざけたミニゲーム を作ってくれよ!」と言われた。

node.js の勉強を兼ねてカードゲームを作ったんだけどなぁ~。
知人はこういう(↓)ネタゲームが好きなようだwww

爆裂ブロック崩し

 

しかし、今更 JavaApplet などでネタゲームを作る訳にはいかない。。。

そんなわけで今度は最近お気に入りの enchant.js で萌系(?)ゲーム制作を開始。
久しぶりに集中して趣味でゲーム(?)プログラムを制作。

で、いきなりハマったw

Surface で作った全画面Spriteの上に別のSpriteを置いたら、上に置いたSpriteの「touchstartイベント」が全画面に反映されてしまった。

小一時間ほどハマって、「これ?encjant.jsの問題では?」という結論に行き着いたので、さしあたり enchant.js を最新版(Ver 0.7.0)にバージョンアップ。(0.6.3 で開発してました)

おお!治った。

でも、違う問題が発生www

今度は、Sprite を複数シーンで使いまわしている部分で、表示されなくなってしまった。

( ゚Д゚) ハァ?

という顔になりながらもデバッグを進めると、原因は私のコードでした。

enchat.js ではゲーム(フレーム)の進行を Game.frame で管理しているようだったので、つい勝手に

game.frame = 0;

てな感じで 0 にして、勝手にタイミング調整に使ってたんですが、これがダメだった模様。
多分、内部のタイミング処理に使ってますね、この変数。。。

思わぬ所で、ハマったわぁ~

でも近々、enchant.js で萌えゲー(?)を公開できそうです。

<ご意見頂きました>

「ブラウザでワンナイト人狼」のリクエストメールを何通か頂いています。
ありがとうございます。

今頂いているご意見で特に多かったのは、以下です。

  1. 最大参加人数を6名に
  2. 議論時間を3分固定ではなく選択できるように
  3. 「狂人」カードの追加
  4. チャット機能

1. 2. は、2013年06月09日 のバージョンアップで対応いたしました。
3. 4. については、ちょっと大変そうなので考えさせてください。

これからも ブラウザでワンナイト人狼 をよろしくお願いします。

enchant.js 簡単すぎてワロタ

最近 JavaScript が面白いので、JavaScript で簡単にブラウザで動くゲームが作れると巷で噂の enchant.js に挑戦。

あっという間にホモォが動いたw

ホモォ

ホモォ – enchant.js
https://bakuretuken.com/enchant/homo.html

これは面白い。enchant.js をつかってゲーム作りたいなぁー
また「やるやる詐欺」になりそうですけど。。。
書いたプログラムは、この程度です。

[javascript]enchant();

var game = new Game(640, 320); // game stage

game.preload(‘img/homo02.png’); // preload image
game.fps = 20;

game.addBear = function(){
var bear = new Sprite(140, 32);
bear.image = game.assets[‘img/homo02.png’];
bear.x = rand(300);
bear.y = rand(300);
bear.frame = [0, 0, 1, 1]; // select sprite frame

bear.tl.moveBy(288, 0, 90) // move right
.scaleTo(-1, 1, 10) // turn left
.moveBy(-288, 0, 90) // move left
.scaleTo(1, 1, 10) // turn right
.loop(); // loop it
game.rootScene.addChild(bear);
};
game.start();

game.tick = 0;
game.rootScene.addEventListener(Event.ENTER_FRAME, function() {
if (game.tick < 1100 && game.tick%80 == 0) game.addBear();
game.tick++;
});

function rand(num)
{
return Math.floor(Math.random()*num);
}[/javascript]