Marketplace products sample project

Marketplace platforms enable businesses to create profiles and upload product images and descriptions to sell their offerings. For example, in a restaurant marketplace, each restaurant manages its own section, uploading images of its dishes. To maintain image quality, consistency, and compliance, marketplaces often enforce guidelines on file formats, size limits, content restrictions, and overall presentation.

This guide explores how you can use MediaFlows to automate image moderation, ensuring that vendor-uploaded images meet marketplace standards before going live.

MediaFlows provides easy-to-use building blocks to implement your media workflow. There's so much flexibility that you can make your flow as simple or as complex as you like.

The following sections provide a breakdown of a sample PowerFlow workflow from which you can take inspiration when designing your own flow.

Image upload

There are many different ways in which a marketplace platform can accept image uploads. Regardless of how the images are uploaded, the act of uploading an image to Cloudinary can trigger the flow.

Upload preset

Some of the blocks in the flow rely on specific analysis taking place on upload. Use an upload preset to specify the analysis that you want to trigger.

To configure the upload preset:

1. Log into your Cloudinary Console.
2. Navigate to Settings > Upload > Upload Presets.
3. Click Add Upload Preset.
4. For color analysis, click the Manage and Analyze tab and enable Retrieve predominant colors and histogram.
   
   
   
5. For watermark detection, click Addons, scroll to Cloudinary AI Content Analysis and enable Detect watermark on your image. You also need to subscribe to the Cloudinary AI Content Analysis add-on.
   
   
   
6. Configure any other settings relevant to your workflow and click Save.

Make sure you reference your upload preset in the upload mechanism that you choose, for example in the Upload widget configuration, or API call. See Upload presets for further information.

Upload trigger

When someone uploads an image, Cloudinary sends a webhook notification to the Cloudinary Upload block, which activates the flow.

Steps:

1. Add the Cloudinary Upload block to your canvas.
2. Click the block and set the webook.

Amazon Rekognition AI moderation

Amazon Rekognition automatically detects categories of unsafe content in images. The Amazon Image Moderation block invokes the Amazon Rekognition AI Moderation add-on. Using a Condition block, you can check if the add-on approved the image and optionally add the outcome to the logs. If approved, you can move on to the next part of the flow. If rejected, you can add the image to an email report and end the flow there. You can see rejected images in the Moderation tab of your Media Library (see Moderate assets for more information).

Moderate the image

To use the Amazon Image Moderation block you first need to subscribe to the Amazon Rekognition AI Moderation add-on. You can try it out for free. Then follow these instructions:

1. Add the Amazon Image Moderation block to your canvas and connect the output of the Cloudinary Upload block to its input.
2. Click the block and select the Cloudinary Upload asset.
3. Set the moderation confidence level between 0.0 and 1.0. The lower the confidence level, the more images will be blocked.
4. Select the moderation categories to block.

The moderation response includes an "approved" or "rejected" status:

Test the status

Connect a Condition block to check the status of the moderation.

Steps:

1. Add the Condition block to your canvas and connect the output of the Amazon Image Moderation block to its input.
2. Click the block and set the name to something meaningful like Check approved.
3. Set the first variable to {{$.Amazon_Image_Moderation.result.status.status}}.
4. Set the operator to equal_to.
5. Set the second variable to approved.
6. Set the variable type to String.

The top output connector is the path taken if the condition is true (in this case if the status is "approved"), otherwise the flow continues through the bottom output connector.

Add to logs

You can optionally add the moderation status to the logs so that you can easily identify what happened during a flow execution.

Steps:

1. Add an Add To Logs block to your canvas and connect the top output of the Condition block to its input.
2. Click the block and set the name to something meaningful like Approved image.
3. Set the message to something meaningful like Approved by Amazon Image Moderation.
4. Repeat the steps for the bottom output of the Condition block to show that the moderation rejected the image.

Add rejected images to scheduled email

To stay informed about rejected images, you can use the Scheduled Email Report block. The system sends the email at the configured time and includes details of all the assets that reach that part of the flow in a 24-hour period. If all images pass the moderation, the execution never reaches that block and the email is never scheduled.

Steps:

1. Add a Scheduled Email Report block to you canvas and connect the output of the Add To Logs block for the rejected image to its input.
2. Click the block and select the Cloudinary Upload asset.
3. Add a comma-separated list of email addresses that you want to receive the email.
4. Specify the time to send the email, for example 10:00.
5. Give the report a name - this is the subject of the email.
6. Add a description to appear in the body of the email.

AI Vision moderation

One of the most all encompassing types of moderation is Cloudinary's AI Vision moderation. Effectively, you could use this instead of all the other types of moderation described in this guide, though each of the others also have their benefits.

The AI Vision Moderate by Prompts block invokes the Cloudinary AI Vision add-on. By asking questions you can determine if the image is suitable for your use. The Complex Condition block uses JsonLogic to determine if any of the answers mean the image isn't suitable for use. If approved, you can move on to the next part of the flow. If rejected, you can add the image to an email report and also add tags to the image so that you can find it and handle it later.

Ask questions about the image

To use the AI Vision Moderate by Prompts block you first need to subscribe to the Cloudinary AI Vision add-on. You can try it out for free. Then follow these instructions:

1. Add the AI Vision Moderate by Prompts block to your canvas and connect the output of the Add To Logs (approved image) block to its input (or, if you don't want to use Amazon Image Moderation, connect the Cloudinary Upload block).
2. Set the source type to uri.
3. For the image source, type {{$.Cloudinary_Upload.result.secuire_url}}.
4. Add up to ten rejection questions. These are questions that should have a yes/no answer, where "yes" answers indicate the image isn't suitable. For example, you don't want to show any hands or people in your restaurant dishes, so the question may be "Does the image include hands or people?". If the answer is "yes", you won't display this on your site.

The AI Vision response includes the questions and answers:

Evaluate the responses

Use a Complex Condition block to return true if any of the answers to the AI Vision questions are "yes".

Steps:

1. Add the Complex Condition block to your canvas and connect the output of the AI Vision Moderate by Prompts block to its input.
2. Click the block and set the name to something meaningful like Any Yes (because it checks if any of the responses are "Yes").
3. Set the JSON data to {{$.AI_Vision_Moderate_by_Prompts.result.responses}}.

4. Enter the following JsonLogic conditional expression:

   The "some" operator loops through all responses. If at least one response has "value": "yes", the condition returns true. If none of the responses have "yes", it returns false.

You can optionally connect Add to logs blocks to each of the outputs, and another Scheduled Email Report block to the rejection flow, with a message specific to the AI Vision moderation. Note that the top output of the Complex Condition block indicates the true condition; in this case, that the image isn't suitable.

Tag rejected images

When an image is rejected during the flow, it's useful to tag it so that you can handle it later.

Steps:

1. Add the Update Tags block to your canvas and connect the output of the Scheduled Email Report block to its input.
2. Click the block and set the name to something meaningful like Update Tags Rejected Contents.
3. Select the Cloudinary Upload asset.
4. Select the Add action.
5. Enter the names of the tags you want to use in the Tag field, for example: rejected,ai_vision.

You can search for images with tags "rejected" and "ai_vision" to check that the moderation correctly identified these images as being unsuitable. If you find that the AI analysis isn't perfect, you can manually remove the tags and use the images.

Color analysis

If one of your requirements is to check that uploaded images aren't black and white, you can do this without using an add-on by asking for the upload response to return information about the colors in the image. You can use an upload preset to do this, or if you're not using an upload preset, set the colors parameter of the upload request to true.

Check image colors

The upload response includes the predominant colors in the image:

Use a Complex Condition block to check if the image is grayscale.

Steps:

1. Add the Complex Condition block to your canvas and connect the output of the Add To Logs block for the approved contents to its input (or, if you don't want to use the previous moderations, connect the Cloudinary Upload block).
2. Click the block and set the name to something meaningful like Is Grayscale.
3. Set the JSON data to {{$.Cloudinary_Upload.result.predominant.cloudinary}}.

4. Enter the following JsonLogic conditional expression:

   The "all" operator checks whether every item in a list matches a given condition. In this case, the list contains the predominant colors in the image. If each color in the list is "white", "black" or "gray" then the condition returns true. If any of the predominant colors isn't "white", "black" or "gray", it returns false.

You can optionally connect Add to logs blocks to each of the outputs, and another Scheduled Email Report block to the rejection flow, with a message specific to the grayscale check. Note that the top output of the Complex Condition block indicates the true condition; in this case, that the image is grayscale.

Additionally, you can tag rejected images using appropriate tags such as "rejected" and "grayscale".

Watermark detection

If one of your requirements is to check that images don't have watermarks, you can use the watermark detection functionality of the Cloudinary AI Content Analysis add-on. You can use an upload preset to do this, or if you're not using an upload preset, set the detection parameter of the upload request to watermark-detection. Remember to subscribe to the Cloudinary AI Content Analysis add-on.

Check for watermarks

The upload response includes the results from the watermark detection. If there are no watermarks detected, the response contains a "clean" tag:

Use a JQ Processor block to determine if the tags contain a "clean" key.

Steps:

1. Add the JQ Processor block to your canvas and connect the output of the Add To Logs block for the approved color check to its input (or, if you don't want to use the previous moderations, connect the Cloudinary Upload block).
2. Click the block and set the JSON data to {{$.Cloudinary_Upload.result.info.detection.object_detection.data.watermark-detection.tags}}.

3. Enter the following JQ expression:

   This checks if the "clean" key exists at the top level of the JSON object. The result is true if the "clean" key exists, otherwise it's false.

Use a Condition block to check the result of the JQ expression.

Steps:

1. Add the Condition block to your canvas and connect the output of the JQ Processor block to its input.
2. Click the block and set the name to something meaningful like Check watermark.
3. Set the first variable to {{$.JQ_Processor.result}}.
4. Set the operator to equal_to.
5. Set the second variable to true.
6. Set the variable type to Boolean.

The top output connector is the path taken if the condition is true (in this case there is no watermark detected), otherwise the flow continues through the bottom output connector.

You can optionally connect Add to logs blocks to each of the outputs, and another Scheduled Email Report block to the rejection flow, with a message specific to the watermark detection check.

Additionally, you can tag rejected images using appropriate tags such as "rejected" and "watermark".

If this is the final check in the flow, you can add an "approved" tag to the image using the Update Tags Block. You may also want to schedule another email at this point in the flow so that you're notified that someone has uploaded some new approved assets to your product environment.