Easily resize/snap Artboard edges to match content bounds
Working on a landscape prototype version of a site, and to simulate the scrollable pages I bring the assets in, place them, and then adjust the height of the Artboard to match — but it would be really nice if there were Smart Guides when doing so, so the Artboard snaps to the height of the assets on the page.
Size of artboard should fit content exactly.
Nathaniel Thompson commented
Just like Mark said. Its VERY ANNOYING to have to readjust my artboard every time the length of my page increases a little bit.
"I want my footers to remain consistent and I want to work quickly. I want the art board / screen height adjustment to snap to the bottom of the content/art/shape so I don't have to zoom in to make sure the bottom of the art board is matched up perfectly or have to calculate every distance."
Ben Tupper commented
The plugin that will do this is called Trimmit. Free. Works.
I did a search inside XD's plugins panel (click the little + to open search) after selecting plugins (bottom left - looks like a lego piece) in XD's ui. I searched for "snap" (no quotes of course). It found something called Trimmit. I installed it to give it a try. It's free and installs in the XD plugins panel instantly. I went to the artboard in question which is 1280 x 800 (default Web 1280 XD artboard size). I clicked on it to select the artboard. I clicked the Trimmit button in the plugins panel. It instantly increased the length (from the top downward) to match the artwork (1280 x 3309) on the artboard.
Does exactly what I need as I take lengthy screenshots from a web app and import them into XD. I would imagine it Trimmit will make artboards snap to artwork for multiple artboards at a time, but I only tried it with one and it just worked.
Looks like this was created by someone from Adobe... here's the link to his GitHub page: https://adobe.com/go/xd_plugins_discover_plugin?pluginId=3a010606
This would be so helpful. Specifically snapping thing to the bottom of content. Then I'd be able to quickly add my 24 px or whatever padding to the height without a bunch of zooming and fiddling and anxiety >_<
I've designed the screen but add a new element to the design. Now I have to adjust my screen size.
I want my footers to remain consistent and I want to work quickly. I want the art board / screen height adjustment to snap to the bottom of the content/art/shape so I don't have to zoom in to make sure the bottom of the art board is matched up perfectly or have to calculate every distance.
They got a plugin that does this. Make it a core feature.
Serkan Zararsız commented
Such a small important detail which saves a lot of time in zooming in and out!
This is a feature that I got added to Sketch. Super useful to place your footer and then drag the bottom of the artboard upwards and then it "snaps" to the bottom of the footer element.
Thomas Hale commented
I agree! Illustrator has the feature to resize artboard to fit around selection. It is often not possible to see the height/width of objects selected if they are not grouped adding extra work to get it done. Having a feature to more easily snap to boundaries is needed greatly.
+1 for this idea. Is this in the backlog?
Damian Nagrabski commented
It would be great to have that option that InDesign has which if 'fit frame to content'.
Sander Schellen commented
Double click a side of the artboard tot let it resize until the first element inside the artboard. This feature already works for text boxes.
Sketch does this native to their app. no plug-in needed.
Rodrigo Mendoza commented
It would be useful to have available an option that could help us make the work of resizing artboards to fit content easier. Currently, the only way we can do that is by zooming in enough to reach the bottom of the artboard and drag it until it meets the bottom of the last element.
Brice Tuttle commented
EDIT: I still think this feature would be handy, because I came back here weeks after suggesting people use the plugin... and had forgotten about the plugin. It's much more quick/natural to drag the edges of my canvas than it is to hunt through a list of plugins
Brice Tuttle commented
Just to reiterate what JJ said, there's now a plugin for this called "Resize Artboard to fit Content" ... although it would be a real nice native feature, too :)
Maarten van Broekhoven commented
When designing (web) pages that vary in length it would be great if the artboard would snap to the content inside the artboard. Now, when I want to adjust the artboard length I have to zoom in to see if I'm being pixel perfect. I find this very annoying and time consuming. It would be even better if there was an option for the artboard to automatically increase/decrease in length based on the content inside it! This would save me a lot of time that I could spend on more interesting stuff ;).
There is now a Plugin to resize the Artboard to fit the content called "Resize Artboard to fit Content".
Rodrigo Mendoza commented
I can totally relate to this feature request, especially to what Wephisto showed in the video. Artboard's snapping will be very useful and improve our workflow a lot. I really miss using it as I used to in Photoshop before Adobe Xd came into place. I hope we have it available anytime soon.
As a user, I want to be able to use the create new artboard tool and have it automatically set the max height and width of the content.