ドット絵エディタ「EDGE2」、MIDI音楽編集ソフト「Domino」、楽曲などを配布している個人サイトです。

「顔で月面着陸チャレンジ」を公開いたしました！
https://takabosoft.github.io/face-moon-challenge/

iOS/Androidのブラウザで実行できます。アプリをインストールする必要はありません。

是非是非遊んでみてください～。
インカメラの映像を背景に映すこともできますので、YouTubeのショート動画やTikTokのネタに困っている方も是非利用してみてください。

https://t.co/bFaiI0mzFF
顔で操作する月面着陸ミニゲーム作りました〜　ブラウザゲームなのでiPhone15前後の方は気軽に遊んでみてください！ちなみにうちの子は4面で挫折しました。たまに操作止まっちゃうのでリロードしてください。 pic.twitter.com/ncw9ScyGsl

— たかぼー (@takabosoft) February 20, 2025

※PCブラウザでもカメラがあればChromeで動作いたします。

自分がパソコンを使って音楽を作り始めたときにはMIDI音源が主流になっており、FM音源は「名前は知ってるけどどういう仕組みで鳴っているかよくわらかない」ものでした。
そこで、FM音源がどんなものか知るためにFMシンセを作ってみることにしました。

出来たもの↓
https://takabosoft.github.io/tiny-fm-1/
※広いモニターのPCでお試しください。スマホには画面サイズ的に対応していません。

TypeScriptでWeb Audio APIを使ってリアルタイムに周波数変調を行い、サウンドを生成しています。

FMの仕組みについては以下のサイトを参考にさせていただきました。

• Wikipedia – FM音源
• Qiita – FM音源について　(@fukuroder様)

仕組み自体は非常にシンプルで、FM音源らしい音はたぶん数時間で鳴らすところまで出来たのですが、その後UIで仮想キーボードやらツマミやらエンベロープやらを作っている方が大変でした。
ソフト名に「Tiny」と付けたように、シンセとしての機能としては簡略的なものです。
各オペレーターにアンプリチュードエンベロープこそ付けましたが、ピッチエンベロープ、モジュレーションエンベロープ等、時間で音を変化させる系の機能が全然載っていません。
ただ、あまりUIを複雑にすると経験上迷子になりやすいのでまずは１画面で収まる範囲の機能で完成としました。
（※FM音源を本当に使う方はDAWにお気に入りのFMシンセがインストールされていると思いますし、WebでFM音源を体験する程度であればこのぐらいかなという所です。）

GitHubにソースもありますので、興味のある方はどうぞ。
https://github.com/takabosoft/tiny-fm-1

「レイトレーシング」をご存知でしょうか？

最近のグラボやPS5などでもリアルタイムでレイトレーシングが使えるようになり、言葉自体は良く聞くようになりましたが、いまいち何をしているのかピンと来ていないプログラマーの方もいらっしゃるのではないでしょうか。

私たちが物を「見る」ためには、光が光源から放たれ、さまざまな場所で反射し、最終的に目に届いた光の色を知覚する必要があります。
レイトレーシングはそんな目に届いた光の軌跡を逆算し、どこからやってきたのかを求めることでよりリアルな色をシミュレートするアルゴリズムです。

で、なんとこのアルゴリズムやプログラムは「週末レイトレーシング」（英語タイトル：Ray Tracing in One Weekend）として無料で公開されているのです。
https://raytracing.github.io/

めちゃくちゃ良い時代になりましたね・・・。
筆者は学生時代にレイトレーシングに一度興味を持ちましたが、なかなか参考書などを入手することができず入門すらできないでおりました。
数十年経って入門できる日が来ることになろうとは。

さて、たまたまGLSLというシェーダープログラムの入門をしていたのですが、今回はGLSLの勉強を兼ねてレイトレーサーをWeb上で動かしてみました。

DEMO　※まぁまぁ重いです。

いかがでしょうか？

屈折や反射などがとても綺麗にレンダリングされているのがわかるかと思います。
計算だけでリアルな画像が作れるって凄いですよね。
実際に作って綺麗な画像が出ると「おお！」ってなります（笑）

是非、興味を持たれた方は週末レイトレーシングにチャレンジしてみてください（年末年始に是非！）。

—-
ちなみにCPUのみでレンダリングすると、結構な時間が掛かりますが、上のDEMOのようにシェーダーを使えば並列に計算できるため、FPSを稼ぐことができます。
GLSLは反面、クラスや再帰が使えないといった制約もあるため実装が大変ではありますが…

EDGE2 Ver.1.19をリリースいたしました。
今回も細かな改良・不具合修正となります。

ダウンロードはこちらからどうぞ。
→https://takabosoft.com/edge2

変更点一覧

• 最適化されたアニメーションGIFを復元した状態で読み込む機能を実装しました。
  [ファイル]メニューの[インポート]から実行できます。
  現時点ではローカルパレットが使われている場合は復元できません。
• アニメーションプレイヤで停止時に再生前のフレームへ戻すオプションを追加しました。
  コマ送り時にエディットウィンドウへ反映]を利用される場合にオンにしておくと、不要なスクロール作業が軽減されます。
  アニメーションプレイヤの[表示]メニュー内の[停止時にフレームを戻す]から設定できます。
• アニメーションプレイヤのレンダリング結果をページへ変換するような機能を実装しました。
  アニメーションプレイヤの「表示」メニュー内の「フレーム→ページ変換(24bit固定)」から実行できます。
  元画像などが8bitであっても24bitになる点にご注意ください。
  タイルや反転機能は反映されません。
  ディレイや表示後の情報は引き継がれます。
  背景はアニメーションプレイヤの背景色が使われます。
• キャプチャフレームにて編集画像の全ページを1フレームの各パーツとして取り込む機能を実装いたしました。
  キャプチャフレームの[取り込み]メニュー内から実行できます。
  各ページを一画面に並べて確認したい場合などにご利用いただけます。
• イメージの変更が行われた際に、各種表示先調節ウィンドウの内容を自動更新するようにしました。
• キャプチャフレーム表示先調節ウィンドウに[他のフレームを薄く表示]する機能を実装しました（キャプチャグループフレームに有った機能と同等）。
• 移動ツールを実装しました。範囲（無ければ全体）を移動する専用のツールです。
  編集]メニュー→[ツール]→[移動]にありますので、必要に応じてツールバーカスタマイズ等してご利用ください。
• アニメーションプレイヤ、ポジションウィンドウ、各種表示先調節ウィンドウにも[環境設定]の[マウス操作（2）]の[マウスホイール動作]が適用されるようにしました。
• アニメーションプレイヤ、ポジションウィンドウ、各種表示先調節ウィンドウに、マウス中ボタンドラッグ操作による「ハンドスクロール」機能を実装いたしました。
  今まで通りSpace+左ドラッグも利用できますので、お好みの操作をお使いください。
• EDGE2起動直後の復元処理や、[作業グループを開く]際、作業ファイルが削除または移動されて開けないケースでは作業ファイルごとにエラーアラートが表示されていましたが、これを一回のアラートにまとめて表示するようにしました。
  まとめたものはファイルが存在しないケースのみであり、その他のエラーは個々に表示されます。
• 24bit画像などを256色へ貼り付けた時、OSの機能を使って減色を行っていましたが、環境によっては色の誤差が大きくなる場合があるため、ソフトウェアにて減色処理を行うようにしました。設定等の必要はありません。貼り付け時の速度が若干低下します。
  速度を優先したい方がいらっしゃいましたら、オプションで戻せるようにいたしますので、ご連絡ください。
• カラーパレットの色精度に「3:3:3 – 512色 (9bit)」を追加しました。
• Windows11向けの微調整を行いました。
• JASC-PAL形式(*.pal)の読み込みに対応しました。
• カラーパレットのRGB値や色番号を16進数で表示するモードを追加しました。
  カラーパレットの[表示]メニュー内の[RGB値・色番号の進数]から変更できます。
• 文字列の描画ダイアログでプレビュー内の背景を暗くするオプションを追加しました。
• webp形式の読み込みに対応しました（書き出しには未対応）。
• EXEと同じ場所にSystemフォルダとしてEdge2から扱うファイルを置いていましたが、EXEの中に内包するように変更いたしました。
• Ver.1.16～1.18にてVCRUNTIME140_1.dllが見つからない旨の起動エラーが出ることがある症状を改善いたしました。
• 試作機能ではありますが、キャプチャフレーム/キャプチャグループフレームのリスト表示部分で矢印上下キーを押した時に最初⇔最後のフレームをループさせるオプションを追加しました。設定用のUIは無いため、必要な方はiniファイルを直接編集してください。

  ●キャプチャフレームの設定：
  IniFiles\(ログインユーザー名)\FloatWnd\CaptureFrame.ini
  [FrameListWnd]←無ければこの行を追加
  UDKeyLoop=1
  
  ●キャプチャグループフレームの設定：
  IniFiles\(ログインユーザー名)\FloatWnd\CaptureGroupFrame.ini
  [FrameListWnd]←無ければこの行を追加
  UDKeyLoop=1
  

運に任せて何度やっても出なかったので計算機を作りました。
多少誤差は出ると思うので一致しなくても、そういうものだと思ってください（連絡は不要です）。
当たったらラッキー的な感じで使ってもらえると良いかなと思います。

今日はハート無制限の日なので、下一桁チャレンジを一気に片付けたい…！