Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

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.