谷歌TensorFlow團隊和MediaPipe聯合推出兩款軟件包，可對面部和手部特徵進行跟蹤

TensorFlow最近在博客發文表示發佈了兩款新的軟件包：facemesh和handpose，分別用於跟蹤面部和手部的關鍵特徵點。這兩個軟件包是由MediaPipe和谷歌研究部門的TensorFlow.js團隊合作完成的。在不久的將來，研發團隊將增加對多手跟蹤的支持。以下TensorFlow博客完整內容。

我們也一直致力於加速我們的模型，特別是在移動設備上的那些模型。在過去幾個月的開發中，我們看到facemesh和handpose的性能有了顯著的提高，我們相信這一趨勢將繼續下去。

Facemesh軟件包

Handpose軟件包

在瀏覽器中嘗試在線演示程序

Facemesh軟件包可以在圖像中找出面部邊界和特徵點，而handpose可以找到手部邊界和特徵點。這些軟件包體積小、速度快，並且完全在瀏覽器中運行，因此，數據不會離開用戶的設備，從而保護了用戶的隱私。你現在就可以通過下面的鏈接試一下：

• Facemesh
• Handpose

這些包也可以作爲MediaPipe的一部分使用，這是一個用於構建多模態感知管道的庫：

• MediaPipe面部跟蹤
• MediaPipe手勢跟蹤

我們希望實時的面部和手部跟蹤能夠帶來新的交互模式。例如，人臉的幾何位置是對錶情進行分類的基礎，手勢跟蹤是手勢識別的第一步。我們很高興可以看看具有這些功能的應用程序將如何在Web上拓展交互性和可訪問性。

Facemesh

Facemesh包從一個圖像或視頻流中推斷出近似的3D面部表面幾何形狀，只需要一個攝像頭輸入，而不需要深度傳感器。這種幾何結構定位諸如眼睛、鼻子和嘴脣這樣的臉部特徵，包括細節，如嘴脣輪廓和麪部輪廓。這些信息可用於下游任務，如表情分類（但不用於識別）。請參考我們的模型卡，瞭解模型在不同數據集上的執行情況。這個包也可以通過MediaPipe獲得。

性能特徵

Facemesh是一個輕量級包，只有大約3MB的權重值，因此非常適合在各種移動設備上進行實時推斷。在測試時，請注意，TensorFlow.js也提供了幾個不同的後端可供選擇，包括WebGL和帶有XNNPACK的WebAssembly（WASM），後者用於使用低端GPU的設備。下表顯示了這個包在幾種不同的設備和TensorFlow.js後端上的執行情況：

安裝

安裝facemesh軟件包有以下兩種方式：
1.通過NPM：

import * as facemesh from '@tensorflow-models/facemesh;

2.通過script標籤：

<script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs-core"></script>
<script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs-converter"></script>
<script src="https://cdn.jsdelivr.net/npm/@tensorflow-models/facemesh"></script>

使用

包安裝完成以後，你只需要加載模型權重值，並傳入一個圖像來開始檢測面部特徵點：

// 加載MediaPipe facemesh模型資產。
const model = await facemesh.load();
 
// 向模型傳入視頻流，從MediaPipe圖中獲取檢測到的一組人臉。
const video = document.querySelector("video");
const faces = await model.estimateFaces(video);
 
// 每個face對象包含一個`scaledMesh`屬性，
// 這是一個包含468個特徵點的數組。
faces.forEach(face => console.log(face.scaledMesh));

estimateFaces的輸入可以是視頻、靜態圖像，甚至是在node.js管道中使用的ImageData接口。然後，facemesh返回輸入中人臉的預測對象數組，其中包括關於每個人臉的信息（例如，一個置信度評分，以及人臉內468個特徵點的位置）。下面是一個預測對象樣本：

{
    faceInViewConfidence: 1,
    boundingBox: {
        topLeft: [232.28, 145.26], // [x, y]
        bottomRight: [449.75, 308.36],
    },
    mesh: [
        [92.07, 119.49, -17.54], // [x, y, z]
        [91.97, 102.52, -30.54],
        ...
    ],
    scaledMesh: [
        [322.32, 297.58, -17.54],
        [322.18, 263.95, -30.54]
    ],
    annotations: {
        silhouette: [
            [326.19, 124.72, -3.82],
            [351.06, 126.30, -3.00],
            ...
        ],
        ...
    }
}

Handpose

Handpose包檢測輸入圖像或視頻流中的手，並返回21個三維特徵點來定位每隻手的特徵。這些特徵點包括每個手指關節和手掌的位置。2019年8月，我們通過MediaPipe發佈了該模型——你可以在當時發佈的博文中找到更多關於模型架構的信息。請參閱我們的模型卡，瞭解關於如何在不同的數據集上進行手部姿勢識別的詳細信息。這個包也可以通過MediaPipe獲得。

性能特徵

Handpose是一個相對輕量級的包，包含大約12MB的權重值，適合於實時推斷。下表顯示了該包在不同設備上的執行情況：

安裝

安裝handpose軟件包有以下兩種方式：
1.通過NPM：

import * as handtrack from '@tensorflow-models/handpose;

2.通過script標籤：

<script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs-core"></script>
<script src="https://cdn.jsdelivr.net/npm/@tensorflow/tfjs-converter"></script>
<script src="https://cdn.jsdelivr.net/npm/@tensorflow-models/handpose"></script>

使用

包安裝完成以後，你只需要加載模型權重值，並傳入一副圖像開始跟蹤手部特徵點：

// 加載MediaPipe handpose模型資產。
const model = await handpose.load();
 
// 向模型傳入視頻流，從MediaPipe圖中獲取預測。
const video = document.querySelector("video");
const hands = await model.estimateHands(video);
 
// 每個face對象包含一個`landmarks`屬性，
// 這是一個包含21個3-D特徵點的數組。
hands.forEach(hand => console.log(hand.landmarks));

與facemesh一樣，estimateHands的輸入可以是視頻、靜態圖像或ImageData接口。然後，該包返回一個對象數組，該數組描述輸入中的手部信息。下面是一個預測對象樣本：

{
    handInViewConfidence: 1,
    boundingBox: {
        topLeft: [162.91, -17.42], // [x, y]
        bottomRight: [548.56, 368.23],
    },
    landmarks: [
        [472.52, 298.59, 0.00], // [x, y, z]
        [412.80, 315.64, -6.18],
        ...
    ],
    annotations: {
        indexFinger: [
            [412.80, 315.64, -6.18],
            [350.02, 298.38, -7.14],
            ...
        ],
        ...
    }
}

未來展望

MediaPipe團隊正在開發更精簡的模型架構，而TensorFlow.js團隊一直在研究加速推理的方法，比如操作符融合。更快的推理將反過來解鎖更大、更精確的模型，以便在實時管道中使用。

原文鏈接：
https://blog.tensorflow.org/2020/03/face-and-hand-tracking-in-browser-with-mediapipe-and-tensorflowjs.html