Using Live2D in Your Game
Important
This tutorial is for TyranoBuilder v184 or later, using models made with Cubism3. To use Cubism2 models, please use TyranoBuilder v182 or earlier, or you can convert earlier models to v3.0 using the tool at https://docs.live2d.com/en/cubism-editor-manual/convert-id/
Live2D allows 3D models and animation to be easily created from 2D images! Here’s a simple demo to give an idea of what it can do:
What do you think? Exciting, right?!
TyranoBuilder supports Live2D, and even has official cooperation and technical back-up from Live2d Inc., so you can be a part of this new era of visual novels!
Now let’s look at how to add it to your games!
Preparation
First, we’ll enable the Live2D functionality in TyranoBuilder.
From the menu at the top of the TyranoBuilder window, select Project > Add-In Components as below:
Then place a check next to the Live2D Components
Hit Accept to accept the User Agreement that pops up…
And when the Live2D components appear in the Tools Area on the left, you’re all set!
Add a Live2D Model
The model that we’ll use in this tutorial is available at the below link:Go ahead and download the Live2D model and extract it to a suitable location on your computer. There are actually three models in the file and for this tutorial we
* If you’d like to try using other models, there are several free samples available from the Live2D homepage. Click the below link to visit the Live2D page and download them:
Add the Live2D Model to the Scene
Right then, let’s add the Live2D model to a game.
The first step is to import the Live2D model that you downloaded to the project.
Click the Live2D button at the top right of the TyranoBuilder window.
Click the ‘Add Live2D’ button and select the model3.json file from the model data folder that you downloaded and unzipped earlier.
For Haru, you should select the file /Haru.model3.json.
The Live2D model and motion files will be automatically matched.
Once the model is loaded, Select a motion file to see the motion in action.
From the Tools Area drag and drop the ‘Add Live2D’ component into the Scene Editor.
From the Live2D parameters in the Settings Area, select ‘Haru’ from the Model drop down.
Click the handy Live2D Positioning Tool and drag and drop to set the position of the Live2D model.
Save the project and preview.
The Live2D model displayed, right?!
How easy was that?!
Playing Motions
You can set Live2D motions at the timing that suits you.
For example, you can have characters get angry, blush, and so on to match the in-game situation.
Setting motions to play at your preferred timing in TyranoBuilder is simplicity itself.
Drag and drop the ‘Live2D Motion’ component from the Tools Area into the Scene Editor.
Available motions are automatically displayed, so simply select which motion you’d like to use.
With the motion selection tool, you can check the motion as you position the character.
Go ahead and save and preview the game.
Your motion played, right?
To have a model character exit the scene, use the ‘Remove Live2D’ component, and to change the position, use the ‘Move Live2D’ component.
Add Lip-sync!
With Cubism3 models configured with lip data, you can make the character’s mouth move while the character is talking.
First, check ‘Enable lip-sync’ in the ‘Add Model’ component parameters area, then enter the name of the model to use lip-sync. In this case, we select ‘Haru’.
Then use the label #Haru in the relevant the dialog component.
Now when the game runs, the character’s lips will move during the dialog scene.
To change the speed that the lips move, set a shorter time in the lip-sync Duration parameter.
Tips to Improve Performance
Live2D consumes more memory and processing than normal flat images and using many Live2D models can slow down the game. Performance will vary depending on the specifications of the computer running the game, so it’s always good practice to consider how to reduce memory usage!
To minimize slow down when using Live2D, use the ‘Load Model’ component as little as possible and make frequent use of the Live2D ‘Reset’ component. The reasons for this are that loading Live2D models take up memory and resetting Live2D releases this memory.
Probably the simplest approach is to use the ‘Reset’ component at times such as the end of a scene or a change of scene. Once Live2D has been reset, the models will need to be loaded again using the ‘Load’ component.
More Options with TyranoScript
The above functions and more can be carried out by using TyranoScript! See the Live2D section of the TyranoScript Tags Reference for details.