Forum Academy Marketplace Showcase Pricing Features

ImagePro Image Tools - New Plugin from Gimazu

I’m happy to present my first plugin, a powerful image manipulation and utilities elements suite for Bubble!

ImagePro

ImagePro Image Tools Suite includes:

  • Loader - Allows the user to select local images and makes them available to other elements
  • Cropper - Crops images through a visual interface
  • Reducer - Resizes images with a highly efficient algorithm
  • Filters & Effects - Manipulates an image by applying filters and effects
  • Watermarker - Applies a watermark (text or image)
  • Palette - Grabs the image color palette and dominant color
  • Color Inverter - Generates inverted (opposite) version of the given color
  • Uploader - Uploads result image to Bubble or custom remote server
  • Downloader - Downloads result image

Bonus pack element (in Input Forms section)

  • Slider - A customizable input slider with more appropriate event management for image manipulation than Bubble’s Input Slider

All manipulations (and custom remote server uploads) are client-side (they use user browser) to avoid overloading the Bubble server app with unnecessary tasks.

The elements have also been designed to be used in cascade with each other: for example you can use the Loader output as the Reducer input (using the Reducer before each subsequent manipulation is always a good rule), and the Reducer output as Cropper’s input.

For live demo and details please visit the plugin page here:
Plugin page
Demo page

This page uses only Bubble standard elements and ImagePro Image Tools elements.

Feedback is welcome!

Gian Mauro aka Gimazu

Updates:
1.3.0

5 Likes

@gm.zumbo esome looking plugin.

Is there portrate mode available for cropping too?

Also, having a min px for the cropping would be useful too.

@MarkusBoostedApp
The aspect ratio of the crop box can be fixed (numeric value freely settable) or free.
The demo shows only few ratio values for simplicity. I have updated the app with more options.
I could easily implement min crop width / height with the next version. In any case, the current version returns the width & height of the cropped image to allow you to control and consequently decide which actions to take.

Thanks for your feedback

Awesome. I will keep on testing and I think min cropping width/height would give a lot of value.

@MarkusBoostedApp
I added minimum CropBox width & height as you requested.
You can check this feature in the demo app.
Regards!!

1 Like

@gm.zumbo How does this work? I don’t see any documentation. A link to the editor would be helpful. Thank you.

Hi @abdul!
The suite includes 10 elements each of which with many possible settings. As per your request I created a new demo so that you can see the editor as well clicking on the “view editor” link. Since the demo was created as a real app (to allow users to enjoy many features) the elements of the plugin are in hidden groups and popups by default. I therefore recommend that you make these elements visible through the editor’s elements tree.

Let me know if you need any more information!

Excellent! Thank you very much!

Subscribed to the plugin. Is it possible to drag and drop image on loader?

Hey @gm.zumbo ,

I’ve subscribed to your plugin.

I have one thing to say about it : AWESOME !

Definitively the best image reducer & cropper, including a powerful suite of tools.

CONGRATS !

@boston85719 : if I’m correct you were looking for a efficient image cropping tool. Give a try to this one, for me it’s the best one. A paid plugin but not so expensive considering the powerful suite of tools.

:clap: :+1: :ok_hand:

3 Likes

Hi @myflappd,
I am working on your request, if the test gives a positive result I will release an update with this new feature in a few hours!
Thank you

1 Like

@gm.zumbo Thank you. I am trying to use this upload image, crop it, upload to a wasabi using wasbi plugin.

@Christophe_HK ,
thank you very much for your compliments.
I try to create plugins that meet my needs when building an app for myself or my clients.
So I built the suite with all those elements that, in my opinion, can solve most of the client-side image manipulation problems.
What you wrote repays me for the great effort I spent :sweat_smile:
Best regards

1 Like

Update 1.3.0

Loader element new features:

  • You can set the element to allow Drag and Drop of images in element area
  • You can set the element to allow Browse on click on element area (there remains the possibility to launch a “browse” action in workflow)
  • new “placeholder” setting
  • new “dragover” state (yes/no) is exposed to use it in conditional statements (useful to customize interface)
  • you can now set borders, background, font to customize drag/click area element

@myflappd this is the response to your request!

You can view new features on demo app
This is an experimental feature. Test it!
Don’t forget to refresh your editor after upgrading.

1 Like

How can I save filter&effects’s output image to Bubble image thing?

Hi @SumitC , you can use Uploader element that expose “Upload to Bubble” action.
let me know if you need further clarification

What’s absolutely fabulous with this plugin is that all elements can work together, amazing and really powerful. This plugin saves a lot of time!
Moreover, the size reduction algorithm is very efficient. Great job!

1 Like

I can upload the file just can’t attach it to a data type’s thing. What type of field is it supposed to be -an image, file or something else?

Also, every file is named upload.png. Is there a way to assign a name to it

Hi @SumitC,

I don’t understand your request
Are you referring to how to save the image bubble uploaded url in a custom data type?
In this case you have an event and an element status available. Upon occurrence of element → “bubble upload is complete” you can build a workflow in which create or update thing using element → “Uploaded image” status. And you can use an image type field in your custom data type.

If instead you refer to the “Make this file private” and “Attach this file to” section of the “Upload to Bubble” action

the element should behaves in this case in the same way as a Bubble Picture Uploader with the same settings → go to help reference

Yes I can add this new feature if you need it. I didn’t think it useful because every file on Bubble has a unique url despite having the same name.

let me know if you need anything else

1 Like