カメラSDK
Meeeetup カメラ SDK は、映像から顔ごとに1枚の良い写真を取り出します。顔を検出し、フレームをまたいで1つずつトラッキングし、対象がどれだけレンズの方を向いているかを採点して、見た中で最良のフレームを渡します。
役割は撮影のみです。SDK が通信を開くことはありません。切り出された顔画像はコールバックで受け取り、送り先は利用側が決めます。Meeeetup の /capture API でも、自前のバックエンドでも、ディスクでも構いません。
パッケージ
| パッケージ | インストール | 内容 |
|---|---|---|
@meeeetup/camera-core |
pnpm add @meeeetup/camera-core |
パイプライン本体。トラッキング、姿勢のスコアリング、選択を行います。DOM もネイティブコードも使いません。 |
@meeeetup/camera-web |
pnpm add @meeeetup/camera-web |
MediaPipe BlazeFace と、React のプロバイダ・フック・コンポーネントです。 |
@meeeetup/camera-react-native |
pnpm add @meeeetup/camera-react-native |
ネイティブの ML Kit を利用する Vision Camera のフレームプロセッサです。 |
各プラットフォーム向けパッケージは core に依存しているため、@meeeetup/camera-web をインストールすればパイプラインも一緒に入ります。core を単体でインストールするのは、SDK が同梱していない検出器を自分で組み込む場合だけです。
どちらのプラットフォーム向けパッケージも npmjs.org で公開しています。アクセストークンもレジストリ設定も不要です。
顔が写真になるまで
video frame
└─ detector (MediaPipe on web, ML Kit on native) → Detection[]
└─ admission: drop anything under minDetectionScore or minFaceHeight
└─ track: match each face to a track by centroid distance
└─ score pose: getFrontalness() → 0–100
└─ select the best frame for that track
└─ onSelect(face) / onBatchCapture(faces)
設定に入る前に、次の2点を押さえてください。
- トラッキングはフレーム単位ではなく顔単位です。 入ってきて、少し迷ってから顔を上げた人は、多数のフレームを持つ1つのトラックであり、SDK の仕事はその中から選ぶことです。
- 正面度と検出確度は別の値です。
Detection.scoreは、そこに顔があることに対する検出器の確信度です。正面度は、その顔がどれだけカメラの方を向いているかです。両者は別々にフィルタされ、掛け合わせることはありません。
2つのキャプチャモード
パッシブは空間を見張ります。フレーム内のすべての顔が個別にトラッキングされ、ベストショットがバッファされ、タイマーがまとめて渡します。天井カメラ、出入口、誰も操作しない受付に向いたモードです。
インタラクティブは、撮影されていることを分かっている1人を撮ります。チェックイン端末が典型例です。Web ではガイドリングがこれにあたり、対象が顔を中央に合わせて静止すると、1枚が撮影されます。
<MeeeetUpCamProvider mode="passive" onBatchCapture={send}>
<CameraViewport />
</MeeeetUpCamProvider>
次に読むもの
- クイックスタート(React) — 20行ほどで動くパッシブカメラ。
- 設定 — すべてのキャプチャ条件、既定値、そして変更すべき場面。
- React Native — Vision Camera のフレームプロセッサ。
実際に動かして見るのが一番です。ライブデモは、ここで説明したパイプラインをそのままブラウザ上で実行し、しきい値をスライダーで操作できます。