40
38

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

UnityでVuforiaを使ってLive2DとARの可能性を感じる

Last updated at Posted at 2016-02-19

#モチベーション

  • 楽しいことをするために現存する技術に触れる
  • ARのアプリ開発とかしてみたかった
  • Live2Dとか今ある表現方法と技術を組み合わせる練習
  • 技術自体に触ってハッピーになる

#出来上がるもの

  • こんな感じのものが出来上がる

#開発環境

  • Unity 5.2.1f1
  • Vuforia (packageはvuforia-unity-5-0-10.unitypackage)
  • Live2D Cubism SDK for Unity Version 2.1.00_1

#流れ
##準備
###Live2Dの準備

  • Live2DのSDKをダウンロード link

マーカーの準備

Vuforiaで使うマーカーの準備

  • Single Image用の画像(.jpgか.pngで一枚用意)
  • Cuboid用のマーカー(立方体(正六面体)の何かの展開図とそれぞれの面の画像)

Cuboidのテスト用のサンプル画像はgithubに置いてあるのでご自由に

###Vuforiaの準備
ここでは以下の二つを行う

  • VuforiaをUnityで使うためのパッケージファイルをダウンロード
  • アプリで使うマーカ(ターゲット)をWebサイト上で準備してパッケージにしてダウンロード

####手順

  • Vuforiaに登録

  • VuforiaのSDKからDownload for Unityをダウンロード link

  • VuforiaのDevelop > License Manager で Add License Key
    2016-02-19_22h16_45.png
    画面の通りに入力していく。DeviceはMoblie、License KeyはStarterを選択
    2016-02-19_22h17_14.png
     

  • 登録が終わったら、作成されたLicenseのキーをメモしておく2016-02-19_22h40_49.png
     

  • VuforiaのDevelop > Target Manager で Add Database
    2016-02-19_22h17_26.png
     
    2016-02-19_22h17_31.png
     

  • 作成したDatabase内で Add Target
    2016-02-19_22h17_55 - コピー.png
     

  • ここで画面に従いながらマーカー(ターゲット)を設定していく(今回はSingle Image, Cuboidの2種類を試す)
    Single Imageはマーカー(ターゲット)とサイズと名前を設定する
    2016-02-19_22h18_00.png
     
    Cuboidはサイズと名前を設定する(各面のマーカーは後から設定する)
    2016-02-19_22h18_04.png
     
    作成されたオブジェクトの面それぞれに画像を設定していく、右の展開図をクリックすると画像をアップロードできる
    2016-02-19_22h18_18.png
     

  • 終わったらDownload Dataset(All)でUnityのパッケージにしてダウンロード
    2016-02-19_22h17_55.png
     
    2016-02-19_22h19_07.png

###Unityでプロジェクトを作り、SDKを配置したりパッケージをインポートしたりする
ここまでで以下のものが準備できたはずだ

  • Live2D SDK
  • Vuforia SDKのpackage
  • Vuforia のマーカーのpackage(Download Dataset(All)でダウンロードしたpackage)
  • Vuforiaのアプリのライセンスキー

ここからUnity上で以上を組み合わせていく

  • 一番簡単な方法として、Live2D SDKのsample/SampleApp1を使う
  • UnityでLive2D_SDK_Unity_2.1.00_1_jp/sample/SampleApp1/Assets/Scene/Sample.unityを開く
  • HierarchyにあるMainCameraを消す
  • Assets > Import Package > Custom Package...からVuforia SDKのpackageとVuforia のマーカーのpackageをImportする
  • ProjectにあるVuforia/Prefabs/ARCameraをHierarchyに追加
  • ARCameraのInspector/Vuforia BehaviourのApp License KeyにVuforiaのアプリのライセンスキーを追加する
  • ARCameraのInspector/Database Load BehaviourにあるLoad Data Set YOUR_APP_NAMEとActivateのチェックボックスを有効にする
  • 続けて、Single ImageかCuboidマーカーのいずれかの設定を行う
     

Single Imageのマーカーを設定する

  • ProjectにあるVuforia/Prefabs/ImageTargetをHierarchyに追加
  • ImageTargetのInspector/Image Target BehaviourのData SetとImage Targetを設定する

Cuboidのマーカーを設定する

  • ProjectにあるVuforia/Prefabs/MultiTargetをHierarchyに追加
  • MultiTargetのInspector/Multi Target BehaviouのData SetとMulti Targetを設定する

あとは、マーカーの位置とLive2Dのモデルの位置を修正すれば完成!!
iOSにも普通にビルドできる!

Unityちゃんマークからハルが召喚される…時間があったら治そう…

40
38
3

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
40
38

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?