カメラを開くと、2Dイラストがリアルタイムでアニメーション化されます。中国のプログラマーが制作し、デモはオンラインで入手できます。

この記事はAI新メディアQuantum Bit（公開アカウントID：QbitAI）より許可を得て転載しています。転載の際は出典元にご連絡ください。

アライグマを描いて、「代金を徴収」するクローズアップを撮るには、何ステップ必要ですか？

必要なのは、Tom Nook にスケルトンを添付し、エクスポートした SVG ファイルをブラウザにドラッグするだけです。

ちょうどこのように、トム・ヌークはカメラの前であなたが動くのと同じように動きます。

この TensorFlow.js プロジェクトは Pose Animator と呼ばれています。デモがリリースされるとすぐに、ネットユーザーたちは大喜びしました。

たとえば、デザイナーの Julia Jaskólska は、ダンスとイラストを完璧に組み合わせています。

身体を鍛えるだけでなく、新たな創造の可能性も開きます。

彼女は楽しそうにこうコメントした。

自分のイラストをアニメーション化するのがこんなに簡単だとは思っていませんでした！

実装の詳細

では、イラストはどのようにして生まれるのでしょうか?

Pose Animatorは、PoseNetとFaceMeshという2つのTensorFlow.jsモデルの認識結果に基づいて、2Dベクター画像とそのスケルトンのリアルタイムアニメーション処理を実行することを紹介しました。

その中で、コンピュータグラフィックスにおけるスケルタルアニメーションの考え方が借用され、ベクターキャラクターに適用されています。

スケルタルアニメーションでは、キャラクターは 2 つの部分で構成されます。

1 つ目はモデルを描画するためのスキン、2 つ目は動きを制御する鍵となるスケルトンです。

Pose Animator では、スキンは入力 SVG ファイル内の 2D ベクター パスによって定義されます。

さらに、Pose Animator は、PoseNet と FaceMesh に基づいたプリセットのボーン階層表現を提供します。

スケルトン構造の初期ポーズは、入力 SVG ファイルでユーザーによって指定されます。

その後、機械学習モデルの認識結果に基づいて、リアルタイムの骨の位置が更新されます。

現在、作者は 2 つの Web デモを公開しています。

レンズで撮影した画像に基づいてリアルタイムで動く 2D 画像。

もう 1 つは静止画像用です。

したがって、興味がある場合は、コンピューターの Chrome と iOS Safari の 2 つのブラウザーでプレイできます。

さらに、QuantumBit はテスト済みで、Android フォンの Chrome でも利用できます。

中国のプログラマーが制作

Pose Animator の作者は、Google のクリエイティブ テクノロジーの専門家である Shan Huang です。

[[325571]]

Shan Huang はカーネギーメロン大学を卒業し、コンピュータサイエンスの学士号とヒューマンコンピュータインタラクションの副専攻を取得しました。 2014年にGoogle（上海）に入社。

当時インターネット上で流行していた絵当てソング企画も彼女が始めたもの。

ポータル

GitHub プロジェクト: https://github.com/yemount/pose-animator

カメラキャプチャデモ: https://pose-animator-demo.firebaseapp.com/camera.html

画像バージョンデモ: https://pose-animator-demo.firebaseapp.com/static_image.html