こんな感じのアニメーションパターンを画像で用意するとこで、目パチとかできるようになりました(v2.07)
部分的な簡易アニメーションができます。

↓ クリックでゲームスタート


アニメーション機能の具体的な使い方は GitHub を参照してください。
2021年にアルフォンス・ミュシャの絵の構図でダンバイン「シーラ・ラパーナ」を描きました。
その時の絵を先日 AI様 に修正してもらったら、ハイレベルな絵になってビビりました。
AI しゅごい。。。

そんな訳でミュシャ構図「シーラ・ラパーナ」第2弾
AI様に作ってもらいました。なかなか指示を聞いてくれず苦労しました。。。
ミュシャ”四芸術”からダンスをチョイス。 ミュシャの絵、好きなんですよね(*1)
あと個人的に シーラ・ラパーナのキャラも好きw
基本的に、湖川友謙のキャラが大好きなんです!(*2)

理想通りの絵が出てきました (^o^)
AI 凄すぎて、恐ろしいです。
そして、せっかくなのでブロックゲーム化しました (`・ω・´)ゞ
↓ 画像クリックでゲームに移動します。

(*1) アール・ヌーヴォーイラストも良いのですが、特に晩年の「スラブ叙事詩」が好きですね。現物を見たことがあるのですが、絵の迫力に震えました。
(*2) 顔の造形がしっかりしていて大好きです。余談ですが下記本がおすすめです(大昔の本なので廃版になってるかもですが)

脱衣ブロック崩し 重ね着バージョン のプログラムにミスがあったので直しました(ver2.06)
環境によっては最初のステージをクリアした際に、次のステージに画面が切り替わりませんでした m(_ _)m
あとは、ブロック化されていない「服の欠片」がゲーム中残ってしまっていたので、ボールが通過することで「服の欠片」を消すようにしています(ver2.05)

重ね着バージョン では、最初のステージをクリアした際に、連続で 次のステージのゲームが始まります。

最初のステージをクリアした際に、次のゲームのスタート待ち画面に移動する設定を追加しました(ver2.06a)
html 記載の BLOCK_NEXT_STAGE_START_SCREEN オプションになります。

詳細は GitHub README を見てください。プログラムのダウンロードも GitHub からできます。
GitHub
BakuretuKen/Bakuretu-Block2
「爆裂ブロック崩し 重ね着バージョン」ページでサンプルゲームを遊べます。
大昔の 1998~2002年 に、エネルギーあふれるハイテンションな日記を書いていた。
【Internet Archive 】新世紀不定期日記 ~潔く カッコ良く 生きて行こう~
今見ると、複雑な気持ちになる。
私の尊敬する 岡田あーみん先生 や 鴨川つばめ先生 もこういう気持ちになるのだろうか?
先日の「脱衣ブロック崩し 重ね着バージョン 作成しました」 記事投稿時に当時の日記のノリで書こうとして、全く書けなかった。
エネルギーもテンションも不足している。これが歳を取るということだろう。
学成り難し である。
そこで全ての当時の日記をサルベージして、AI に学習させた。
これでいつでも当時のテンションで日記が生成できるはずだ。
メカ爆裂健 の誕生である。
事実を数行渡して、ブロック崩し作成時の「AI によるウソ日記」を書かせてみる。

| 焼肉と二画面の覇道 友人 The Shioemons と焼肉屋「安々」へ 今宵、我々は“肉”という名のエネルギー補給ポイントに突入。網の上でジュウジュウ鳴るカルビは、もはや効果音付き必殺技。 爆裂健「これが……“焼肉奥義・脂の呼吸 壱ノ型”……!」 The Shioemons「うるさい、早く焼け」 ロマンはいつだって現実に叩き落とされる。だがそれでいい! ブロック崩し、二画面化の啓示 肉でHPが回復したところで、The Shioemons が急に預言者モードに入る。 The Shioemons「ブロック崩し、2画面に改造した方が良い」 爆裂健「なにぃ!? 2画面だと!? それはつまり……“ファイナルフュージョン承認!”的なアレか!!」 ゲームが増えるんじゃない、世界が増えるんだよ!! 改造!そしてリリース! 帰宅後、即・改造開始。脳内BGMは熱血アニメの主題歌、指はキーボード上で超絶コンボ。 「右画面で崩し、左画面でも崩す」──その狂気と快感、もはや修行僧の悟り。 そして実装に入ると突然あらゆる変数が反乱を起こす。ダースベーダーも真っ青。 なぜだ。ブロック崩しはブロックを崩すゲームであって、心を崩すゲームではないはずだ。 そして完成。二画面ブロック崩し、リリース! 任務完了。めでたし、めでたし。 |
2014年作成の「爆裂ブロック崩し」の JavaScript版 の新バージョンを公開しました。
大昔の Java Applet 同様、ブロックゲームが2段階になりました!

※ 画像クリックでゲームスタート


・設定で「重ね着バージョン(2段階)」と「通常バージョン(1段階)」を設定できるようにしました
・ライフ(残機)を設定できるようにしました
詳細は「ブロック崩しページ」を更新していますので、そちらを見てください。

最初にこのゲームを作った2014年のころは、enchant.js はまだ使っている人多かったのに、2025年12月の今となっては、完全に過去のゲームエンジンになってしまいました。。。(開発も止まっちゃったみたい)
10年がすぐ経ってしまって悲しい。。。
AI画像生成の進化が止まらない。特に「Gemini 2.5 Flash Image」の 一貫したキャラクターデザイン(Consistent character design) がすごい。
イラストをそのままに服だけを変更できる! まさにゲーム画像用の機能としか思えないw
そうなわけで作ってみました。
↓ 画像クリックでゲーム開始




大昔の自分のホームページ から「ビスケたん」画像を持ってきます。

これを AI様に添削をお願い すると、別物になって帰ってきます

(さすがの AI も頭の上にビスケットが載っているキャラは、学習していない模様w)
あとは、Gemini 2.5 Flash Image 様に頼んで、水着にしてもらいます。
服以外の変更がないのがすごい。

あとは最初の画像から服の切り抜き

ゲームが完成です。

すぐゲームができました。平成の世では考えられない速さです。

2014年08月24日 に作成した「JavaScript 脱衣ブロック崩し」を、バージョンアップしました。
11年ぶりのバーションアップです。
当時小学1年生だった子が、高校卒業しています。マンモスびっくりです。
(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 からダウンロードしてください。
改造等自由に行ってください(MITライセンス)

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


なんか、使用しているゲームエンジンの enchant.js の公式サイトが消えていた。
当時結構人気があった JavaScriptゲームエンジン だったのに。。。
悲しい。。。
これが、11年の重みか。。。
そういえばこのプロック崩し作った当時は「平成」でした。

仕事で使おうと Apple Pencil 買った流れで、勢いでイラスト描いて見ましたが、更に勢いで「爆裂ブロック崩し」を作ってみようと計画。

手は難しかったので諦めました (´・ω・`)
下書きはできたので暇を見つけて色塗ります。適当に。。。