# Marketplace Listing Image Workflow from Figma

> Prepare marketplace listing images in Figma that meet channel limits, preserve product detail, and stay manageable across catalog updates.

- Canonical page: https://www.hypermatic.com/articles/tinyimage-marketplace-listing-image-workflow-from-figma/
- Published: 2026-08-28T00:00:00.000Z
- Updated: 2026-08-28T00:00:00.000Z

A marketplace image has two jobs that often conflict: show enough detail to earn a click, and fit a channel's exact dimensions, file types, background rules, and file-size limits. Reusing the same large PNG everywhere usually produces slow uploads, unexpected crops, or compression that makes packaging and small labels look worse.

The reliable approach is to keep one approved product composition in Figma, then export controlled derivatives for each marketplace. [TinyImage](/tinyimage/) can batch-compress and convert those derivatives inside Figma. It cannot decide whether a marketplace permits promotional text or whether the photographed product accurately represents what the customer receives, so policy and merchandising review remain separate gates.

## Make a channel specification sheet first

Before resizing frames, record the current requirements for every destination:

| Field | What to capture |
| --- | --- |
| Canvas | Required aspect ratio and minimum or maximum dimensions |
| File | Accepted formats, color mode, transparency, and maximum size |
| Composition | Background, margins, crop, product coverage, and text rules |
| Sequence | Main image, alternate angles, scale, detail, and lifestyle slots |
| Content | Prohibited badges, claims, props, watermarks, or competitor references |

Check the marketplace's current documentation rather than copying numbers from an old Figma page. Rules change, and requirements can differ by category or placement.

## Separate truth from presentation

Create a product evidence set before building polished listing frames. It should include the approved product photography, exact color or finish, packaging, included accessories, scale reference, and any legally reviewed claims.

Then label each frame by its communication job: primary pack shot, alternate view, feature detail, dimensions, what's included, or contextual use. This prevents a common failure where six attractive images repeat the same angle while leaving practical buyer questions unanswered.

Keep promotional layers separate from the photography. If one marketplace rejects overlaid text, you can disable the message without reconstructing the product image. Keep shadows and backgrounds adjustable too; a white-background main image and a branded secondary image may start with the same product cutout but have different acceptance rules.

## Build derivatives without creating seven masters

Use one canonical composition and create channel frames around it. Components or shared assets can keep the product, badge, and caption consistent, while each frame controls its own safe area and crop.

Use names that survive handoff, such as:

`sku-channel-slot-dimensions-revision`

For example, `lamp-104-market-a-main-2000x2000-r3.jpg` is more useful than `final-square-2.jpg`. The SKU connects the export to catalog data; channel and slot explain its use; dimensions prevent a thumbnail being mistaken for a master.

If a catalog has many products, define a repeatable slot list rather than improvising per SKU. Exceptions are fine, but document them. The goal is consistent coverage, not forcing every product into an identical story.

## Export for the content, not habit

JPEG is usually efficient for photography without transparency. PNG can suit flat graphics, fine interface captures, or transparency, but photographic PNGs may become unnecessarily heavy. WebP or AVIF can be excellent for owned web stores when the stack supports them; do not assume a third-party marketplace accepts them.

With TinyImage, select the approved frames, choose the destination format, and use a target file size where the marketplace has a hard ceiling. Export from the Figma source each time instead of recompressing an older JPEG. Repeated lossy compression can soften labels and create halos around the product edge.

For a deeper format comparison, see the [SVG, PNG, and WebP guide](/articles/tinyimage-svg-vs-png-vs-webp-for-figma-exports/). If the same assets also feed your own product pages, use a separate [ecommerce product image workflow](/articles/tinyimage-ecommerce-product-image-export-workflow-from-figma/) because an owned storefront has different responsive-image and performance needs.

## Review the actual listing sequence

Do not approve files only at 100% zoom. Inspect them at search-result thumbnail size, on the product page, and in any mobile crop used by the marketplace. Confirm:

- the primary image identifies the correct variant immediately;
- product edges remain clean after compression;
- small labels are either readable or intentionally omitted;
- white products do not disappear into white backgrounds;
- alternate images answer distinct buyer questions;
- dimensions and quantities match the catalog record;
- no crop implies accessories are included when they are not;
- file dimensions, type, and size match the specification sheet.

Upload a small pilot set before processing the full catalog. Some platforms add their own crop, background treatment, or recompression. A ten-SKU pilot reveals those transformations more cheaply than replacing hundreds of approved exports.

## Package a verifiable handoff

Deliver the files with a manifest containing SKU, variant, marketplace, image slot, filename, dimensions, format, revision, and approval status. Ask the catalog owner to record upload failures and platform-generated warnings against that manifest.

TinyImage removes repetitive conversion and compression from the workflow. The team still owns product accuracy, marketplace policy, sequencing, and the final rendered listing. Keeping those responsibilities explicit turns marketplace imagery from a folder of ambiguous squares into a catalog system that can be updated safely.