Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

Design Photoshop Foundations Masks Basics Creating Basic Vector Masks

Natalie Nohel
Natalie Nohel
4,422 Points

What types of projects would you use vector masks for? Are there alternative ways to achieve the same result?

I am just learning details of Photoshop that I hadn't known from previous use, as well as learning to design. I am curious how web designers would use these tools.

1 Answer

Hi Natalie, I use vector masks in web page mock ups. For example, let's say that I have a row where I want a full bleed image. I place or embed the image in the mock up psd, and I will place a vector mask on the image, for the desired height. When you click the link between the image and vector mask, you can move/resize the image without moving the mask. It makes it very easy to get your crop exactly correct, with the ability of resizing the image later. Also, if you name the layer like this "row 2 background image.jpg", then go Generate Image Assets, you will have a correctly sized/cropped image ready for the web.