Slim Image Cropper for Gravity Forms Replacement

General Discussion
#1

About two weeks ago the Slim Image Cropper for Gravity Forms plugin was discontinued by its author. This was a really useful plugin that allowed images to be optimized in the browser before being uploaded to the server. This meant faster uploads, less disk space usage, and less bandwidth needed. A win-win for everyone involved.

As this was the recommended plugin for displaying images in Gravity PDF, the software being discontinued was problematic. After reaching out to the original author of Slim to get the full story (they no longer had the time to maintain the software) we came to the conclusion that we’d have to roll up our sleeves and write a bigger, better replacement.

10-days later and a lot of caffeine Image Hopper was born:

Image Hopper isn’t an 100% drop-in-replacement for Slim at this stage (a Post Image field isn’t currently available, nor is image editing features like cropping and rotating). But it does a number of things much better than Slim, including:

  1. The ability to upload multiple images in a single Image Hopper field (Slim only allowed one image per Slim field)
  2. Deep integration with the Gravity Forms ecosystem, including support for popular add-ons like Gravity PDF, GravityView, Gravity Flow, Gravity Perks Nested Forms, and the WooCommerce Gravity Forms add-on
  3. Accessibility at its core. The uploader is fully keyboard and screenreader accessible
  4. Intuitive Settings. Slim allowed you to control every setting imaginable, without much thought to the user having to do the configuring. Image Hopper takes convention over configuration approach and uses sane defaults, only surfacing the most important settings.

If you switch from Slim to Image Hopper we polyfill your Slim fields so that:

  1. You can still view the Slim/Slim Post fields in your admin area without hindrance
  2. The Slim fields are hidden/disabled from end users filling out your form

This ensures you don’t have any data loss, or data you cannot access, when you make the switch.

This is just phase 1 of Image Hopper. An extremely advanced Image Editor feature is coming in the near future, powered by the advanced DokaJS editor.

Let me know if you’ve any questions :slightly_smiling_face:

2 Likes
#2

Congrats on launch! :100::tada:

2 Likes
#3

Thanks, Joshua! It was a whirlwind ride getting this launched in a timely manner, yet still ensuring the overall quality wasn’t effected. Really happy to have phase 1 completed :slight_smile:

2 Likes
#4

leonardo-dicaprio-clapping

2 Likes
#5

deer

#6

Awesome work @Jake_Jackson !!

2 Likes
#7

Port Macquarie

nice :slight_smile:

#8

Thank you very much, Mr. Bearded Friend! :smiley:

#9

Quick update: advanced image editing features like cropping, rotating, flipping, image filters, colour correction, markup tools, and resizing is going to land in January.

2 Likes
#10

Great job!! Sad to see Slim go, but it’s awesome this new solution will take its place.

1 Like
#11

What will the mobile experience be like? Similar to the desktop video you uploaded? Will the submit button be disabled while the images are uploading? And can the images be compressed to satisfy google page speed score for serving optimized image sizes on gravity view pages?

#12

The mobile experience is amazing! Head over to the Doka site and click the Live Demo button on your mobile to test it out for yourself.

Yes, Image Hopper functions the same as the native multi File Upload field in that regard. An alert will be shown to the end user if they try and submit before the image(s) have been uploaded. This will work the exact same with the image editor module.

We’ll have to run more tests to see if it passes Google’s Page Speed test for optimized images, but the software does allow you to automatically compress the images in the browser before upload, so will be a significant improvement over displaying non-optimized images in GravityView.

1 Like
#13

I’ve gotta buy this.

The interface is amazing.

My only concern is being able to go full width via foobox on a desktop but also be able to use a smaller size on mobile without google telling me it takes 35 seconds for the page to load because the images aren’t properly sized.

I suppose gf media library by gravity wiz could be used in conjunction with the new image uploader. Would be nice to have just one solution. That’s my only request. You’ve done a fantastic job with this one.

1 Like
#14

My first thought is getting these Image Hopper images saved in the media library and then serving the media library image in GravityView - using WP native image output (with srcset attributes) - would be the way to resolve this.

This functionality is already on our roadmap and part of out phase 3 rollout (the image editor is phase 2) :+1:

2 Likes
#15

Love it!

1 Like
#16

Phase 2 is now complete and the advanced Image Hopper editor has been finalised! Below is a screenshot from the editor interface:

Image Hoppers Editor Interface
Image Hoppers Editor Interface1200×628

The optional image editor for Image Hopper allowing cropping, resizing, annotating, colour adjustment, or photo filters all in a beautiful UX on both desktop, tablet, and mobile. Individually toggle on editing features on a per Hopper basis for even greater control.

The editor is available as part of our Ultimate + Editor license type, and you can check out a demo on ImageHopper.tech (the left one).

Next month our focus will shift to integration with the Media Library and Posts / Custom Post Types. We’ll be looking to add courses to Gravity.guide over the coming weeks and months talking about the various use cases for Image Hopper, so signup on Gravity.guide if you want to keep apprised. And finally, there’s a new comparison article on Build With Gravity about the various image uploader / cropper plugins available for Gravity Forms, and Image Hopper has been included:

We’ve only really looked at the cropping and rotating capabilites in this review, but there is much more available in this plugin. If you have extensive image editing needs for your Gravity Form, then this is the plugin for you – Built With Gravity

Any questions, please do feel free to reach out!

© 2008 - 2019. Gravity Forms is a project by Rocketgenius Inc.