# Morphing

## What is morphing? <a href="#what-is-morphing" id="what-is-morphing"></a>

With morphing, we can change the shape of the outfit, and add a variety of customizations to the form without changing the outfit itself.&#x20;

**For example** – make the waist narrower.&#x20;

<div align="center"><figure><img src="https://3218779843-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkslFeBWq7WY5I3rCgGqo%2Fuploads%2FPsD2Ndw6OiXEgVm2XtAS%2Fdress_morphing2.gif?alt=media&#x26;token=6221d1a2-0faf-4cb9-8363-b89c192b2a6f" alt=""><figcaption><p>Shapekey example</p></figcaption></figure></div>

## Definitions <a href="#definitions" id="definitions"></a>

* **Morphing** - the general process of re-shaping cloth
* **Shapekey/shape** - single parameter to control. Can be [two types](#understanding-morphing-types).

## **Shapekey** types <a href="#understanding-morphing-types" id="understanding-morphing-types"></a>

* **Option&#x20;**<mark style="color:blue;">**(opt)**</mark> - shapekey like hiding/showing part of an object, can’t have intermediate values, but only 0 or 1. Mostly will be custom per wearable

  <div align="center"><figure><img src="https://3218779843-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkslFeBWq7WY5I3rCgGqo%2Fuploads%2FoZalQGqiYQ8ACWuf2IKB%2Fdress_morphing_opt.gif?alt=media&#x26;token=e462e364-7b8d-4a39-9e72-34e83896e8c7" alt=""><figcaption><p>Option shapekey example</p></figcaption></figure></div>
* **Slider&#x20;**<mark style="color:blue;">**(sld)**</mark> - shapekey which applies deform in a smooth way and allows to set intermediate values from 0 to 1

  <div align="center"><figure><img src="https://3218779843-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkslFeBWq7WY5I3rCgGqo%2Fuploads%2FlEsj4VlTsuwpCd1edP6C%2Fdress_morphing_sld.gif?alt=media&#x26;token=c087e22b-e3b6-4624-9c27-9c915697e5cd" alt=""><figcaption><p>Slider shapekey example</p></figcaption></figure></div>

## Naming convention

We always add prefix <mark style="color:red;">**cuz.**</mark> and [<mark style="color:blue;">**type code**</mark>](#understanding-morphing-types)

<mark style="color:red;">**cuz.**</mark><mark style="color:blue;">**sld.**</mark>**waist\_width** - for slider

<mark style="color:red;">**cuz.**</mark><mark style="color:blue;">**opt.**</mark>**top\_stripes** - for option

## Shapekey categories

<table data-view="cards"><thead><tr><th></th><th></th><th></th><th data-hidden data-card-cover data-type="files"></th></tr></thead><tbody><tr><td><img src="https://3218779843-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkslFeBWq7WY5I3rCgGqo%2Fuploads%2F5OowGbX2cOzwkseDcKq2%2Fface.png?alt=media&#x26;token=d7382f11-7f7c-4827-8293-78db25b9d443" alt=""></td><td>             <strong>Face</strong></td><td>    masks/accessories</td><td></td></tr><tr><td><img src="https://3218779843-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkslFeBWq7WY5I3rCgGqo%2Fuploads%2F4hpPIXvRJOYk9nvrP6hX%2Fhead.png?alt=media&#x26;token=1f697444-691a-4413-9d45-b8c1534204b7" alt=""></td><td>       <strong>Head</strong></td><td>           headwears</td><td></td></tr><tr><td><img src="https://3218779843-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkslFeBWq7WY5I3rCgGqo%2Fuploads%2Fjry84XKOi67tpEuDoP7h%2Fupper%20body.png?alt=media&#x26;token=6485186f-0c33-4305-9289-a39780c2b4d6" alt="">          </td><td>             <strong>Upper body</strong></td><td> t-shirts/jacets/dresses</td><td></td></tr><tr><td><img src="https://3218779843-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkslFeBWq7WY5I3rCgGqo%2Fuploads%2FFGKYKp8MHU6u7n9SLzgB%2Flower%20body.png?alt=media&#x26;token=aac2fe99-c8ee-4090-b3ba-fb15b9565f2a" alt=""></td><td>           <strong>Lower body</strong></td><td> pants/trousers/shorts</td><td></td></tr><tr><td><img src="https://3218779843-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkslFeBWq7WY5I3rCgGqo%2Fuploads%2FgJeTicChkhIk8JpItRJG%2Ffeet.png?alt=media&#x26;token=d66ae5ca-b25a-402b-963e-218efa84d9a8" alt=""></td><td>              <strong>Feet</strong></td><td>boots/sneakers/slippers</td><td></td></tr></tbody></table>

* ## Types
* **Suggested** - general shapekey that works for every cloth in the category, uses the identic name.      For example - *<mark style="color:blue;">cuz.sld.chest\_volume</mark>* (works for every upper body outfit)
* **Forbidden** - shapekeys which are not applicable for the exact category
* **Custom** - completely custom shapekey for specific cloth. Uses unique names.                                  For example - *<mark style="color:blue;">cuz.opt.fringe\_hide</mark>* (hides unique cloth element)

## <mark style="color:green;">Suggested</mark>/<mark style="color:red;">Forbidden</mark> shapekeys for each category

<details>

<summary>Face</summary>

* <mark style="color:green;">**Puffiness**</mark> (if only acceptable)
* <mark style="color:red;">**Scale/Position**</mark> - forbidden (we need to keep stick geometry which is attached to body directly, and only adjust what is extra)

</details>

<details>

<summary>Head</summary>

* <mark style="color:green;">**Height**</mark> (makes hats higher by moving upper verts up using proportional editing)
* <mark style="color:green;">**Blinder volume**</mark> (makes blinder longer or bigger)
* <mark style="color:green;">**Blinder angle**</mark> (changes blinder angle, making it flat or bending it)
* <mark style="color:green;">**Puffiness**</mark> (inflates hat by adding more volume, but avoiding of changing the bottom line)
* <mark style="color:green;">**Narrowing top**</mark> (scale horizontaly top verts of hat using proportional editing)
* <mark style="color:red;">**Width/Length**</mark> - forbidden (won’t fit the head)

</details>

<details>

<summary>Top</summary>

* <mark style="color:green;">**Puffiness**</mark> (turns a jacket into a puffer jacket. Can be applied to any outfit (avatar can look like the Michelin mascot)
* <mark style="color:green;">**Chest size**</mark> (larger-smaller breast size (as if female)
* <mark style="color:green;">**Chest volume**</mark> (larger or smaller chest. Be a swimmer or be an office clerk)
* <mark style="color:green;">**Belly**</mark> (larger-smaller stomach. (Avatar becomes fatter or thinner. If we keep Upper waist constant, but change this, you get a ‘beer belly’)
* <mark style="color:green;">**Waist**</mark> (wider-thicker upper waist (Avatar becomes fatter or thinner)
* <mark style="color:green;">**Collar volume**</mark> (makes collar wider/narrower like with formal shirts)
* <mark style="color:green;">**Collar height**</mark> (adjusting collar height)
* <mark style="color:green;">**Sleeve right hide**</mark> (hides right sleeve until shoulder so it’s like sleeveless jacket)
* <mark style="color:green;">**Sleeve left hide**</mark> (hides left sleeve until shoulder so it’s like sleeveless jacket)
* <mark style="color:green;">**Belly hide**</mark> (makes crop top)

</details>

<details>

<summary>Bottom</summary>

* <mark style="color:green;">**Belt thickness**</mark> (thickness of the belt or belt area, can look like height of this area)
* <mark style="color:green;">**Puffiness**</mark>&#x20;
* <mark style="color:green;">**Leg lenght hide**</mark> (hides lower part of pants, so they look like shorts)
* <mark style="color:green;">**Glutes volume**</mark> (adjust butt scale, as if Kim Kardashian)
* <mark style="color:green;">**Leg Thickness**</mark> (if mask is covering whole leg area)
* <mark style="color:red;">**Leg lenght**</mark> - forbidden (will shift geometry weights)

</details>

<details>

<summary>Feet</summary>

* <mark style="color:green;">**Feet size**</mark> (larger/smaller foot size)
* <mark style="color:green;">**Puffiness**</mark>
* <mark style="color:green;">**Tread height**</mark> (genereal height of shoe protector)
* <mark style="color:green;">**Heel height**</mark> (height of heel and gap between shoe front part and heel)

</details>

For <mark style="color:green;">**suggested**</mark> shapekeys, if they can exist on the model, we use the <mark style="color:green;">**suggested name**</mark> and NOT create new one.

## <mark style="color:orange;">Custom</mark> shapes <a href="#custom-shapes" id="custom-shapes"></a>

Due to the unique nature of some wearables, they can have **unique** shapes as described below:

{% tabs %}
{% tab title="Custom optional shapekeys" %}
Shapes that **hide** some unique part of the object

<div align="left"><figure><img src="https://3218779843-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkslFeBWq7WY5I3rCgGqo%2Fuploads%2F3RJGegmv6E2hwyw7FWmh%2Fcustom.gif?alt=media&#x26;token=9f4d27e5-1f28-49b5-873d-fff7c4542616" alt=""><figcaption></figcaption></figure></div>
{% endtab %}

{% tab title="Custom slider shapekeys" %}
Shapes that **change** some unique elements

<div align="left"><figure><img src="https://3218779843-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkslFeBWq7WY5I3rCgGqo%2Fuploads%2FRTYs4UvjPiiVeYJUTgIW%2Fbelt.gif?alt=media&#x26;token=7d81642c-b566-4bb3-9ad4-001b3e509f01" alt=""><figcaption></figcaption></figure></div>
{% endtab %}
{% endtabs %}

For <mark style="color:orange;">**Custom**</mark> shapekeys, if we can add them, the name must be set by the 3D artist using the following rules:

1. Define the body part where shapekey takes place: **head, face, upper\_body, lower\_body, feet** or if you have to dive on a lower level and your shapekeys are not symmetry, use the following: **arm\_right, arm\_left, leg\_right, leg\_left, torso**, etc
2. If shapekey is adding or hiding some cloth element don’t use **hide** or **show** keys, instead just specify part of the body and element name like this - **cuz.opt.upper\_body\_stripes**
3. If one area has different affection types, you need to specify them as the last key in the name, like **width, length, size** etc.

Example: **cuz**<mark style="color:orange;">**.**</mark>**sld.handle\_size**

<div align="left"><figure><img src="https://3218779843-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FkslFeBWq7WY5I3rCgGqo%2Fuploads%2F0Mh8FvQZYrO3PvEyoRWQ%2Fbeer.gif?alt=media&#x26;token=1f392aa4-bb1d-406d-b16d-1fbb30dea5be" alt=""><figcaption></figcaption></figure></div>
