← WORKS

Odorigu

💃 IN DEV
ReactPixiJSTypeScriptブラウザ完結
「踊る」×「リグ」。リグ済みテンプレートに透過PNGパーツをはめ込み、BPMに乗せて自動で動かし、連番PNG/MP4として書き出せるブラウザ完結のMEMEアニメ生成ツール。1枚のイラストからでも、キャラを“ノせて”踊らせられます。

🎬 どんなもの

キャラのパーツ(顔・髪・腕・脚・尻尾など)をスロットに割り当て、BPMに合わせた剛体アニメと二次揺れ(バネ)で自動的に踊らせるツール。プレビューを見ながら調整し、透過連番PNG・MP4・GIF・透過WebMで書き出せます。処理はすべてブラウザ内で完結します。

  • リグ済みテンプレに画像をはめるだけ(上半身/全身、尻尾・けもみみ等の追加パーツ対応)
  • BPM手動入力+タップテンポ、音源アップロードでBPM自動検出&音ハメ
  • 目パチ・口パク、左右ミラー、ポージング(キーポーズ補間)、メッシュ変形、2ボーンIK
  • PSDインポート(レイヤー名→スロット自動割当)、骨格の自動フィット・手動編集
  • 出力: 連番PNG(ZIP)/MP4/GIF/透過WebM、SNS向け縦横比ワンクリック

🛠️ 技術・設計

React + PixiJS。FK(前進運動学)を2Dアフィン行列で決定的に計算し、プレビューと書き出しが一致するよう固定ステップで積分。MP4出力は ffmpeg.wasm(SharedArrayBuffer 用に COOP/COEP 対応)。ロジックは50項目超のユニットテストで検証しています。

  • プロシージャルアニメ+減衰調和振動の二次揺れ(多段=尻尾3節)
  • Free/サブスク/買い切りのプラン制限を機能ロックで実装(決済は未接続)

🔒 ソースについて

現在リポジトリは非公開です。仕組みや使い方が気になる方は、CONTACTからお気軽にお問い合わせください。