あの「Bad Apple!!」の影絵アニメをフォントに埋め込んだムービーが登場

上海アリス幻樂団による東方Project第4弾「東方幻想郷 ～ Lotus Land Story.」に収録されている楽曲「Bad Apple!!」を基にした二次創作ムービー「【東方】Bad Apple!! ＰＶ【影絵】」は、記事作成時点で3500万回以上も再生されています。そんな「【東方】Bad Apple!! ＰＶ【影絵】」のアニメーションをフォントに取り込むという試みにエンジニアのヴァルデマール・エルク氏が挑戦した動画が公開されています。

BadAppleFont :: Oxidizing corner
https://blog.erk.dev/posts/anifont/

Bad Apple embedded into a font - YouTube

エルク氏は今回の試みを始めたきっかけとして「オンライン掲示板サイトのRedditでBad Apple!!のアニメーションを再現しようとしていると語る友人から、『Bad Apple!!をフォントに埋め込むことができるのではないか』と指摘されました」と述べています。

エルク氏はBad Apple!!のアニメーションをフォントに埋め込むために、「HarfBuzz」と呼ばれるテキストレイアウトエンジンツールに2023年7月に追加された、「テキストシェーピングルールにWebAssemblyを使用できる」という機能を用いました。

アニメーションをフォントに埋め込むための最初のステップとして、エルク氏はアニメーションにおける全てのフレームをScalable Vector Graphics(SVG)形式で取得しました。SVGファイルにフレームを変換することで、フォントに配置できるようになるとのこと。

続いてエルク氏は、フレームをフォントに取り込むために、各フレームの名前を自身が望むUnicode文字に変更するスクリプトを作成。さまざまなサイトを参考にしつつ、フォントへのSVGファイルのインポートを行いました。

また、エルク氏は埋め込んだSVGファイルを動かすためのコードを作成し、シェーピングを行いました。また、元となった「【東方】Bad Apple!! ＰＶ【影絵】」は30fpsの動画であるため、エルク氏はxsetコマンドを用いて文字の繰り返し周波数を30Hzに設定しました。

画像編集ソフトのGIMPや録画ソフトのOBSを駆使して録画を行った結果、こうしてフォントに埋め込まれたBad Apple!!の動画が生まれるに至りました。なお、エルク氏によると「Pfennig」というフォントが元となっているとのことです。