Tetorica FM2612 Playground を 作成しました

Tetorica FM2612 Playground を作成しました。

pages
https://kyorohiro.github.io/hello_ymfm_wasm/playground/index.html

itch.io
https://kyorohiro.itch.io/tetorica-fm2612-playground

JavaScript から YM2612 を鳴らして、

FM音源の仕組みを試したり、ゲーム用の音や短い音楽を作ったりできる

ブラウザ上の Playground です。

元々は、

「YM2612 を理解したい」

「ブラウザやゲームから簡単に使えるようにしたい」

という目的で作り始めました。

YM2612 のエミュレーションには ymfm を使用し、

WebAssembly (wasm) 経由でブラウザから動かしています。

最初は単純に、

- YM2612 のレジスタを書き込む

- 音色を設定する

- 音を鳴らす

程度の実験環境でしたが、

作り続けるうちに、

- JavaScript Live Coding

- FM Preset

- PSG

- Sample Playback

- Stream Playback

- Audio Effects

- Parallel FX

- Noise Generator

- liveLoop

- scale / chord

- random / cycle

- control

など、少しずつ機能が増えてきました。

例えば、

setBpm(120);

fm.setPreset(CH2, FM_PRESETS["two-op-bell"]);

liveLoop("lead", async () => {

const notes = scale("E4", "minorPentatonic", 2);

//await nextBeat();

await play(choose(notes), {

channel: CH2,

duration: 0.08,

});

await beat(cycle([0.04, 0.04, 0.08]));

});

[以下より試せます]
https://kyorohiro.github.io/hello_ymfm_wasm/playground/index.html?ex=fx-loop-major

のようなコードを書いて、その場で音を鳴らすことができます。

また、YM2612 だけでは作りにくかった

波、風、雨などの環境音についても、

Noise Generator を追加して試せるようにしました。

[以下より試せます]
https://kyorohiro.github.io/hello_ymfm_wasm/playground/index.html?ex=noise-ocean

ノイズ、フィルター、音量、パンなどを組み合わせて音を作れます。

開発を始めた当初は、

YM2612 そのものを再現して理解することを強く意識していました。

しかし実際に色々な音を作ってみると、

「YM2612 を正確に扱うこと」

と

「ゲームや作品の中で使いやすい音を作ること」

は必ずしも同じではないと感じるようになりました。

現在は YM2612 を中心にしつつ、

FM
PSG
Noise
Sample
FX

などを組み合わせて、

ブラウザ上で音を作って試せる環境として育てています。

Sonic Pi や Gibber、Wavepot など、

コードから音を作る環境を参考にしながら、

普通の JavaScript の書き方をできるだけ残しているのも特徴です。

まだ実験中の部分も多いですが、

FM音源の学習や、ゲーム用サウンドの実験、

短い音楽や環境音の作成などに使えるようにしていきたいと思っています。

[Playground]
https://kyorohiro.github.io/hello_ymfm_wasm/playground/index.html

[Itch.io]
https://kyorohiro.itch.io/tetorica-fm2612-playground

[Code]
https://github.com/kyorohiro/hello_ymfm_wasm/

Tetorica Retro Player を作成しました

Tetorica Retro Player を作成しました。

https://kyorohiro.itch.io/tetorica-retro-player

元々は、昔集めた動画や、ZIPで固めた漫画を、ブラウン管テレビやレトロゲーム機のような雰囲気で再生してみたい。

そんな願望から作り始めたアプリです。

動画や画像を読み込み、

• CRT（ブラウン管）
• PC-98風
• Game Boy風
• Neon
• Lo-Fi Audio
• Radio Mode

などのエフェクトを適用して再生できます。

開発当初はシンプルなレトロフィルターを想定していましたが、作り続けるうちに、

• Comic Viewer
• Recording
• Window Capture
• Chrome Extension
• Audio Effects
• Phosphor Dot

など、多くの機能が追加されました。

特に Phosphor Dot の実装では、CRTシェーダ界隈で有名なモアレ問題にまで到達し、自分でも驚きました。

実際に使い込んでみると、

「正確なブラウン管再現」と
「気持ち良く楽しめること」

は必ずしも同じではなく、レトロな雰囲気を楽しむための道具として考えるようになりました。

AIの支援を受けながら開発したことで、以前なら半年以上かかっていたであろう試行錯誤を短期間で繰り返すことができました。

結果として、

「昔集めたコンテンツを、自分の好きなレトロな見え方で楽しみたい」

という当初の目的は十分に達成できたと思います。

ひとまず Tetorica Retro Player は一区切りとして、次の作品作りへ進もうと思います。

[Code]
https://github.com/kyorohiro/tetorica-retro-player

[Github.io] - PWA Demo

https://kyorohiro.github.io/tetorica-retro-player/

[Itch Page] Desktop and Android and Web  

https://kyorohiro.itch.io/tetorica-retro-player

[Chrome Plugin] Chrome Plugin

https://chromewebstore.google.com/detail/tetorica-retro-player/clnpmlgahomdkphcpcajbemodneoecna

About Demo

The following demo uses material from:

Comic Book + Candy #12 (1963)
Available from ComicBookPlus:
https://comicbookplus.com/?dlid=28525

Big Buck Bunny
https://peach.blender.org/