: Sketch: cut item in half with particular pattern I'm trying to take a heart icon and cut it in half with a zig zag or lightning shaped pattern so it looks like this broken heart.
I'm trying to take a heart icon and cut it in half with a zig zag or lightning shaped pattern so it looks like this broken heart.
More posts by @Ogunnowo857
2 Comments
Sorted by latest first Latest Oldest Best
I don't use a Mac so have no access to Sketch, but most vector editors work in a similar way.
In the documentation for Sketch I see that it says you can use boolean operations.
Here's a quote from the page here
Boolean Operations
When the shape you need is not among the standard shapes you will have
to create it yourself. The first impulse might be to to use Vector
tool and draw the shape from scratch. However you will find that many
times, a complex shape is easy to break down into the basic shapes.
With boolean operations you can do exactly that; combine basic shapes
to create more complex ones.
And it lists the operations in a diagram
So you could easily draw the heart shape, and draw the zig zag shape with the Vector Tool (sometimes called the Pen tool in other applications) to overlap the heart, then select both and apply the Subtract boolean operation.
Here's a similar drawing, but in Inkscape - the similar boolean operation is called Difference in Inkscape; the idea is the same. The same is also possible in Adobe Illustrator with Minus Front, in the Pathfinder.
Here is my solution:
We have heart icon (I just downloaded it from thenounproject.com/)
Modify icon that corner points placed exact on pixel grid intersections it will help us later. Place rulers on this points:
Place rectangle on one half of the heart.
Choose rect and select Edit by pressing button on toolbar. Add two point exact on rulers intersections, it will snap automatically. These point should be in Straight mode.
In Edit mode add point that will represent zig zag. All points should be Straight.
Group heart and rect shapes into group, duplicate group and rename them Left and Right.
Temporarily hide Right group by pressing the eye icon. Select rect and heart icons in Left group and press Substract button on toolbar. Now you have left half of broken heart :)
Select left group press Rotate button on toolbar place rotation point exact on lower rulers intersections. Then rotate left half by for instance 5 degree using mouse
Hide Left group, then select right rect and heart shape and press Intersect button on toolbar, now we have right half of the heart
Select right half, press Rotate button, move rotation point to lower rulers intersections and rotate by moouse for -5 degree.
Unhide left half, and final result is:
Download Sketch file
Terms of Use Create Support ticket Your support tickets Stock Market News! © vmapp.org2024 All Rights reserved.