2. Prepare to move the illustration

You can also download the latest Cubism Editor here.

Processing Illustrations Load the PSDs created in the previous section into the Editor and prepare to add movement to them.
The video explains the operational procedures and things to be aware of when dividing a mesh.

Basic Tutorial List

  1. Illustration Processing
  2. Prepare to move the illustration
  3. Let's add facial expressions
  4. Let's get our bodies moving
  5. Facial XY motion attachment
  6. Let's add motion

Tutorial Video in Japanese

Below is a link to a manual with more detailed explanations in the video.

  1. PSD import [0:15]
  2. About ArtMesh [0:40]
  3. Editing the mesh [1:21]

English Tutorial Video

Chinese version Tutorial Video

Please refer to the following URL for the Chinese version of the video tutorial.


The data of the broken mesh created in the movie can be downloaded from here. Please refer to.
* Please be sure to read the license agreement for the free materials before downloading.
The completed sample model of “Hiyori Momose” appearing in the video => Click here for DL
* Some browsers may not allow you to download the file even if you click the link.
 In that case, please right-click and save the link.


Video Review

Here, the processed illustration data is loaded into Editor to prepare for moving the illustration.


PSD Import

Select [Open] from the [File] menu and select the PSD you wish to load.
PSDs can also be loaded by dragging and dropping them directly into the view area.

Once loaded, the illustration will appear on the canvas.

Information on the loaded illustration is displayed on the parts palette in the upper left corner of the screen.


About ArtMesh

Click on the loaded illustration to see white dots and gray lines. We call this a “mesh”.
A texture to which a “mesh” is assigned is called an “ArtMesh”.
The white dots in the “mesh” are called vertices, and by moving these vertices, the texture can be deformed.

For a detailed explanation of terms, see the Live2D Glossary.

Mesh editing (automatic)

When first loaded, only four vertices are struck for the ArtMesh.
The number of points is too small to deform and it is difficult to get the desired deformation, so it is necessary to break the mesh a little finer.

Since adjusting everything one by one would be a difficult task, all meshes are automatically reassigned once.
After selecting all ArtMeshes with Ctrl+A, click [Auto Generate Mesh] from the menu above.

A configuration dialog will then appear.
The size and width of the mesh can be adjusted by changing the values from the settings dialog.
Here, we will break the mesh with the default settings.
Click on a value and press Enter to apply the mesh.

Edit mesh (manual)

Eyebrows, eyelashes, and lips are the most common parts to be deformed significantly, so it is better to manually mesh them to create a clean shape.

With the ArtMesh you wish to edit selected, press [Edit Mesh Manually] to enter mesh edit mode.
Ctrl+E will take you to a similar screen.

From here, you can add or delete points.

First, select the Eraser tool in the Tool Details palette to erase all the dots you want to erase.

The size of the eraser tool can be changed by dragging it on the canvas while pressing B.
Even with a non-Eraser tool selected, you can hold down Ctrl and drag the canvas to select multiple vertices for erasing.

To add a vertex, select the icon with the plus sign, then click on the canvas. Now you can hit the apex.

When the next dot is struck, the line is automatically connected from dot to dot.

If you hit a dot by mistake, you can erase the vertex by selecting the icon with the minus sign and clicking on the one you want to erase.

While in the Add Point tool, it is possible to erase a point in the same way by pressing Alt.

If you want to connect lines after hitting dots, press [Generate Polygons] to automatically connect the lines.

Once the desired shape is achieved, press the check button on the canvas to complete the adjustment.
If the adjustment is completed while the mesh does not fully enclose the texture, the texture outside the mesh will not be visible.
Divide the mesh so that it tightly encloses the texture.


Recommended division by parts

How to Split an Eyebrow

The eyebrows should form a triangle between the lines.
Another method is to draw a line through the middle of the eyebrow.
It is recommended that the line width be uniform.

How to split an eyelash

The eyelashes deform greatly, so break the mesh a little finer.
As with the eyebrows, the line should be drawn through the middle of the line.

Speaking style

Draw a line across the top of the lip line and enclose the border in the skin color area.
Do not forget to re-strike not only the upper lip but also the lower lip.

Points to keep in mind when creating meshes manually

Although these are the only three we will introduce here, basically, the following points should be kept in mind when creating meshes manually in order to create beautiful deformations.

• Make a nice equilateral triangle
• Add a point across the line
If you have trouble deforming parts other than those introduced here, please refer to the sample models.


The next step is to actually deform the ArtMesh to give it expression.
Previous section “1. Processing Illustrations” | Next section “3. Let's add facial expressions

© 2010 - 2022 Live2D Inc.