Webの透過アニメーション
Webページに透過キャラクターアニメーションを置く：WebM Alphaの実装
透過WebMをHTMLでページの背景に重ね、PNGへのフォールバック、再生操作、モバイル表示、対象ブラウザでの互換性確認まで実装します。
記事を読むANIMGEN 制作ノート
静止画から、ゲームで使える動きへ。
透過アニメーション、フレーム編集、ゲーム用素材の書き出しを、実際のファイルと手順で解説します。
AI剣攻撃アニメーション
4秒のAI剣攻撃を、キレのある一撃に編集する
トップページの女剣士を例に、前後の待機と途中の停止フレームを取り除き、4秒・96フレームのAIアニメーションを24 FPS・28フレーム・約1.17秒の攻撃に編集します。
記事を読む
AI歩行ループ
4秒のAI歩行アニメーションから、自然につながるループを切り出す
水彩調キャラクターの実際のアニメーションから96フレーム中32フレームを選び、ループの継ぎ目、FPS、移動速度と足滑りの関係を確認します。
記事を読む
Expand Canvas
走る・跳ぶ動きが画面からはみ出す？ Expand Canvasで余白を確保する
AnimGenトップページの青いキャラクターを例に、生成前にキャンバスを広げ、キャラクターの大きさと位置を調整して、走行・ジャンプ・攻撃の動きに必要な余白を作る方法を説明します。
記事を読む
透過アニメーションの緑の縁
透過AIアニメーションの緑の縁を直す：アルファしきい値とデスピルの実測
同じAIアニメーションの元フレームで背景しきい値、エッジ収縮、フェザー、デスピルを比較し、緑の縁、自然な輪郭、マゼンタへの過補正がどう生じるかを示します。
記事を読む
MCPによるアニメーション生成
MCPで透過キャラクターアニメーションを作る：画像のアップロードから保存まで
AnimGen MCPでモデルを確認し、キャラクターPNGの実データをアップロードし、見積もりを承認して生成します。スプライトシートとJSONを保存・検査するまでの実測記録です。
記事を読む
Godot 4への取り込み
透過キャラクターアニメーションをGodot 4に取り込む：実プロジェクトでの検証
AnimGenのGodot用パッケージを実際のプロジェクトに取り込み、SpriteFramesのパス、FPS、原点を保ったまま、明暗2種類の背景で透過アニメーションを確認します。
記事を読む
スプライトシートとPNG連番
スプライトシートとPNG連番、2Dゲームの書き出しにはどちらを選ぶ？
同じ96フレームの透過アニメーションをスプライトシート＋JSONとPNG連番にし、容量、デコード後のメモリの基準、テクスチャ上限、適した用途を比較します。
記事を読む
透過PNGアニメーション
1枚のPNGから透過の走行・ジャンプアニメーションを作る
実際の透過PNGから走行・ジャンプを生成し、使えるフレームを選び、空中姿勢の長さを調整してゲーム用素材を書き出します。動画、プロンプト、編集画面、サンプル付き。
記事を読む
WebM AlphaとProRes 4444
WebM Alpha、ProRes 4444、PNG連番：透過アニメーションにはどれを選ぶ？
同じ96フレームの透過アニメーションをWebM Alpha、ProRes 4444、PNG連番で書き出し、ファイルサイズとデコード後のAlphaを比較します。検証ファイルもダウンロードできます。
記事を読む