3. Facial expression

You can also download the latest Cubism Editor here.

Using Live2D, we will actually move the illustrations.
This time, we will add movements for [opening and closing of eyes], [deformation of eyebrows], and [opening and closing of mouth].

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. Part  [0:10]
  2. About parameters [0:45]
    Parameter palette
    Parameter Editing
  3. Variable path [2:15]
  4. Clipping Mask [3:25]

English Tutorial Video

Chinese version Tutorial Video

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


You can download the data with the movements created in the video 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

This section describes specific ways to add facial expressions to a model.
In particular, the quality of the eye and mouth movements can vary greatly depending on the method of deformation, so try to learn how to add facial expressions here!


Locking on parts

First, lock all parts except the eyes to prevent them from being edited.
You can lock a part by clicking the key symbol on the parts palette.

Eye opening and closing

Lock all parts except for the eyes, making it impossible to edit anything except the eyes.
Once locked, select the object to be moved. We will start the movement with the left eye, so select all the left lashes.
Multiple selections can be made by holding down Shift and clicking.

Select the parameters to be moved with the selection. Parameters that are grayed out are selected.

First, select “Left Eye Open/Close” and click on [Add 2 Keyforms] at the top of the parameter palette.
The selected ArtMesh now has parameters, and the parameters that were gray now have green dots.
A parameter with red and white dots while an object is unselected has some object key inserted.
When an object is selected, a green dot indicates that the object has a parameter attached to it.

Move the lashes to try it out.

If you move a parameter in this state, it will move from the position where you moved it to the position where you were at the beginning.
This is the state with parameters.

If you move one point and then the other, you will lose the initial position.
To prevent this, check the “Lock default Deformer” checkbox in the Parameter Palette menu.
This way, the object will not be editable at the default value.

Eyelash deformation

We will actually add movement to the lashes. Hide the eyeballs to make it easier to create the closed eye shape.

Move the parameter to the left and confirm that the number next to the parameter is 0.
0 and transforms it into a closed eye.
Click on the lashes and a red box will appear, grab the center of the box and lower it to the position of the lower lashes.

From here, we deform the meshes of the inner corner and outer corner of the eyes to create the closed eyes, but it is difficult to move the vertices one by one.
In such a case, click on the [Deform Path edit] from the [Tools Menu] above.

Clicking on the ArtMesh with the deformation path selected will draw a line.
Note that deformation paths cannot be drawn unless an ArtMesh is selected.
If you return to the selection tool and click on the struck green point, it changes to red, but if you move this point, the area around the point is deformed at once.
This will create the shape of the closing eye.

Once the general shape is created, we can now directly move the vertices of the ArtMesh to shape it.
Once you have deformed the main eyelashes, move the parameters around to check them.


Deformation of the whites of the eyes using clipping

If eyeballs are displayed in this state, they will be visible even when the eyes are closed.
Therefore, use the clipping function to create movement so that the eyeballs are not visible when closed.

First, select the white eye.
Copy the ID as it appears in the inspector palette and paste the white eye ID into the eyeball clipping text box.

Now the eyeballs are clipped to the whites of the eyes.
When the whites of the eyes are actually moved, eyeballs are not displayed outside the range of the whites.
Let's put a parameter on this white eye. If the whites of the eyes are crushed when they are closed so that they are hidden by the eyelashes, the eyeballs will not be visible.

This completes the left eye's motion attachment.
Let's do the same movement for the right eye.


Eyebrow deformity

Similar to the eyelashes, eyebrows can be moved using a deformation path. The procedure is almost the same.

With the left eyebrow ArtMesh selected, select the parameters for the left eyebrow deformation.
This time, instead of inserting two points, insert three points.
The deformity is such that the eyebrows are raised when the parameter goes to the left side and the eyebrows are raised when the parameter goes to the right side.

By the way, you can tell how many points to insert by where the black dot in the parameter is located.
Also, please refer to the sample model while adding parameters.

It is a variant, but let's start with the troubled eyebrows first.
Select the ArtMesh with the parameter set to [-1.0], and draw a deformation path to move the points. Edit the vertices for fine adjustment.
Troubled eyebrows take the shape shown in the following image.

Let's continue to create the right side of the parameters.
This variant is mainly used when surprised.
Contrary to a troubled brow, the brow is transformed so that the center of the brow is raised.

Make the same movement on the right eyebrow.


Mouth deformity

Select Upper Lip Lower Lip Mouth and insert two keys in [Mouth Open/Close].
In this illustration, the mouth is open at the time of the original drawing, so we will create a closed mouth when the parameter is 0.

Upper lip deformity

First, create the shape of the upper lip. It is difficult to see the other parts while they are still displayed, so we will hide them once.
Draw a deformation path on the upper lip. The skin tone part will also move significantly if only the top of the line is drawn.

This will cause the vertices to intersect and make it difficult to make adjustments later, so a deformation path is also drawn for the skin tone area.
In this way, moving the deformation path on the line does not affect the upper portion, and the vertices of the skin color area will not move.
Move the deformation path to create the shape. Once the general shape is created, directly adjust the vertices and shape.

Lower lip deformity

When shaping the lower lip, be careful to keep the lines as close as possible to the shape of the upper lip.
The lower lip is hidden by the upper lip when closed, so the line may be smudged or positioned too high.
However, in this condition, the shape of the closure at the time of interpolation may become dirty. So, try to match the shape with the upper lip as much as possible.

Oral deformity

If the mouth protrudes from the skin-colored part of the mouth, move the vertex so that the skin-colored side of each mesh widens, or add a parameter to the mouth as well so that the mouth shrinks when the mouth is closed.


This is the end of this motion attaching.
Other parts can be moved in the same way, so please refer to the sample models and other materials to try adding movement.
In the next video, we will add movement to the hair and body.

Previous section “2. Preparation to move the illustration” | Next section “4. Let's move the body

© 2010 - 2022 Live2D Inc.