Design basics

There are two main views inside the project editor. You can toggle between the Design view and the Input fields view with the toggle in the toolbar.

The Design view is where you can create, manage and customize the objects of your template-design.


Layers panel

All objects you create will have a corresponding layer in the layers panel.

You can change the order of your layers via drag and drop. The bounding box of the object corresponding to the currently selected layer will be highlighted in the Canvas.


Properties panel

The properties panel on the left always shows the properties of the currently selected object.

The properties are grouped into five tabs (default, transforms, colors, filters, visibility). You can switch between tabs by clicking the icons.

Property status

Properties have a status that is indicated by the drop-down menu next to the value. The status of a property can be one of three: Prop, Field or Var. See explanations below:

  • “Prop.” stands for “Property” and is the default status. The value of a property with this status can be either static or a dynamic expression (using other sub-properties and variables as arguments).
  • "Field" stands for "Connected to an input field". The value of a property with this status is given by the input field it's connected to.

You can create and connect a new input field by switching the status of a property to "Field".

  • "Var." stands for "Variable" and is only available while Easy-Mode is deactivated. Similar to the “Prop.” status, the value of a property with “Var.” status can be static or a dynamic expression, with the only difference being that the (calculated) value of the property can be globally referenced in other expressions.

Canvas

The canvas is the frame in which you place the objects of your design. Everything outside the canvas is cut off when the template is displayed in Bluepic SOCIAL or Bluepic EMBED.


Tools

You can create new objects with the object tools in the toolbar.

You can create image, shape, text and path objects. Once you have selected the tool, click and drag the new object onto the canvas.


Mask

To create a mask, you must select at least two layers. You can select multiple layers by holding down the Shift key or the CTRL key (Command key on Mac) and clicking on the layers. The first layer you select is the masking layer and all other selected layers are the masked layers.

The mask is displayed as an additional layer in which the selected objects are nested. The mask layer has two slots (masked layers and masking layers), each of which can contain multiple objects. You can drag and drop layers in and out of the slots.

How masks work:The objects in the “Masked layers” slot are only visible in the (combined) area covered by the objects in the “Masking layers” slot. In the example above, the part of the white rectangle that lies outside the black circle is cut off.


Edit mode

You can toggle the edit mode either by clicking the button in the toolbar or by pressing the Enter key.

The edit mode allows you to edit the position and size of the selected object via drag and drop in the canvas.

Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.

Still need help? Contact Us Contact Us