Sometimes I need to tweak an existing web design. In my Sketch days if I didn’t/couldn’t have a source file, I might take a screenshot and in Sketch they have this great tool where you can select a portion of an image and copy/paste it. Need to move this down 100px and add a line of copy? I can do it in 30 seconds in Sketch.
In Figma, I know there’s the crop tool, but it seems to be this manual resize and then I need an uncropped copy too, etc.
Is there some option in Figma I’m missing? A plug-in that could help? I’ve tried HTML to Figma but the pages I need to capture make the plug-in freeze up.
As far as I can tell, this is in the ballpark of what I’m asking for, but not exactly it. It appears a slice sits above the image and I could export a piece of it and bring it back into the file, which is different than what I’m describing in Sketch, where you can directly edit the image and cut/paste pieces out of it. If I could post a vid or gif showing what I mean, I would.
To clarify further, if you place a slice in front of the portion you want to copy, then press Shift + Command/Ctrl + C, it will copy the contents of the slice, and you can then paste it where you need it.
I know I’ve done this before in Figma. Use some basic rectangle select tool and copy that window of an image and then paste it. So you can past a screen shot and slice it up and make basic updates without recreating these from scratch every time. Any luck with suggestions?
The beauty of Sketch’s implementation is that the detail AND size were preserved on copy & pasting of selected image area. Without having to add cumbersome slice elements to the stage. More useful and intuitive than Figma’s default image manipulation on stage.
Quick crop by pressing Option+double clicking image (or select image and tap the ‘crop image’ icon in top bar ) is what I’ve been using recently, but it’s not as quick and fluid as Sketch’s double tap image > drag cursor > copy & paste.
I want to paste a screenshot and cut a part of it (a product description on a product detail page). Then make the screenshot taller with more white space at the bottom. Move the description lower. Add a widget in between. This widget is the actual part I want to wireframe. Didn’t expect this operation to be so complicated in Figma