Build Isometric Tiles with AI

An isometric city game

Overview

Scenario streamlines the creation of 2D isometric tilesets for games, making the process faster and more efficient than ever before. This guide will walk you through the essential steps to generate high-quality isometric tiles that are ready for import into game engines like Unity. With Scenario, you'll be able to build a vast array of stunning game worlds, seamlessly.

Three isometric buildings

Making Isometric Tiles in 4 Easy Steps:

1. Choose a pre-trained model that matches your style, or create your own custom model oriented towards isometric design.

2. Use your model to generate base tiles and refine those tiles using Scenario's built-in tools.

3. Import your refined set of tiles into Unity and configure your isometric grid.

4. We'll also explore how to create tile variants, such as construction or destruction states, to add more depth and interactivity to your game environments

Follow the detailed steps outlined below, taking "Isometric Sci-fi Buildings" as an example, and quickly create high-quality 2D isometric tilesets.


Step 1: Selecting a Custom Model

The choice of model is very important for isometric tiles, as the model's training can impact how consistently it follows a gridded base. Scenario offers different pre-trained models specifically designed for creating isometric tilemaps, which are great starting points. More models are continuously being added, so stay tuned and check for updates.

To follow along with the workflow described in this article, use the "Isometric Sci-fi Buildings" model. You can access it via this link.

Three isometric buildings tiles

Step 2: Generate Base Tiles

To generate isometric tiles that seamlessly fit your grid, consider using one of these two methods. If you choose to use your own custom model, you may need to adjust your prompts from those recommended in this workflow. Keep your prompts concise and consistent with the captions of the training dataset.

Method 1: Use Image to Image

In this workflow, we will utilize a reference image to create isometric tiles. To prepare a reference image, select a base that represents a single tile in your isometric grid. Since the Image to Image tool will follow the colors and structure details of your reference image, it is essential to provide general guidance. We have provided a link to a suitable reference image here:

Base "Image to Image" Tile Reference

You can either add a building shape for your generations to follow before uploading your image to the Reference Image, or make adjustments after uploading a basic tile.

A sketched image

Once your image is uploaded, use the Sketch Tool to add elements to the tile by sketching abstract or rough building shapes. Remember that the color of the reference image is important.

After preparing your image, write a simple prompt describing the building you want to create. An Influence value between 20-25 is a good starting point. Some prompt examples:

'a scifi fantasy alien crystal mine'

'an obsidian black structure with red lines'

You can also iterate from one reference image to a more refined one, step by step, by clicking on an image and then selecting Use as Reference, or by dragging and dropping the image directly into the reference image slot.

Experiment with both Image-to-Image and Style Reference to find the best approach for your game style and goal.

Method 2: Use ControlNet Structure

Prepare a reference image with the desired grid proportions. You can download a suitable reference image here:

Base ControlNet Structure Reference

In the image generation page, upload the base as a Reference Image and change the Mode to ControlNet Structure. Set an Influence value between 40 and 75.

The prompts can vary more than in the image to image example, because with Structure the color information from the original image will not be taken into account. Here are some examples of relevant prompts:

A futuristic cityscape etched with neon signs and holographic billboards’ or ‘a laser gun factory, white and green

Aim to find the lowest Influence value that still respects the base and does not degrade the model's style. Typically, that is somewhere around 50 Influence (depending on the model). Generate multiple tiles using the same reference tile for consistency.

Step 3: Refining your Tiles

Once you create a set of tiles, you may choose to iterate and expand on your initial designs by upscaling and enhancing them for a cleaner look, as well as removing backgrounds using Scenario's built-in tools.

Upscaling & Enhancing

Upscaling an image adds more detail and nuance to the overall creation. To Enhance, navigate to the image you would like to increase the size of and find the Enhance button. Choose the most appropriate upscaling presets (for instance, 3D Rendered + Balanced) and scale factor (2x is a good start, but you can upscale up to x8). Experiment with different settings to find the best balance between creativity and style consistency.

An upscaled image

Remove the Background

Utilize Scenario's integrated Background Removal feature to isolate the main elements of each tile. Carefully review each tile to ensure the background is completely removed and the edges are clean. You can find this feature in the same area as the Upscale tool.

With a removed background

Maintain organization by saving the final images to Collections or Tagging them for easy retrieval and tracking. As you generate these assets, establish a consistent workflow: generate tiles using the same settings, Enhance them uniformly, and then save and organize them for future use.

Step 4: Create Variants (Optional)

You can create evolutionary variant tiles, for example, depicting the construction of a building using Scenario's AI Canvas. This process allows you to generate the necessary frames within minutes.

For Construction Variants

To create construction variants, start with a base image of an empty plot or foundation. Upload the image to the Scenario AI Canvas.

Sketch the image

Sketch the parts you want to add for each construction stage, such as walls, roofs, and details.

Mask the sketched area

Mask the sketched areas and generate the image using the same prompt that was used originally to generate the base. Adjust the Reference Image Influence as needed. Influence of 25 is recommended.

Mask and go

Repeat this process for each stage, gradually building upon the previous one, until you have a complete building. This methodical approach allows you to create a series of images showcasing the various construction stages of your building.

A similar process can be applied to create "demolition" or "damaged" variants: begin with the base image of the finished building. Upload it to the Scenario Canvas, and sketch or erase the areas that require editing, such as cracks and damage. Mask these areas and use inpainting with a specific prompt to guide the output. This efficient method allows you to produce the required frames within minutes.


Importing Assets to Unity

Once you have prepared your isometric assets, the next step is to integrate them into your chosen game engine. Unity, Godot, and Unreal Engine are all excellent options. For those using Unity, follow this step-by-step tutorial to streamline your setup process.

Final Notes

In conclusion, Scenario is revolutionizing the creation of 2D isometric tile sets by providing a comprehensive set of in-platform tools. With custom-trained models, reference images, the Creative Upscaler, and the AI Canvas, developers can generate high-quality, consistent assets faster than ever before. Scenario's intuitive workflow and seamless integration with popular game engines ensure that you'll be ready to bring your visually stunning game worlds to life in no time.

Table of content

You'll also like