# Creating Buildable Objects

In Easy Grid Builder Pro 2 there are four types of Buildable Objects that you can use to Build on your grid. They are all unique and occupy grid cells in different ways. They are:

* [**Buildable Grid Objects**](https://soulgamess-studio.gitbook.io/easy-grid-builder-pro-2-documentation/primary-components/buildable-grid-object)
* [**Buildable Edge Objects**](https://soulgamess-studio.gitbook.io/easy-grid-builder-pro-2-documentation/primary-components/buildable-edge-object)
* [**Buildable Corner Objects**](https://soulgamess-studio.gitbook.io/easy-grid-builder-pro-2-documentation/primary-components/buildable-corner-object)
* [**Buildable Free Object**](https://soulgamess-studio.gitbook.io/easy-grid-builder-pro-2-documentation/primary-components/buildable-free-object)

It is highly recommended to use the provided links to navigate to their respective pages and read about the **Buildable Types** to gain a clear understanding of how they work with **Easy Grid Builder Pro 2**.

For this guide, we will create five **Buildable Objects**: three building objects and two tree objects.

* Inside your **2D City Builder Tutorial Demo** folder, create a new folder and name it **2D Top Down Sprites**.
* Navigate to: <mark style="color:purple;">**SoulGames > EGBPro 2 Examples > Example Assets > 2D Top Down Assets**</mark><mark style="color:purple;">.</mark> Select all the sprite images in this directory and press **Ctrl + C** to copy them.
* Return to your newly created **2D Top Down Sprites** folder and paste the images by pressing **Ctrl + V** on your keyboard.

This process will organize the assets for easy access as we create the Buildable Objects.

<figure><img src="https://2651556506-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FeumhICLT4oHoEIEssOjB%2Fuploads%2FDDB9cIKJDXHhfQvvSpkp%2Fimage.png?alt=media&#x26;token=4488bab8-7110-4191-9034-289d52a8f8ea" alt=""><figcaption></figcaption></figure>

Now, create another folder inside the **2D City Builder Tutorial Demo** folder and name it **2D Buildable Objects**. This folder will store the Buildable Object Prefabs.

***

## <mark style="color:green;">Configuring Buildable Objects</mark>

**Easy Grid Builder Pro 2** introduces a streamlined way to create Buildable Objects. Follow these steps:

* In your scene, right-click in the **Hierarchy**, select **Create Empty**, and name the GameObject. For example, name it **"TopDown House 01"**.
* Add the **Buildable Object Configurator** component to the newly created GameObject.
  * Locate it in: <mark style="color:purple;">**SoulGames > Easy Grid Builder Pro 2 > Scripts > Core Grid Scripts > Grid Buildables**</mark><mark style="color:purple;">.</mark>
  * Alternatively, you can add it through the **Inspector** by clicking <mark style="color:purple;">**Add Component > Easy Grid Builder Pro > Grid Buildables > Buildable Object Configurator**</mark><mark style="color:purple;">.</mark>

<figure><img src="https://2651556506-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FeumhICLT4oHoEIEssOjB%2Fuploads%2F2G5M41nfUtVFSkDopnYk%2Fimage.png?alt=media&#x26;token=071f9726-894e-428f-a121-13fd6ff9d64e" alt=""><figcaption></figcaption></figure>

Since we are creating this object for the **XY axis**, set the **Grid Axis** property in the **Buildable Object Configurator** component to **XY**.

This house object should occupy entire grid cells and align to the center of the grid cell, so set the **Buildable Object Type** property to **Buildable Grid Object**.

Next, follow these steps:

* Navigate to <mark style="color:purple;">**2D City Builder Tutorial Demo > 2D Top Down Sprites > TopDown House 01**</mark> and select the **TopDown House 01** sprite.
* Drag and drop the sprite into the **Scene view**. This will create a new GameObject for the sprite in the scene.
* Select the newly created sprite GameObject and drag it into the **Game Object** property of the **Buildable Object Configurator** component.

This links the sprite to the Buildable Object Configurator.

<figure><img src="https://2651556506-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FeumhICLT4oHoEIEssOjB%2Fuploads%2Fd3kCThPgDNgHSorOFCYj%2Fimage.png?alt=media&#x26;token=952ae12a-78b1-40c3-82fb-c580f0ea68c7" alt=""><figcaption></figcaption></figure>

Now, follow these steps to finalize your **TopDown House 01 Buildable Object**:

* Click on the **Configure Buildable Object** button in the **Buildable Object Configurator** component. This action will remove the configurator and automatically add the appropriate components to your Buildable Object.
* Drag and drop the configured **TopDown House 01 Buildable Object** from the **Hierarchy** into the **2D Buildable Objects** folder. This will create a prefab for the object.
* Delete both the newly created **Prefab** and the reference **GameObject** from the scene to keep it tidy.

Your **TopDown House 01 Buildable Object** prefab is now ready for use!

<figure><img src="https://2651556506-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FeumhICLT4oHoEIEssOjB%2Fuploads%2FZa9NDiUmdJ4H0HuEQfw2%2Fimage.png?alt=media&#x26;token=24dffa6b-2e1f-4027-9dbc-47ecee5080bc" alt=""><figcaption></figcaption></figure>

Now, repeat the same steps to create two more Buildable Object prefabs for the other houses (**TopDown House 02** and **TopDown House 03**):

* For each house sprite (**TopDown House 02** and **TopDown House 03**), follow these steps:
  * Drag the sprite into the scene to create a GameObject.
  * Add the **Buildable Object Configurator** component.
  * Set the **Grid Axis** to **XY** and the **Buildable Object Type** to **Buildable Grid Object**.
  * Assign the sprite GameObject to the **Game Object** property in the configurator.
  * Click **Configure Buildable Object** to finalize it.
  * Drag the completed Buildable Object into the **2D Buildable Objects** folder to create a prefab.
  * Delete the prefab and reference GameObject from the scene.
* **For the Tree Objects**:
  * Follow the same process as the houses, but set the **Buildable Object Type** to **Buildable Free Object** in the configurator.
  * This allows trees to be placed anywhere on the grid without restrictions.
  * Finalize each tree prefab and store them in the **2D Buildable Objects** folder.

Once completed, you’ll have three **house prefabs** and two **tree prefabs** ready for use in your project.

<figure><img src="https://2651556506-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FeumhICLT4oHoEIEssOjB%2Fuploads%2FH3KbGU4C6L93eLqEWBj8%2Fimage.png?alt=media&#x26;token=d6f98dc6-6135-4e99-94f1-9bb08de5b37b" alt=""><figcaption></figcaption></figure>

<figure><img src="https://2651556506-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FeumhICLT4oHoEIEssOjB%2Fuploads%2FuXQt9DyX2cz2cHsTCGxk%2Fimage.png?alt=media&#x26;token=73b446e1-84c3-4bf0-a1a2-de9243becf43" alt=""><figcaption></figcaption></figure>

***

## <mark style="color:green;">Manually Tweaking Buildable Object Components</mark>

Let’s quickly go through the steps to verify that the **Buildable Object** component values are set properly:

* Select your first prefab (**TopDown House 01**) in the **2D Buildable Objects** folder, then double-click it to open it in **Prefab Mode**.
* In the **Inspector**, ensure that the **Buildable Grid Object** component is attached to the root object of the prefab.
* Expand the **Debug Info** section in the **Buildable Grid Object** component. Locate the **Grid Cell Size** property. Since the grid **Cell Size** was set to **1** in our grid, enter **1** here as well.
* Click the **Calculate and Display Debug Info** button. This will enable a Gizmos debug view in the Scene view, showing how the Buildable Object is represented on the grid.

{% hint style="info" %}
If the blue gizmos aren’t visible, ensure that **"Show Gizmos"** is enabled in your Scene view.
{% endhint %}

<figure><img src="https://2651556506-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FeumhICLT4oHoEIEssOjB%2Fuploads%2FOGyHBWmW2gO271qtEVtD%2Fimage.png?alt=media&#x26;token=7deadef8-599a-4174-ac25-932bb6e40b4f" alt=""><figcaption></figcaption></figure>

Additionally, there is a property called **Scale Relative To Cell Size** in the **Buildable Grid Object** component. This property is set to **3, 3**, meaning the object will occupy **3 x 3 cells** (a total of 9 cells) on the grid when placed.

However, take a look at the **Object True Scale** property. It is set to **2.004, 2.004, 0.2**, which indicates that the actual scale of the object is very close to **2 x 2**. Despite this, it occupies **3 x 3 cells** because it is slightly larger than **2 x 2**.

You can leave it as is, but this will create unnecessary empty space around the object when placed. To fix this:

* Click the **lock button** to the right of the **Auto Calculate Relative Scale** property to unlock it.
* Manually change the **Object True Scale X** and **Y** values to **2**.
* Click the **lock button** again to lock the properties after making changes.
* Click the **Calculate and Display Debug Info** button to update the debug view.

After these adjustments, the **Scale Relative To Cell Size** property will change to **2, 2**, meaning the object will now occupy only **2 x 2 cells** on the grid.

This approach allows you to fine-tune properties to ensure the Buildable Object fits perfectly on the grid and avoids unnecessary space.

{% hint style="info" %}
The Debug Info section is only used for quickly debugging the Buildable Objects. This is not needed to for the function of the Buildable Object. So it is not required to add Grid Cell Size property or using the Calculate And Display Debug Info button.
{% endhint %}

<figure><img src="https://2651556506-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FeumhICLT4oHoEIEssOjB%2Fuploads%2FqGBb5HsMdWBTol72xjrc%2Fimage.png?alt=media&#x26;token=e4eafaea-cfe3-4a4c-a8da-38d8505a4609" alt=""><figcaption></figcaption></figure>

Now, you can **exit Prefab Mode**, which will save all the changes made to the prefab.

Similar to the **TopDown House 01** prefab, review the other two house prefabs (**TopDown House 02** and **TopDown House 03**) and manually adjust their values as needed to fit your grid.

For the **TopDown Tree 01** and **TopDown Tree 02** prefabs, no changes are required. Since they use **Buildable Free Object** components, they do not occupy any grid cells and can be freely placed on the grid. Leave these two prefabs as they are.
