ウェブカメラで顔や体の動きをトラッキングして3Dアバターを動かせる「KalidoKit」のソースコードが公開中

顔の表情、体や手の動きをトラッキングして3Dモデルに反映させるツール「KalidoKit」のソースコードがGitHubで公開されました。このKalidoKitを使うことで、ウェブカメラで撮影した自身の動きを2Dモデルや3Dモデルに反映させ、VTuberのアバターを動作させることも可能となります。

GitHub - yeemachine/kalidokit: Blendshape and kinematics solver for Mediapipe/Tensorflow.js face, eyes, pose, and hand tracking models.
https://github.com/yeemachine/kalidokit

KalidKitは、カメラで捉えた動きをブラウザ上で3Dアバターに連携させてVTuberになれる「Kalidoface 3D」のコア技術です。Kalidoface 3Dがどんなものなのかは以下の記事を読むとよくわかります。

無料でブラウザ上で誰でも簡単に美少女VTuberに受肉できる「Kalidoface 3D」レビュー - GIGAZINE

イメージとしては以下のような感じ。カメラで現実の体を撮影し、抽出した顔や体の動きからMediaPipeあるいはTensorFlow.jsを用いて姿勢推定を行います。そしてKalidoKitによって3Dアバターにフィードバックさせるという流れです。

KalidoKitは顔・ポーズ・手の計算を行う3つのクラスで構成されており、Facemesh・Blazepose・Handpose・Holisticからのキーポイントを受けるようになっています。

// Accepts an array(468 or 478 with iris tracking) of vectors
Kalidokit.Face.solve(facelandmarkArray, {
    runtime: "tfjs", // `mediapipe` or `tfjs`
    video: HTMLVideoElement,
    imageSize: { height: 0, width: 0 },
    smoothBlink: false, // smooth left and right eye blink delays
    blinkSettings: [0.25, 0.75], // adjust upper and lower bound blink sensitivity
});

// Accepts arrays(33) of Pose keypoints and 3D Pose keypoints
Kalidokit.Pose.solve(poseWorld3DArray, poseLandmarkArray, {
    runtime: "tfjs", // `mediapipe` or `tfjs`
    video: HTMLVideoElement,
    imageSize: { height: 0, width: 0 },
    enableLegs: true,
});

// Accepts array(21) of hand landmark vectors; specify 'Right' or 'Left' side
Kalidokit.Hand.solve(handLandmarkArray, "Right");

// Using exported classes directly
Face.solve(facelandmarkArray);
Pose.solve(poseWorld3DArray, poseLandmarkArray);
Hand.solve(handLandmarkArray, "Right");

実際にKalidoKitを使って顔や体の動きをリアルタイムで3Dアバターにフィードバックさせている様子を、開発者であるRich氏が公開している以下のムービーで見ることができます。