Boolean operations can help with merging (adding), subtracting, intersecting and exclude-overlapping vectors. In XD, these operations are nondestructive, allowing designers to enter the new group to edit individual elements that form the group.
- [Instructor] In XD when you're working with vectors, you can use Boolean operations to create addition, subtraction. You can have two vectors that intersect. You can also create Exclude Overlap. So let's say I want to create something similar to this pin icon. To get to that result in XD, I'll need two circles. I will select both, then I will align them.
And in this moment, I need to use subtraction here. I will subtract, and as you can see, now I have an oval here that has a hole in there. And if you open the layers panel, you'll see that, now that new group is a subtraction, and it has the two elements inside. So the first thing you notice here is that this operation is non-destructive. So I can still have access to both elements as I want.
So I can double click to access this or this and play with that. The next thing now is to have this anchor point and drag it down. So to access that anchor point, I can double click and double click one more time. Now I'm accessing the anchor points of this path. I can now click on this guide and just move it down. I even have some guides to help me get there. The next thing is, I can double click to get rid of the handle, and maybe I'll drag a little bit more.
And nice, now I have a pin icon where I can say, okay this is gonna be that green, and the border will be a white. And I'll do a two here for the size, and maybe I'll zoom in here. And as you can see, I'm getting to a very similar result. The only difference was that circle was a lot smaller, and I can double click to get to that result very easily.
So this is how you use Boolean operations to create more complex vectors in XD.
- Understanding all tools in Design mode
- Bringing files for Photoshop, Illustrator, and Sketch
- Working with text, vectors, image fills, and masks
- Repeating elements with the powerful Repeat Grid tool
- Resizing multiple elements with responsive resize
- Using the new Assets panel to manage symbols, colors, and character styles
- Sharing symbols across files, with text and image overrides
- Creating and consuming bitmaps and vectors from CC Libraries
- Extending the power of XD using great plugins