AnimatedDrawings 「子供の人間の絵をアニメーション化する」

更新日：2023年11月3日

Webアプリ

こちらのホームページで簡単に作成できます

https://sketch.metademolab.com/

インストール

https://github.com/facebookresearch/AnimatedDrawings

Code->download ZIP を押してダウンロードした後解凍します。または

git clone https://github.com/facebookresearch/AnimatedDrawings.git

次に

cd AnimatedDrawings
pip install -e .

Openh264 ダウンロード

https://github.com/cisco/openh264/releases

ここからopenh264-1.8.0-win64.dll.bz2をダウンロードして解凍します。パスの通ったところに配置します。例えば"\python-3.10.11.amd64\DLLs"

https://github.com/cisco/openh264/releases/download/v1.8.0/openh264-1.8.0-win64.dll.bz2

サンプルの実行

from animated_drawings import render
render.start('./examples/config/mvc/export_mp4_example.yaml')

Writing video to: \AnimatedDrawings\video.mp4

自分の絵でやってみる

OpenJDK

JDK Builds from Oracle (java.net)

ダウンロードした後に解凍し環境変数 JAVA_HOMEを設定してください

モデルのダウンロード

https://github.com/facebookresearch/AnimatedDrawings/releases/download/v0.0.1/drawn_humanoid_detector.mar

https://github.com/facebookresearch/AnimatedDrawings/releases/download/v0.0.1/drawn_humanoid_pose_estimator.mar

AnimatedDrawings\torchserve\model-storeに配置

AnimatedDrawings\torchserve\config.properties修正


inference_address=http://0.0.0.0:8080
management_address=http://0.0.0.0:8081
metrics_address=http://0.0.0.0:8082
model_store=./model-store
load_models=all

pip install openmim
pip install torch
mim install mmcv-full==1.7.0
pip install mmdet==2.27.0
pip install torchserve torch-model-archiver

AnimatedDrawings\examples\annotations_to_animation.py
AnimatedDrawings\examples\fix_annotations.py
AnimatedDrawings\examples\image_to_animation.py
AnimatedDrawings\examples\image_to_annotations.py
親フォルダへコピー

実行

torchserve.exe --start --ts-config config.properties

python image_to_animation.py examples/drawings/garlic.png garlic_out

Webでジョイントを修正

"AnimatedDrawings\examples\fixer_app"親フォルダーにコピー

pip install Werkzeug==2.2.2
ダウングレード

python fix_annotations.py garlic_out

ブラウザでに移動して、
http://127.0.0.1:5050
ジョイントを適切な位置にドラッグし、を押してSubmit編集内容を保存

関節も自分で作る

"AnimatedDrawings\examples\characters\char1"中身を"AnimatedDrawings\garlic_out"にコピー

"AnimatedDrawings\garlic_out"にtexture.png mask.pngを自分の作った画像にする

背景を透過してマスク画像を作成
http://memo.eightban.com/autoit/rembg

"AnimatedDrawings\garlic_out"のchar_cfg.yamlを修正する用意した画像の高さと幅

height: 500
width: 254

Web画面を開いて関節を設定してサブミットするとファイルに保存されます

"AnimatedDrawings\garlic_out"のchar_cfg.yaml texture.png mask.pngを"AnimatedDrawings\examples\characters\char"にコピー

export_gif_example.py

from animated_drawings import render
render.start('./examples/config/mvc/export_gif.yaml')

export_gif.yaml

scene:
  ANIMATED_CHARACTERS:
    - character_cfg: examples/characters/char/char_cfg.yaml
      motion_cfg: examples/config/motion/dab.yaml
      retarget_cfg: examples/config/retarget/fair1_ppf.yaml
controller:
  MODE: video_render
  OUTPUT_VIDEO_PATH: ./video.gif

モーションファイルを使う

自分で作ったbvhファイルを使うことができます

filepath: examples/bvh/ab.bvh
start_frame_idx: 0
end_frame_idx: 339 
groundplane_joint: LeftFoot
forward_perp_joint_vectors:
  - - LeftShoulder
    - RightShoulder
  - - LeftUpLeg
    - RightUpLeg
scale: 0.025
up: +z

https://github.com/facebookresearch/AnimatedDrawings/tree/main/examples/config

Bvhファイルを用意する

http://memo.eightban.com/etc/bvh

VRMファイル（モデルデータ）を作って動かす