Live2D Cubism 4 Editorで出力したモデルを表示するアプリケーションのサンプル実装です。

Cubism Coreライブラリと組み合わせて使用します。

本SDKを使用する前に、注意事項をご確認ください。

こちら

.
├─ .vscode              # Visual Studio Codeのタスクや設定が含まれるディレクトリ
├─ Core                 # Cubism Coreが含まれるディレクトリ
├─ Framework            # レンダリングやアニメーション機能などのソースコードが含まれるディレクトリ
└─ Samples
   └─ TypeScript
      └─ Demo           # サンプルプロジェクトが含まれるディレクトリ
         ├─ Resources   # モデルのファイルや画像などのリソースが含まれるディレクトリ
         └─ src

モデルをロードするためのライブラリです。

当リポジトリではCubism Coreを管理していません。 こちらからCubism SDK for Webをダウンロードして、 Coreディレクトリのファイルをコピーしてください。

1. Node.jsをインストールします。

2. Visual Studio Codeをインストールします。

3. Visual Studio Codeの拡張機能として下記を追加します。

   • Debugger for Chrome
   • Live Server

1. Visual Studio Codeでプロジェクトディレクトリを開きます。

2. ビルドに必要な物をインストールします。 ctrl+shift+P(macOSでは⌘+⇧+P)でTasks: Run Taskからnpm: installを選択、 または、package.jsonがあるディレクトリ上にてターミナル上でnpm installでサーバが起動します。

3. ビルドを行います。 ctrl+shift+B(macOSでは⌘+⇧+B)でビルドタスクを選択、またはターミナル上でnpmコマンドを実行してJavaScriptを生成します。

ビルドした成果物はそのままファイルを開くだけでは正常に動作しないため、ローカルサーバを起動する必要があります。

Visual Studio Codeの画面下の水色のフッターから「Go Live」をクリックするとサーバが起動します。 ブラウザ上でindex.htmlのパスまで進むと動作を確認することが出来ます。

ファイルの更新が行われると自動でブラウザのリロードが行われます。 また、F5を押すとでDebugger for Chromeの拡張が起動してデバッグを行うことが出来ます。

ctrl+shift+P(macOSでは⌘+⇧+P)でTasks: Run Taskからnpm: serveを選択、 または、package.jsonがあるディレクトリ上にてターミナル上でnpm run serveでサーバが起動します。 ブラウザ上でindex.htmlのパスまで進むと動作を確認することが出来ます。

シンプルな構成のサーバのため検証時におすすめです。

Cubism SDK Manual

当リポジトリの変更履歴についてはCHANGELOG.mdを参照ください。

Note: 動作確認時のサーバの起動は検証時の方法で行っています。

Cubism Web Samples は Live2D Open Software License で提供しています。

• Live2D Open Software License

  日本語 English

Live2D Cubism Core for Web は Live2D Proprietary Software License で提供しています。

• Live2D Proprietary Software License

  日本語 English

Live2D のサンプルモデルは Free Material License で提供しています。

• Free Material License

  日本語 English

  • ./Sample/TypeScript/Demo/Resources/Haru
  • ./Sample/TypeScript/Demo/Resources/Hiyori
  • ./Sample/TypeScript/Demo/Resources/Mark
  • ./Sample/TypeScript/Demo/Resources/Natori
  • ./Sample/TypeScript/Demo/Resources/Rice

上記のモデルをご利用になられる場合、こちらで各モデルに設定された利用条件に同意して頂く必要がございます。

直近会計年度の売上高が 1000 万円以上の事業者様がご利用になる場合は、SDKリリース(出版許諾)ライセンスに同意していただく必要がございます。

• SDKリリース(出版許諾)ライセンス

All business users must obtain a Publication License. "Business" means an entity with the annual gross revenue more than ten million (10,000,000) JPY for the most recent fiscal year.

• SDK Release (Publication) License