ROみたいなカウンター
少し前、レンタルサーバー上のファイルを整理していた際に、十数年前にブログを始めた頃、サイドバーに設置していた「ROみたいなカウンター」のファイルを偶然発見しました。

このカウンターはFlash+CGIで作られており、訪問者が設定されたページにアクセスすると、ROのキャラクターやモンスターが攻撃を開始し、時にはクリティカルが発生するという仕組みでした。クリティカルの確率はバックエンドから調整でき、最終的に表示されるダメージ数は、サイドの累計訪問者数としてカウントされるという仕様です。2000年代初頭、ROが大流行していた時代には、日本の多くのサイトでこのカウンターを見かけたものです。

私はすでにROをプレイしなくなって久しいですが、このカウンターを見つけた瞬間、当時の思い出が一気に蘇ってきました…。
そして、BlogPet「ココロ」がサービス終了した後、彼女のために残していたサイドバーがずっと空白のままだったこともあり、ブログ「萌え要素」を少しでも取り戻すべく、このFlashカウンターを再び設置しようと思い立ちました。

ご存知のとおり、2021年以降、AdobeはFlash Playerのサポートを完全に終了しました。
そのため、今どのバージョンのGoogle Chromeを使用してもFlashコンテンツを再生することはできません。当然、過去に私が気まぐれで作ったエッチなゲームも完全にアウトです(笑)。
Ruffle-Flash emulatorを入れれば動くかもしれませんが、基本的にはもう見られない時代になってしまいました。

しかし今はAIの時代。
私はJavaScriptやCanvasに関して全くの素人ですが、試行錯誤の根性とChatGPTClaudeGrokの強力なコーディング能力を駆使し、約1週間以上の奮闘の末、ようやくこのカウンターをHTML5+JavaScript版に改造することに成功しました…
さらに、AJAXを用いてWordPressと統合し、ブログの一部として完全に組み込むことができました。さすがAIでした( ̄∇ ̄)

本家と異なる点として、このバージョンではクリティカルや通常攻撃時の効果音を追加し、最後の一撃ではMVPを取った際の演出と音声を再現しました。
ただし、効果音は訪問者がキャラクターをクリックしたときのみ再生される仕様になっています。突然の効果音で驚かせるわけにはいかないので(笑)。
また、キャラクターの待機モーションについても、RO後期にペット育成システムが追加されたらしいので、関連すると思われる2つのモーションも追加してみました。
…とはいえ、私がROを引退した後のアップデートかもしれませんないので、これらのモーションが本当に正しいのかは分かりませんが(・ω・`)
ROみたいなカウンター
MVP獲得時の演出が一番の難関でした。228連休のうち少なくとも2日間はこの部分の修正に費やしました。AIは強力ですが、生成されたコードは必ずしも期待通りに動作するわけではなく、修正すると他の部分に影響が出ることも多かったです。例えば:

「最後の一撃は必ずクリティカルにするにはどうすればいい?」
「待機中のハート、音符、投げキッスの動きをどう調整する?」
「アニメーションのフレーム数を調整して破綻しないようにするには?」

こういった細かい部分を何度も修正するうちに、コードはどんどん長くなり、最終的には1500行を超える巨大なスクリプトになってしまいました。
完全にROの演出を再現できたわけではありませんが、今の形にはとても満足していますw

もちろん、今の時代になって「訪問者数」なんて誰も気にしません。そもそも、あの数字は設定次第でいくらでも増やせるものですからね(笑)。
ですが、ROと融合したこのカウンターには、自分は今でも特別な「儀式感」を感じでいます。これは単なる数字ではなく、訪問者との微妙なインタラクションを生み出す仕組みです。

これこそが、ホームページ時代ならではのこだわり、あるいはロマンなのかもしれませんね。

ではでは。