お手軽にはじめるバーチャルYouTuber(VTuber)になる方法

13 min readDec 25, 2016

こんにちはGOROmanです。

皆さんは「VTuberになってみたい！」と思ったことはありますか？私はあります。この記事では私が過去(2016年1月)にFaceRigとLive2Dを使って二次元の中の人になるまでの手順を自分の経験を元に記載しておきます。今後皆さんが「中の人(キャラクター)になりたい！」と思った時にお役に立てば幸いです。

何ができるのか？

アニメ美少女のような二次元キャラクターになりきってYouTubeやニコ生のような配信サイトで実況ができます。編集してYouTuberとしてデビューも出来ると思います。

いろいろな記事にしていただきましたので、先にこちらをご覧ください。
- これこそバーチャル！FaceRigとボイスチェンジャーで美少女キャラによるゲーム実況が実現 (Mogura VR)
- 美少女キャラに人の表情とゲームパッドの動作をリアルタイムで反映するゲーム実況ムービー (Gigazine)
- 誰でも“美少女”になってゲーム実況できる時代に！？斬新すぎる技術と発想が話題に (INSIDE)
- ユーザーの創作を後押ししたい — — Live2Dに聞く、FaceRig連携で「誰でも美少女」の裏側 (PANORA)

必要なもの

導入するには Windows PCとWebカメラが必要です。推奨環境は FaceRig のページをご覧ください（なぜか全部ひらがなで超読みにくいですが。。。) (2016/01/12追記) 漢字に修正されたようです

なお、参考までに今回の記事は Mac Book Pro Retina 15" にBootCampを使ってOSはWindows 10という環境で動作しています。(現時点では OSX上はFaceRigが動作しないので注意です)

https://twitter.com/GOROman/status/683557373202415616

導入手順

FaceRig と FaceRig Live2D Module の導入

ゲーム配信システムの Steam から購入することができます。Steam のアカウントがない方はこちらからアカウントを作成できます。
FaceRig (1,480円)を購入します。 http://store.steampowered.com/app/274920/
二次元キャラクターになるために FaceRig Live2D Module (398円) も購入しましょう。http://store.steampowered.com/app/420680/

Steamが自動的にインストールします。いくつか必要モジュールのインストーラーが起動的に起動しますので各モジュールもインストールしましょう。

https://twitter.com/GOROman/status/683565104919621632

FaceRig の設定

Steamで購入して起動すると以下のスプラッシュが表示されますので、Action!ボタンを押せばFaceRigが起動します。

日本語化

まずはUIを馴染みやすい日本語にしましょう。

起動すると以下のようなレイアウトが表示されます。

まずは画面上部の UI+ と書かれたアイコン(アドバンスUI)をクリックします。

右側に追加のUIが縦に表示されますので、ネジマークのアイコン（General Options)をクリックします。

あとは、言語設定を日本語にすればOKです。

キャリブレーション

自分の表情とリンクさせるには以下のアイコンを押してキャリブレーションしましょう。

正面を向いて自然な表情にします。これで自分の顔がキャラクターに反映されていると思います。いろんな表情を試してください。

キャラクターの選択

アバターアイコンをクリックして好きなキャラクターを選択できます。どう考えても日本人にウケないバタ臭いアバターがたくさんいますが、安心してくださいスクロールしていけば下の方に二次元キャラクターがいます。

あなたが中の人になりたいキャラクターを選んでください。

背景の選択

環境アイコンをクリックして背景を選択できます。今回は配信を前提としますのでクロマキー合成のため、グリーンバックを選択します。

バーチャルカメラの有効化

FaceRigにはバーチャルなWebカメラがドライバーとしてインストールされます。

バーチャルカメラがインストールされますので、SkypeやビデオチャットアプリにようなWebカメラを使用するアプリにはすべてFaceRigが使用できます。

重要
バーチャルカメラへ出力するにはブロードキャストに切り替えアイコンを押します。

配信編

このバーチャルカメラを使ってニコ生やTwitchに配信することが可能です。

https://twitter.com/GOROman/status/684155688960962560

OBS

今回の記事は配信には、Open Broadcaster Software(通称 OBS)を使用しました。(無料です)
OBSを使うことで任意のWebカメラ、ゲーム画面およびウィンドウを自由にレイアウトし、配信が可能となります。

OBSは https://obsproject.com/ でダウンロード可能です。

OBSの設定

OBSの表示テストをするためにはまず「配信プレビュー」ボタンを押下します。

FaceRigのカメラを追加するには「ソース」を右クリックし、以下のように「ビデオデバイス」を追加します。

グリーンバック部分を透明化するため、以下のクロマキーを有効にします。

まずは、色を緑に設定します。「選択」ボタンを押してクロマキーの背景色をマウスでクリックすればOKです。綺麗にぬけるように類似性の値を調整します。

重要なポイントは、バーチャルカメラに映像を出力するにはFaceRigアプリのBroadcastボタンを押す必要があることです。

設定レイアウト例です。「シーンを編集する」を押すことでレイアウトを調整できます。OBSの使い方や配信の仕方は別途他のサイトを参考にしてください。

応用編

二次元キャラクターになりきっての配信でも十分面白いのですが、いろいろと応用してみました。
最初に気づいたのが、ゲームを美少女キャラがやっている設定だとゲームパッドを持っていないと違和感があることでした。より臨場感を上げるためにゲームパッドを表示することを思いつきました。

Unity 5によるゲームパッドを制御

ゲームパッドの制御にはゲームエンジンである Unity 5 を使用しました。

http://japan.unity3d.com/

WebCamTexture

UnityはWebCamTextureという機能があり、任意のWebカメラをテクスチャとして使うことができます。今回はこのWebCamTextureでFaceRigのバーチャルカメラを表示し、ゲームパッドと合成しました。

コードは以下の通りです。

FaceRigWebCamTexture.cs

//
// FaceRigWebCamTexture 使用例 by GOROman
//
using UnityEngine;
using System.Collections;
using System.IO;public class FaceRigWebCamTexture : MonoBehaviour
{    // Virtualカメラの名前
    public string cameraName = "FaceRig Virtual Camera";    public int Width = 1280;
    public int Height = 720;
    public int FPS = 60;
    public Material material = null;    private WebCamTexture webcamTexture;    void Start()
    {
        // WebCameraの列挙と取得
        webcamTexture = FindWebCameraByName(cameraName);        if (webcamTexture != null)
        {
            // マテリアルが指定されていない場合はGameObjectから自動取得
            if (material == null)
            {
                material = gameObject.GetComponent<Renderer>().material;
            }            // テクスチャをWebCamTextureとして設定
            material.mainTexture = webcamTexture;            // WebCamTextureの再生を開始
            webcamTexture.Play();
        }
        else
        {
            Debug.LogWarning("Could not find " + cameraName);
        }
    }    // ウェブカメラテクスチャをカメラ名から得る
    private WebCamTexture FindWebCameraByName(string cameraNname)
    {
        // ウェブカメラデバイスを得る
        WebCamDevice[] devices = WebCamTexture.devices;
        WebCamTexture webcamtexture = null;        // ウェブカメラの列挙
        for (var i = 0; i < devices.Length; i++)
        {
            // ウェブカメラ名を取得
            string name = devices[i].name;
            print(i + ":" + name);            // 一致したか?
            if (cameraName == name)
            {
                // ウェブカメラテクスチャを生成
                return new WebCamTexture(cameraName, Width, Height, FPS);
            }
        }
        return null;
    }
}