Answered

Resize multiple images to be the same size?


Userlevel 2

Our company use Miro for Fashion Design and create a lot of boards that use JPG or PNG for visuals rather than Miros shapes/stickies.

Once we drag and drop into Miro images are all different sizes, which have to be manually resized. 

We use A LOT of images 500+ so this is very time consuming!

 

p.s love miro

icon

Best answer by Max Harper 15 March 2023, 17:28

View original

47 replies

Userlevel 7
Badge +5

@Luke Moorhead @Robert Johnson @Kiron Bondale @Judd Maltin

Found a moment tonight to build the plugin. 

Image Resizer

 

 

I think this functionality could extend quite usefully to resizing of a number of other items… 

What other items should it resize and how ? 
What else should it do? 

Direct message me for a link to test it out. 
 

Cheers, Max

  @Anthony Roux @

Userlevel 7
Badge +5

@Miro Fahmy 

/anyone else viewing this post: we can only share not-yet-on-the-Miro-marketplace apps via a direct message. Please DM me and I’ll send you the Miro Plugin install link.
Cheers :) max 

Userlevel 7
Badge +5

@Robert Johnson @Luke Moorhead   

 

SDK can read-only width and height on an image, but it cannot write width and height independent of one-another, it can only write (update) an image’s scale. … in other words it cannot change the aspect ratio - but can scale 1 or many images to 1 or many scales...   so… indeed → 
the Miro SDK can automate a mass-update to image(s) ‘scale’
 

this means… 
 

  1. Assuming that all the images come in with the same aspect ratio (ex: “square’ aspect ratio = 1:1) then a quick plugin could be built to size them to a set size by reading the width or height and scaling each to reach the target width / height. 
  1. Furthermore - if the aspect ratio is unique between all the images, but having a photo side/dimension ( height or width ) that user wants to all be the same... a user could select a dimension to make the same, select a target size, and then the SDK’s scaling could do all the work to make that dimension ( either width or either height ) the same for all images. 

     

 

Userlevel 2

 @Robert Johnson  Thanks for the feedback. Scale to original size does not work either as images are different sizes to start with. Example: I can save an image off Vogue & then screenshot an image off another website - once uploaded to Miro they are different sizes to begin with, hence original scale doesn’t work (it does it some instances when we upload our PNG sketches though!)

Example 1: All images are from the same original source, making it easy to rescale/keep same scale when highlighting all.

 

Example 2: Images from different sources upload at different scales making it arduous to go through and manually rescale to be same size.

 

@Max Harper I’m not a developer so a lot of what you said went straight over my head, but sounds like there could be a solve?

All images are generally same ratio 1:1 and if not we usually will manually resize/crop anyway to curate our Concept Boards.

Thanks all much appreciated!

Userlevel 7
Badge +5

@Madina Canning @Robert Johnson 


I see the issue and have fixed it. :) 

Hopefully you can get your teammates up and running now Madina. 


A few months ago, Miro changed their second-user-in-an-app-installed-team-auth flow... and made it better, but it broke old code. I updated our public apps and some others... but had neglected to update this one.  

Userlevel 7
Badge +5

@Helen Trokhimchuk @James Chun @Sébastien @Martin Haustein 
Image resize is now part of the core Miro UI. You should no longer need this additional plugin. 
 


 

Userlevel 2

@Kiron Bondale  That would assume all images are already the same size. My main problem is i need images to be the same size, easy to rescale all with above option once they are the same size - thats what we currently do. If you drag and drop images from desktop they upload onto Miro different sizes.

Thanks for your help!
Cheers

Userlevel 7
Badge +12

@Luke Moorhead - If that still doesn’t work for you, I’d recommend adding this as an Idea in the Wish List category by following the guidelines here: Wish List: Everything You Need to Know.

If you do create a Wish List Idea post, I would also recommend that you post a link to it back here, so that future readers of this post can quickly get to and vote for your Idea.

Lastly, don't forget to vote for your own Idea.

Custom Web-plugin using SDK

You could also explore if this would be possible using the Miro Developer Platform to create a custom web-plugin to accomplish what you are looking for. You would probably want someone with a development background to review the developer platform documentation.

@Max Harper - Do you know off the top of your head if image data can even be read using the SDK, and furthermore if image manipulation, i.e., resizing on the board, is possible?

Userlevel 7
Badge +12

@Luke Moorhead - My next thought--since this is not currently possible using native Miro functionality--would be to take the intermediary step of batch resizing outside of Miro. For the Windows 10 users, there is an Image Resizer Utility.

Userlevel 7
Badge +5

 
I’m assuming @Luke Moorhead , that you’re moving fast and copying images in directly from the web. No time for saving, and loading into editor, resaving, and then uploading


@Robert Johnson @Luke Moorhead   … this one might be even easier -- because you can copy from clipboard into the resizer … then copy away from clipboard… no ‘saving’ and ‘uploading’ or any of that … https://onlinepngtools.com/resize-png

Userlevel 7
Badge +5

oh man… I think I posted that too soon… Paste from clipboard works.
It looks like the actual feature of ‘copy to clipboard’ is … can’t do it “(yet)”
 

 

Userlevel 7
Badge +5

@Luke Moorhead @Luke Moorhead 
Here’s an OK option in the realm I was suggesting. 

A couple steps in the process - but its still copy paste. 
https://picresize.com/
 

 

Then copy to clipboard.

Paste into miro.

Maybe get all the images and process them in bulk with a minimum of clicky-clicky with imagemagik Aspect ratio is preserved.  Whew.

On a Mac: 

Before:

$ file setup-0.png

setup-0.png: PNG image data, 612 x 792, 8-bit colormap, non-interlaced

Convert:

$ convert setup-0.png -resize 100x100 setup-0.png
After:

$ file setup-0.png

setup-0.png: PNG image data, 77 x 100, 8-bit colormap, non-interlaced

 

I know, won’t work for ad-hoc, would be nice to shift-select and actually resize.

But you can do this to a whole directory of files and not think too hard about it ever again.

HTH

Userlevel 7
Badge +5

@Luke Moorhead @Michelle Pentz

 

  • I’ve updated our public privacy policy to include the Image Resizer ‘Resizer’ app here. (Its a working title and an evolving plugin name, icon, product ...etc… but the security/privacy won’t change.)
  • Refractive apps published on that page also meet all the rigorous guidelines for public Miro apps outlined here https://developers.miro.com/docs/security-guidelines
    • for example… see here that we pass the Qualys SSL tests with A+s 
       

 

@Max Harper Thank you so much! It works! Everyone on the board can access it now - this is a lifesaver! We are on the board everyday and this is absolutely amazing - thank you again! :clap:

@Robert Johnson Thank you for replying, the attached screenshot was the problem I was dealing with, thanks to Max everything is working now :) 

Thank you guys!

Userlevel 7
Badge +7

@Madina Canning Like @Max Harper posted earlier, they can only share not-yet-on-the-Miro-marketplace apps via a direct message.

"Please DM me and I’ll send you the Miro Plugin install link."

This means all of your team members must install it through that link.

 

Userlevel 7
Badge +12

they can only share not-yet-on-the-Miro-marketplace apps via a direct message.

To clarify for all readers: Miro confirmed that user’s are free to post links to their non-Marketplace apps. This may be refractive’s own policy.

Userlevel 6
Badge +1

Hi everyone, I’m excited to let you know that there are now more ways to edit multiple images at once in Miro. As @Max Harper mentioned (Thank you Max!), this bundle of improvements includes the ability to resize multiple images at once by height or width, saving you time and effort.

Check out the latest announcement in product news and let us know what you think in the thread there. We’d love to hear how its working for you. 

 

 

Happy collaborating, Kristin

Just saw that Kristin, thanks so much for adding the feature back in.

I was wondering where the image resizing tool was. Now when I select multiple images I can make them same height or width when selected.

Total time saver, thank you so much!

 

PS - Can we add the set base object in from the previous Image resizing tool you had so you can match width or height  to the base object? @Kristin 

 

Userlevel 7
Badge +6

@Luke Moorhead -

If you just shift-click and select all the images, you can then resize them as a group…

Kiron

Userlevel 7
Badge +12

@Luke Moorhead - I think I found a way to accomplish this. The caveat being--and what is still not clear in this post is--that all images need to be the same size/pixels/etc. I’ll admit, I ‘m not a graphics person and don’t know the proper terminology, e.g., they are all 1000x1000 pixels.

When you select an image, you are presented with an option to change its size:

And there’s another option in ellipsis of the context menu to Scale to original size (which is greyed out if the image is already scaled to original):

 

So, you can do a Shift + drag as @Kiron Bondale suggests, filter out any non-images, and scale them all or original.

  • Here’s an example of four duplicated images that I resized/change the scaling of and how I can get them all back to original.
  • The images are all 30234x3024 @ 72 dpi
  • I filter out the sticky note
  • Scale the images to original
  • and then use the Auto layout tool to evenly distribute them.

 

Userlevel 7
Badge +12

Stellar! Thanks, @Max Harper!

Userlevel 7
Badge +12

Thanks, @Max Harper - a possible solution/workaround just keeps getting better...

Userlevel 7
Badge +12

 

Userlevel 7
Badge +12

@Max Harper - Stellar work as usual! Because sticky notes already allow let the user select a size (S, M, L), they could be excluded (from an MVP, at least). So my vote would be Shapes and Cards.

What would happen with Text, seeing as they are sized by font? I suppose the answer here is the “copy style” option.

What about Frames?

Reply