13

Generating images

Last Update há 2 anos

Brief about generating images in Inbranded. Understanding Inbranded design builder - Components and Layers. How do I change the name, size, and background of my design? Adding and customizing texts in the design builder Adding and customizing QR Codes in the design builder

Understanding Inbranded design builder - Components and Layers.

Tomiwa Babatunde Jerimiah

Last Update há 2 anos

The Inbranded design-builder is where designs are prepped to be used either in a campaign, batch job or workflow.

The layout of the design-builder is divided into 5 areas:
  1. The topbar
  2. The components and layers panel
  3. The component preference panel
  4. The design area
  5. Floating controls
The topbar
The top bar is located at the top of the design-builder, it contains the following
  1. The back button: For returning you to the previous page
  2. The design title: For displaying and editing the design title
  3. The save status indicator: For displaying the saved status of the design ie is the design saved, currently being saved or unsaved?
  4. The undo and redo button: For undoing and redoing changes in the design.
  5. The publish button: For publishing the design in a campaign/batch job/workflow.
The components and layers panel
The components and layers panel is a tabbed panel located at the left side of the design builder interface, it contains the list of available components and layers in the design.

Components form the building blocks of a design. In Inbranded, a design is generated by layering multiple components in a design and flattening them into the final design. There are two types of components: 

  1. Regular components: These are components that are rendered in the design-builder as they would in the final design. These are text, image, rectangle and QR Code.
  2. Input components: These are components that represent placeholders in the design phase and would be replaced/updated when the final design is created. These are text input, image input, avatar and QR input. The final data(text, image, QR code data) is made available through the campaign input, batch job data or workflow data.
Layers are the components that have been added to the design. The list of components are displayed in the layers tab. Components can be moved forward/backward in Z-order to customize how elements overlap each other.

The components preference panel

The components preference panel is located at the right side of the design builder interface, it contains options for customizing the look and feel of components in the design. The content of the components preference panel changes depending on the component in focus, and displays the background preferences when no component is in focus.

The design area

The design area is located right at the center of the design builder interface, it renders a preview of the design and contains controls for resizing and repositioning the components in the design.

Floating controls

These are controls that float in the design builder interface. There are two floating controls:

  1. Zoom control: For zooming in and out of the design
  2. Chat control: For starting a chat session with a member of the Inbranded team when support is needed.

Was this article helpful?

0 out of 0 liked this article

Still need help? Message Us