Developer's Guide: AI Content-Aware Image Editing API for E-commerce & ERPs

Transform visuals intelligently with our AI content-aware image editing API. Automate cropping, resizing, and more for Shopify, marketplaces, and ERPs
5m
Published on Jul 17, 2024 by
Rahul Bhargava

Introduction

The Crop.photo AI Content-Aware Image Editing API offers tools to automate image and video processing, potentially saving time and improving consistency in content creation. Here's what automated workflows can do for you without manual steps:

  • Edit multiple images or videos at once, without manual input
  • Create banners and other visual assets that match your brand guidelines
  • Check if images follow your brand rules, flagging those that don't
  • Connect directly with your current systems, like your product information systems (PIM) or content management software
  • Work with online store platforms such as Shopify, WooCommerce or Mirakl to adjust product images automatically
  • Handle visual content from start to finish without needing someone to oversee each step

This guide explains two ways to add these tools to your workflow. You might find them useful if you run an online store, create lots of marketing assets, or need to keep your brand looking the same across different channels.

The options we'll cover can help streamline how you handle visual content, especially as your needs grow. They aim to cut down on repetitive tasks and help maintain a consistent brand look in your assets.

Integration Options

🔗 Option 1: Crop.photo AI Content-Aware Image Editing  API

For developers seeking maximum control and customization:

  • RESTful API architecture
  • Direct integration into your codebase
  • Ideal for those comfortable with API implementations
  • Offers granular control over image and video processing

🔗 Option 2: Make.com Integration

For those preferring a visual, low-code/no-code approach:

  • Drag-and-drop interface for creating workflows
  • Pre-built connectors and templates
  • Suitable for developers of all skill levels
  • Rapid prototyping and deployment of integrations

Choose Option 1 if you're a seasoned developer looking for deep integration capabilities. Opt for Option 2 if you prefer a more visual, intuitive approach to building workflows or if you're working in a low-code environment

Integrating with Crop.photo API

Crop.photo offers a RESTful AI Content-Aware Image Editing API for bulk image and video editing, cropping and analysis. Here's a quick start guide:

🔑 Authentication

  • Obtain your Crop.photo API key by visiting the developer settings in the Crop.photo app.
  • Ensure you are using the correct API server endpoint
  • All the API calls must include an Authorization header with API key in the value. For example:
Generate API Key for Crop.photo

Key APIs for Content-Aware Image Editing

  • /v1/crop/auto-resize-align: Auto resize and align in Crop.photo, seamlessly resize and align your products within the frame while replacing the background with a given color or background image.
  • /v1/crop/body-aware-crop: The Body-Aware Crop feature in Crop.photo API enables precise and versatile cropping based on various body markers, catering to diverse use cases and enhancing image customization.
  • /v1/crop/unrecognizable-crop: Use when you need to crop the top portion of the face or a model's body in order to turn the model's image into an unrecognizable face.
  • /v1/crop/remove-background: Remove background from your images and generate PNG file with transparent background.
  • /v1/crop/lifestyle: Use precisely aligned the subject in focus and sized using the advanced AI algorithms.

Basic Usage Example

Here's a Python snippet to crop an image using the AI Content-Aware Image Editing API:

Python snippet for content-aware crop API

For the full Python code snippet please visit this page.
For full API documentation, please see: https://api.crop.photo

Integrating with make.com

make.com is a tool that connects different apps and services with minimal coding. Here's what it offers:

  • This integration allows you to leverage our AI Content-Aware Image Editing API through a visual interface for creating workflows by dragging and dropping elements.
  • Automation of tasks that typically require switching between multiple apps.
  • Integration with many business systems, including digital asset stores:

    • Enterprise Resource Planning (ERP) systems
    • Marketplace platforms
    • Content Management Systems (CMS)
    • Product Information Management (PIM) tools
    • Digital Asset Management (DAM) systems
    • File Transfer & Storage Solutions (DropBox, SFTP etc)

  • Accessibility for non-programmers, though some technical knowledge can be helpful.

With make.com, you could set up workflows like:

  1. Pulling product data from your digital asset store
  2. Sending associated images to Crop.photo for processing
  3. Applying brand style and sizing rules to the images
  4. Uploading processed images to your digital asset store such as a DAM or marketplace platform
  5. Updating product listings with new image links

This automation can streamline operations across your entire content and product management pipeline. It's particularly useful for businesses dealing with large volumes of visual content across multiple platforms or channels.

In the following sections, we'll show you how to create a basic integration between Crop.photo and other business systems using make.com.

Overview of Make.com Scenarios

Make.com Shopify integration with Crop.photo API scenario

Blueprints are JSON files that can be imported into Make.com as scenarios, allowing for further customization to meet specific requirements. A Make.com blueprint acts as a predefined template that outlines a series of actions, triggers, and data handling procedures, streamlining the integration process.

Crop.photo provides ready-made Make.com blueprints that utilize our Content-Aware Image Editing AI APIs. These blueprints let you set up image processing workflows quickly, with little to no coding required. You can start cropping, resizing, or applying filters to your images almost immediately after connecting the services.

Creating Crop.photo Scenario from Make.com Blueprint

  1. Download the blueprint json file from Crop.photo.
  2. Log in to your make.com account.
  3. Click on the Create new scenario button.
  4. Select More(...) button and import the previously downloaded blueprint json file.
  5. Customize modules and connections as needed.
  6. Test the scenario by clicking the Run once button.

Key Features

  • Trigger Modules: Start workflows based on events (e.g., new Shopify product added)
  • Action Modules: Perform operations in connected apps (e.g., upload edited media to a CMS)
  • Flow Control: Use routers and filters to create complex business logic
  • Data Mapping: Transform data between your business systems & Crop.photo effortlessly

Shopify 🛒 Integration Example

Example scenario: Shopify image edited automatically

Make.com is widely recognized for its no-code automation capabilities, and in this example, we’ll show you how to enhance its functionality by integrating custom code to automate image cropping and resizing for Shopify products using the crop.photo API. This process is triggered by assigning a specific tag to products, indicating which images need cropping.

Once your Make.com scenario is set up, simply tag the products with crop-photo-pending to mark them for processing. You can run the scenario manually or schedule it to run at fixed intervals, ensuring your Shopify store stays up-to-date with optimized images.

Steps:

  1. Download the Shopify blueprint JSON file from crop.photo.
  2. Log in to Make.com and create a new scenario.
  3. Import the downloaded blueprint JSON file into the scenario.
  4. Configure the Shopify connection for each Shopify module in the scenario.
  5. Set up the crop.photo API credentials in the HTTP module.
  6. Run and test the scenario on a few products.

For full documentation of this integration, checkout this help guide.

Conclusion

Both Crop.photo AI-powered Content-Aware Image Editing APIs and make.com blueprints offer powerful integration capabilities for different use cases.  Crop.photo API is ideal for direct, programmatic image processing for seasoned developers, while make.com excels in creating complex, multi-step automations across various platforms with low or no code.

Project requirements, available development resources, and scalability needs are key factors in choosing an integration method. Using both API and Make.com integrations together can create comprehensive solutions for complex workflows.

Next steps:

  1. Assess integration requirements based on business needs
  2. Review documentation for the chosen integration method
  3. Implement a small-scale proof-of-concept
  4. Expand and refine the integration based on results and feedback

For enterprise plan subscribers, dedicated developer support is available to assist with API setup and implementation. This service ensures a smooth and efficient integration process. Note that this level of support is not included with SMB (Small and Medium Business) accounts.

The integration process can be tailored to match specific business needs and technical capabilities, whether using the API directly or leveraging Make.com's no-code platform.

🚀 Happy integrating!