white-logo

KappaX

burger-icon
search-icon

/

Multiple Artboard Layouts

With KappaX, you can create the same experience with multiple layouts. This feature is especially useful if you want to deploy the same link and serve different aspect ratios for your website or app embeds. In this article, we will show you how to create multiple Artboard layouts for your project in KappaX.

Multiple Layout4

Creating a New Layout

To create a new layout in KappaX, first, select the artboard & from the property panel click on the ‘+’ icon.  You have two options here, either you can select layout dimensions from the list provided or enter custom dimensions. After selecting your desired dimensions, give a name to the layout and hit the "Create Layout" button. The new layout will be added to your project.

Multiple Layout1

Re-Adjusting Layers Coordinates & Dimensions

 If the dimensions of the new layout are different from the parent layout, which is the ‘Default’ layout, you will need to re-adjust the layers' coordinates and dimensions accordingly. When you create a new layout, it is inherited from the parent layout. This means that any changes made to the parent layout will also get reflected in the new layout derived. To know more about inheritance, follow this link.

Multiple Layout2

Pro Tip

Re-adjusting the layer's coordinates & dimensions also leads to property-level detachment.

Manipulating Logic

KappaX makes it easy to manipulate the properties of the layers in different layouts. The logic panel is shared among all the layouts in a project, which means that you can easily change the logic based on different layouts. To do this, switch the logic panel and check  "Is layout equal to portrait" in the rule section. You can then perform certain actions based on the layout.

Multiple Layout3

Previewing the Project

After making changes to your project, it's always a good idea to preview it to see how it looks. With KappaX, you can preview your project and see how it works based on the layout. Different actions will occur based on the layout, so it's important to ensure everything is working correctly.

With the flexibility to create as many sizes as you want with the same experience but with multiple layouts, KappaX makes it easy for you to create an interactive experience for your users. So, start creating your next interactive experience today with KappaX!

On this page

Creating a New Layout

Re-Adjusting Layers Coordinates & Dimensions

Pro Tip

Manipulating Logic

Previewing the Project