Dress Up Start Guide

overview

Magica Cloth has a dress-up system.
Using the dress up system, you can attach various costumes to the character.
For example, you can add / delete various hair and clothes to the body.
This feature can be used with or without MagicaCloth components.

 

Avatar and AvatarParts

You need two components, Avatar and AvatarParts, to change the dress up.

Component Description
MagicaAvatar Manage the character body.
This component must be attached to the character to be dressed up.
It is also used for other than changing clothes.
MagicaAvatarParts Manage dress-up parts.
This component must be attached to a separate asset for dress-up.

 

Separate model into body and parts

Here, we will explain how to create a dress-up asset using the “SD Unity-chan” model as an example.

First, you need to separate the model into a body (Avatar) and parts (AvatarParts).
In this example, I divided the model into four parts.

Parts Component Description
Body MagicaAvatar The character body.
Only the skeleton required for the animation will be used as the basis for changing clothes.
Hair MagicaAvatarParts Hair parts.
Face MagicaAvatarParts Face parts.
Cloth MagicaAvatarParts Cloth parts.

First, we will separate the model into these four assets.

Body

The body deletes all unnecessary ones except for the GameObject necessary for animation.
Of course, there is no problem if you leave what you need.
The main body assets are as follows.

Hair

Delete unnecessary objects, leaving only the GameObject and renderer necessary for hair.
And I added BoneCloth and some colliders to shake the hair.

Face

Faces also remove unnecessary GameObjects and renderers.

Cloth

Clothes also remove unnecessary GameObjects and renderers.
And I added RenderDeformer / VirtualDeformer / MeshCloth and some colliders to shake the skirt.

 

Attach Avatar components to the body

When you’re ready, first attach the MagicaAvatar component to the body asset.
MagicaAvatar is a core component that manages various information including dress up.

Attach the MagicaAvatar component to the top of the body asset as follows:

If there is no problem, an icon will be attached to the hierarchy and the inspector will be displayed as follows.

There is no problem if [No Problem] is displayed in the inspector.
If you have a problem, the name of the body GameObject is in conflict.

When performing dress up, since the position is searched by the name of GameObject, if GameObject name is duplicated, it may not work properly.
In the above example, two or more GameObjects [bone_eye_L] are duplicated.
If a warning is displayed, change the GameObject name so that it is not duplicated.

Once all settings are complete, make the asset a prefab.

 

Attach AvatarParts components to hair, face and clothing

Attach the MagicaAvatarParts component to the hair, face, and clothing that will be the dress-up parts.

Attach the MagicaAvatarParts component to the top of the parts asset as follows:

If there is no problem, an icon will be attached to the hierarchy and the inspector will be displayed as follows.

There is no problem if [No Problem] is displayed in the inspector.
If you are having problems, GameObject names are duplicated.
Please change the name of GameObject so that it is not duplicated.

Once all settings are complete, make the asset a prefab.
This completes the setup of the body and parts.

Main body and 8 parts prepared as samples

The project contains the body of “SD Unity-chan” and eight parts as samples.
Parts are in MaigcaCloth / Example (Can be deleted) / SD_Kohaku_chanz.
Please use as a reference.

 

Run-time dress-up test

Normally, when changing clothes, an API (program) procedure is required.
However, simple tests are possible without writing a program.

First, place the main body Avatar in the scene and execute the editor.
The Avatar Inspector changes as follows.

By dropping avatar parts on this [Drag & Drap] panel, you can easily test dress up.

Let’s drop the hair parts created earlier.

After dropping, you should be able to see that the hair parts have been attached to the body.

The Avatar inspector also displays a list of currently attached parts.

If you look at the hierarchy of the body, you should see that the hair assets are merged into the body, as in the image.

To delete a part, press the [Remove] button in the inspector.
This will remove the avatar part GameObject from the body.
If a GameObject is referenced from multiple parts, it will only be deleted if the reference count reaches zero.

 

Collider combination

The cloth component collider group has a [Merge Avatar Collider] check.

When this check is ON, when Avatar Parts are attached, the colliders on the main unit will be merged.
This allows you to place a collider on the main body in advance and use that collider for Avatar Parts components.

API

In a game, dress up is usually performed by an API (program).
Please refer to the following API / MagicaAvatar page for the API for operating avatars.

MagicaAvatarAPI

Sample scene

The package includes a [DressUpSample] scene as a sample of changing clothes.
Please refer to this sample for actual operation and API.

 

The setup is now complete.