Layout Builder Overview

Updated Today · 9 min readIntermediate

The Layout Builder is the visual editor in Foto Master Cloud where you design the final photo output your guests receive.

Layouts control how the final image looks after the session is completed. This includes the placement of captured photos, overlays, logos, text, QR codes, signatures, and other design elements.

Once saved, layouts sync to your booth through the event sync process and are rendered by FMX for iPad or FMX for Windows during the session.

What Is a Layout?

A layout is a design template for the final photo.

It defines:

  • Where the captured photo appears
  • How large the photo is
  • Whether the photo is cropped, fitted, mirrored, filtered, or rotated
  • Where logos, overlays, and frames appear
  • Where text appears
  • Where QR codes appear
  • Where signatures or drawings are placed
  • The final output size and orientation

Layouts are used when the workflow reaches a step such as Save Final Photo, Print Copies or the end of a workflow without Save Final Photo.

Where to Find the Layout Builder

There are two ways to open the Layout Builder, depending on whether you are managing layouts as reusable templates or configuring one for a specific event. Both options open the same Layout Builder.

From the Templates Library

Use this option when you want to create or edit reusable layouts that can be used across multiple events.

  1. In the Cloud dashboard, go to Templates.
  2. Open Layouts.
  3. Click New Layout to start from scratch, or click Edit on an existing layout.
  4. The Layout Builder opens in the dashboard.

Layouts saved here are stored in your Templates library and can be reused across any event.

From an Event’s Software Configuration

Use this option when the layout is tied to a specific event and you want it linked directly to that event’s booth configuration.

  1. Open your event.
  2. Go to the General tab.
  3. Scroll to the Software section.
  4. Find the booth product running this event, such as FMX for iPad.
  5. Click Create New Layout, or click Edit next to an existing layout.
  6. The Layout Builder opens with the event context already attached.

Saving in either flow adds the layout to your Templates library.

When a layout is opened from an event, it is also attached to that event’s Software configuration. The booth picks it up on its next event sync.

Main Layout Elements

The Layout Builder includes several types of elements that can be added to the canvas.

Camera Element

The Camera element is a photo placeholder. It defines where the guest’s captured photo will appear inside the final layout. You can add one Camera element for a single-photo layout, or multiple Camera elements for strips, collages, and multi-photo designs. Common Camera options include:

  • Camera Type: Auto or AI
  • Aspect Ratio: 2:3, 3:2, 16:9, or Custom
  • Fit Mode: Fit or Fill
  • Filter
  • Hair Filter, available on iPad
  • Flip X / Flip Y
  • Opacity
  • Position, size, and rotation

Fit vs. Fill

Fit shows the full captured photo inside the camera box. This may leave empty space if the photo ratio does not match the placeholder. Fill fills the entire camera box. This may crop part of the photo, but it creates a cleaner full-frame look. For best results, match the Camera element’s aspect ratio to the capture ratio used by your booth.

Image Element

The Image element is used for static graphics. Common uses include:

  • Backgrounds
  • Frames
  • Borders
  • Logos
  • Sponsor graphics
  • Decorative overlays
  • Branding elements

Supported formats include PNG and JPG. Transparent PNG files are recommended for frames and overlays because they allow the photo to show through the transparent areas. Image elements can be moved, resized, rotated, layered, and adjusted for opacity.

Text Element

The Text element allows you to add written content to the layout. Text can be used for:

  • Event names
  • Dates
  • Guest names
  • Branding
  • Labels
  • Instructions
  • Survey answers
  • AI-generated content, where supported

There are two main text modes:

Static Text

Static text is fixed text that appears the same on every final photo. Examples:

  • “Congratulations!”
  • “Emma’s Bat Mitzvah”
  • “Foto Master Experience”
  • “New York, 2026”

Dynamic Text

Dynamic text is filled automatically during the session based on guest input or workflow data. Dynamic text can pull from sources such as:

  • Survey responses
  • Prompt Selection Screen choices
  • AI Palm Reading result, where supported

Dynamic text is useful when you want each guest’s output to include personalized information.

Text settings may include:

  • Font family
  • Font size
  • Bold
  • Italic
  • Underline
  • Text alignment
  • Text color
  • Position
  • Size
  • Rotation

QR Code Element

The QR Code element adds a scannable QR code to the final layout. This can be used to send guests to their photo, video, GIF, or gallery. QR code modes may include:

Cloud QR Code

Creates a QR code connected to Foto Master Cloud. The QR can link to: 

  • A specific media file
  • The full event gallery

Media options may include:

  • Final Photo
  • Video
  • GIF

Custom QR Code

Creates a QR code based on a custom URL structure. This is useful when connecting the booth output to an external system, custom landing page, or special sharing flow. QR codes stay square when resized.

Signature Element

The Signature element is a placeholder for guest signatures or drawings captured during the workflow. It is commonly used with the Sign & Draw step. The Signature element controls where the guest’s drawing or signature will appear on the final photo.

The Carousel element can cycle through multiple images during the session.

It is useful for:

  • Animated backgrounds
  • Rotating themes
  • Scene variations
  • Multiple branded backgrounds

Carousel images can usually be configured with scaling options such as Fit, Fill, or Crop.

Canvas Controls

The Layout Builder canvas allows you to visually design your final output.

Common controls include:

  • Drag and drop elements
  • Resize elements using handles
  • Rotate elements
  • Move elements forward or backward in layers
  • Duplicate elements
  • Hide elements
  • Lock elements
  • Delete elements
  • Undo and redo changes
  • Zoom in and out
  • Use keyboard arrows to nudge elements into position
  • Use snap-to-grid for better alignment

Layers

Layouts are built in layers. The order of the layers matters.

For example:

  • Background image should be behind everything
  • Camera/photo placeholder should be above the background
  • Frame overlay should usually be above the photo
  • Logo and text should usually be above the frame
  • QR code should remain visible and unobstructed

Use the Layers panel to arrange elements from back to front.

Camera Filters

Camera filters can be applied to Camera elements. The available filters depend on the platform you are designing for.

For FMX for iPad, available filters may include:

  • None
  • Black and White
  • Sepia
  • Double Exposure
  • Hue Adjust
  • False Color
  • Noir
  • Thermal
  • Saturated
  • Comics
  • Color Invert
  • Inked
  • Line
  • Spot Color
  • Crystallize
  • Pixellate
  • Cross Polynomial
  • Vintage
  • Tintype

Windows and other platforms may support a different filter list. The Layout Builder will show the filters available for the selected booth platform.

Working with Layouts

Creating a New Layout

To create a new layout:

  1. Open your event in Foto Master Cloud.
  2. Go to the Layouts section.
  3. Click to create a new layout.
  4. Set the canvas size and orientation.
  5. Add a Camera element.
  6. Add background, frame, logo, text, QR code, or signature elements as needed.
  7. Arrange the layers.
  8. Save the layout.
  9. Sync the event on your booth.
  10. Test the layout with real captures before the event.

Editing an Existing Layout

To edit an existing layout:

  1. Open the layout in the Layout Builder.
  2. Select the element you want to change.
  3. Adjust its position, size, rotation, or settings.
  4. Save the layout.
  5. Sync the booth again so the updated version is available.

Importing and Exporting Layouts

Layouts can be imported and exported as JSON files.

This is useful when you want to:

Back up a layout
Move a layout between events
Share a layout with another account
Send a layout to support for troubleshooting
Reuse a layout as a starting point for another event

Exporting a Layout

Use Export JSON to download the layout file.

Importing a Layout

Use Import JSON to load a previously exported layout into the current event.

After importing, review the layout carefully, confirm that all assets load correctly, and save it.

Using Layouts in a Workflow

Layouts are usually applied during the workflow when the guest reaches a step that saves or outputs the final image.

The most important step is Save Final Photo.

This step composites the captured photo together with the active layout and creates the final image.

If your workflow includes printing, email, SMS, QR code, gallery sharing, or AI result sharing, make sure the workflow includes Save Final Photo before those output steps.

Layout Selection During the Workflow

You can also let guests choose a layout during the session. This is usually done with a Selection Screen in the Workflow Builder. For example, a guest can choose between:

  • Different photo frames
  • Different event themes
  • Different print designs
  • Different branded layouts
  • Different AI styles or templates

When the guest selects a layout, that layout becomes active for the session and is used when the final photo is saved.

Best Practices for Layout Design

Match the Output Size

Start by choosing the correct canvas size for your final output.

Common examples:

  • 4x6 print
  • 2x6 photo strip
  • 6x8 print
  • Square social media image
  • Vertical digital sharing layout
  • Horizontal digital sharing layout

Using the correct size from the beginning helps avoid stretching, cropping, or print alignment issues.

Match the Camera Ratio

Make sure the Camera element matches the capture ratio used by the booth. If the ratio does not match, the photo may be cropped or leave empty areas, depending on whether you use Fit or Fill.

Use Transparent PNGs for Frames

For frames and overlays, use transparent PNG files. This allows the captured photo to appear behind the frame cleanly.

Keep Text Readable

Avoid placing text over busy areas of the photo. Use strong contrast, proper font size, and clear positioning.

Keep QR Codes Clear

Do not place graphics, text, or photos on top of a QR code.

Make sure the QR code is large enough to scan easily.

Use Layers Correctly

A common layer order is:

  • Background
  • Camera photo
  • Frame overlay
  • Logo
  • Text
  • QR code

Test with Real Photos

Always test your layout with actual captures from the booth. A layout may look good in the editor but appear different with real lighting, real guests, camera framing, or print output.

Sync Before the Event

After saving or editing a layout, sync the event on the booth. Do this before the event starts so the booth has the latest layout files and assets.

Common Mistakes to Avoid

  • Not adding a Camera element
  • Placing the Camera element behind a solid image
  • Forgetting to save the layout
  • Forgetting to sync the event on the booth
  • Using the wrong canvas size
  • Using a Camera ratio that does not match the capture ratio
  • Covering the QR code with another element
  • Placing text over a busy photo area
  • Forgetting to include Save Final Photo in the workflow
  • Testing only in the Cloud editor and not on the actual booth

Summary

The Layout Builder controls the final visual output of your FMX photo booth experience.

It allows you to design branded, printable, and shareable photo templates using camera placeholders, images, text, QR codes, signatures, and other elements.

For best results, choose the correct canvas size, match the camera ratio, use clean transparent PNG overlays, organize your layers properly, and always test the layout on the actual booth before going live.


Was this helpful?

Related articles