Cubism SDK‎ > ‎プラットフォーム‎ > ‎Unity‎ > ‎Cs版(推奨)‎ > ‎

sampleApp1を利用したプロジェクト作成

Unity のプロジェクト作成から SDK のサンプルを利用して Live2D モデルが表示されるまでの手順を説明します。


用意するもの
  • Unity Unity Pro でなくても構いません
  • Live2D SDK (ダウンロードしたLive2D SDK のsampleApp1/Assets内にある、「Live2D」フォルダと「Scripts」フォルダ、「Editor」フォルダ)
  • Live2D のリソース
本来は、Live2Dのリソースは作成するモデルに応じてそれぞれ準備します。
ここではサンプルプロジェクトの「しずく」のリソースを使って説明をしていきます。

sample_project/Assets/Scripts/sample
  • LAppModel.cs

sample_project/Assets/Resources/live2d/shizuku
  • shizuku.moc.bytes
  • shizuku.model.json.bytes
  • shizuku.pose.json.bytes
  • shizuku.physics.json.bytes
  • motionsフォルダ内のモーションファイル
  • shizuku.1024/texture_00.png
  • shizuku.1024/texture_01.png
  • shizuku.1024/texture_02.png
  • shizuku.1024/texture_03.png
  • shizuku.1024/texture_04.png
  • shizuku.1024/texture_05.png



◆プロジェクトの作成と下準備

新規プロジェクトを作成して、プロジェクトビューにフォルダを作成していきます。

プロジェクトビューで「Create」 → 「Folder」でフォルダを5つ作り、「Editor」、「Live2D」、「Resources」、「Scene」、「Scripts」とそれぞれ名前を変更します。


https://sites.google.com/a/cybernoids.jp/dst5scvjj-cubism-unity/c-sharp/tutorial/tutorial-sampleapp1/2013-02-27_21h11_54.png?attredirects=0
https://sites.google.com/a/cybernoids.jp/dst5scvjj-cubism-unity/c-sharp/tutorial/tutorial-sampleapp1/2013-09-10_12h06_57.png?attredirects=0



◆Live2D SDK とリソースのインポート

「Live2D」フォルダに Live2D SDK の 「Live2D」 内のファイルをドラッグアンドドロップします。

https://sites.google.com/a/cybernoids.jp/dst5scvjj-cubism-unity/c-sharp/tutorial/tutorial-sampleapp1/2013-09-10_12h09_14.png




「Scripts」フォルダに Live2D SDK の「Scripts」内のフォルダをドラッグアンドドロップします。

https://sites.google.com/a/cybernoids.jp/dst5scvjj-cubism-unity/c-sharp/tutorial/tutorial-sampleapp1/2013-09-10_12h09_39.png




「Editor」フォルダに、Live2D SDK の「Editor」フォルダ内にある「CreateCanvas.cs」をドラッグアンドドロップします。
このファイルを追加したら、メニューバーに「Live2D」という項目が出来ているはずです。
しばらくしてもメニューバーにない場合は、エディタを再起動してください。

https://sites.google.com/a/cybernoids.jp/dst5scvjj-cubism-unity/c-sharp/tutorial/tutorial-sampleapp1/2013-09-10_12h23_48.png




「Resoures」フォルダに「live2d」フォルダを作成し、Live2D SDK の「Resources/live2d」フォルダ内にある「shizuku」フォルダをドラッグアンドドロップします。

https://sites.google.com/a/cybernoids.jp/dst5scvjj-cubism-unity/c-sharp/tutorial/tutorial-sampleapp1/2013-09-10_12h25_26.png




続けて、「Resoures」フォルダに Live2D SDK の「Resources」フォルダ内にある「Live2D_Canvas」フォルダをドラッグアンドドロップします。

https://sites.google.com/a/cybernoids.jp/dst5scvjj-cubism-unity/c-sharp/tutorial/tutorial-sampleapp1/2013-09-10_12h26_03.png





プロジェクトビューはこのようになります。

https://sites.google.com/a/cybernoids.jp/dst5scvjj-cubism-unity/c-sharp/tutorial/tutorial-sampleapp1/2013-09-10_12h26_25.png





◆Live2Dモデルを表示する平面の作成


メニューバーの「Live2D」 → 「Create Live2D Canvas」で平面を作成します。
平面は、LAppModel.cs がつけられ、透明な状態で作成されます。

https://sites.google.com/a/cybernoids.jp/dst5scvjj-cubism-unity/c-sharp/tutorial/tutorial-sampleapp1/2013-09-10_13h51_52.png




名前を変更しておきます。ここでは 「Live2D_Canvas_Shizuku 」とします。

https://sites.google.com/a/cybernoids.jp/dst5scvjj-cubism-unity/c-sharp/tutorial/tutorial-sampleapp1/2013-09-10_17h53_33.png




シーンビューとゲームビューはこのようになっています。

https://sites.google.com/a/cybernoids.jp/dst5scvjj-cubism-unity/c-sharp/tutorial/tutorial-sampleapp1/2013-09-10_13h52_40.png





◆LAppModel の設定

しずくのモデル用 .json ファイルを「Live2D_Canvas_Shizuku」にひもづけられたLAppModelのModelJson にドラッグアンドドロップします。

https://sites.google.com/a/cybernoids.jp/dst5scvjj-cubism-unity/c-sharp/tutorial/tutorial-sampleapp1/2013-09-10_13h53_30.png




再生ボタンをクリックして、モデルが表示されれば完了です!

https://sites.google.com/a/cybernoids.jp/dst5scvjj-cubism-unity/c-sharp/tutorial/tutorial-sampleapp1/2013-09-10_13h54_36.png

Comments