Waakvlam blog

Waakvlam blog

「創りたい気持ち」に火をつけるWaakvlamの活動記録

話題のiPhone XとARKitでFace Trackingを試してみた

こんにちは!
最近、iPhone Xを買った、
Appleが大好きななかりんです٩( ᐛ )و

【目次】

「ARKit」とは

ARKitとは、iOSバイスのカメラとモーションの機能を統合して、アプリやゲームで拡張現実を作り出せるライブラリです。
【参考: https://developer.apple.com/arkit/

「Face Tracking」とは

ざっくりと説明します・・・

顔を認識します!!!!

iPhone Xの端末全面のカメラには色々なセンサが埋め込まれていて、
これらのセンサーユニットを総称してTrueDepthカメラと呼びます

このTrueDepthカメラは、空間の深度情報を取得し、
なんと、顔の奥行きを認識することができる!!

この取得したデータを用いて、Face Trackingを実現しています。

Face Trackingで有名なものはFace IDやAnimojiですね。
f:id:Waakvlam:20171223182348g:plain

Let's Face Tracking!

Face Trackingを実際に使いたい!
なので、iPhone Xを買っちゃいましたー!
(とても高かった・・・)

Apple公式ドキュメント

みなさん、Appleの公式ドキュメントみたことありますか?
公式ドキュメントを漁っていたら、Face Trackingを用いたサンプルがありました。


今回はこれを用いて遊んでみました!
f:id:Waakvlam:20171223200121p:plain

ダウンロードしてbuildしたらこんな感じでした。
f:id:Waakvlam:20171223200229p:plainf:id:Waakvlam:20171223200249p:plain

マスクがちゃんと顔に貼り付けられていてすごい!
表情も認識されている!
Appleのエンジニアすげぇ・・・。


すごいけど、
ダウンロードして、buildして使うだけなのは、
正直つまらないですよね?

なので・・・

サンプルコードをいじってみた

SceneKitというApple公式のライブラリで、マスクを生成されているのですが、
このSceneKitでテクスチャマッピングができます!
しかも、簡単に!

なので今回は、歌舞伎メイクをテクスチャマッピングしてみました。

まず、マッピングしたい画像を用意します
f:id:Waakvlam:20171223193717p:plain

用意した画像を、プロジェクトのファイルにドラッグ&ドロップ!
f:id:Waakvlam:20171223195318p:plain

マスクを生成しているMask.swiftを開いて、以下のように修正します。
f:id:Waakvlam:20171223195326p:plain

import ARKit
import SceneKit
import UIKit

class Mask: SCNNode, VirtualFaceContent {
    let material: SCNMaterial
    
    init(geometry: ARSCNFaceGeometry) {
        self.material = geometry.firstMaterial!
        /*
        material.diffuse.contents = UIColor.lightGray
        material.lightingModel = .physicallyBased
        */
        let kabuki = UIImage(named: "kabuki.png")
        self.material.diffuse.contents = kabuki
        
        super.init()
        self.geometry = geometry
    }
    
    required init?(coder aDecoder: NSCoder) {
        fatalError("\(#function) has not been implemented")
    }
    
    // MARK: VirtualFaceContent
    
    /// - Tag: SCNFaceGeometryUpdate
    func update(withFaceAnchor anchor: ARFaceAnchor) {
        let faceGeometry = geometry as! ARSCNFaceGeometry
        faceGeometry.update(from: anchor.geometry)
    }
}

あとはビルドするだけ!

めちゃくちゃ簡単ですね!
f:id:Waakvlam:20171223200503j:plain

今後やってみたいこと

この技術を用いて、Animojiを実際に作ってみたい!
自分で作ったキャラで、動作できたら面白そうですね
誰かの顔を読み込んで、それを自分の表情と同期させるのも面白そう!

Face Trackingのドキュメントを読み込んで実装したいと思います!


今後も宜しくお願いします٩( ᐛ )و
なかりん
GitHub: nakarin0528
Twitter: @nakarinrin0528
f:id:Waakvlam:20171223195928p:plain