Home
  • home

  • face race

  • blog

  • client work

  • contact

« Take the wide turn, love what you do.

iDevBlogADay Advertising Opportunity »
Screencast 2: How and when to use clipping masks
Mike Berg
14
Jul 2010

The latest entry in my iDevBlogADay “Photoshop for Devs” series, we’re going to talk about clipping masks in Photoshop and when to use them to make things easier.

Helping iPhone developers hate using Photoshop a little less with simple tricks that make workflows more efficient. View the rest of the screencasts in the “Photoshop for Devs” series.

Part 1:

  • Place a photo in a Polaroid border, without having to crop it. Keep its full resolution so you can scale and rotate it as much as you want.
  • Texture a chess board. Combine the texture layer with layer effects applied to the base layer.

Part 2:

  • Add a reflection to windows in a building and change the colours with a clipped adjustment layer. Add art to a billboard shape with rounded corners and perspective.
  • Create perfect silhouettes for your vector art. Mask multiple layers with a single base shape and apply layer effects to the entire group.

Part 1

Click the YouTube logo to watch there in higher-res.

Part 2


Thanks to @OwenGoss for letting me use his art from LandFormer for iPhone. Go check it out!

Addendum: You can use any layer as a clipping mask, not just vector layers. Plain-old bitmap layers work great too, if you need a “paintable” mask, or if you have a transparent PNG you want to use as a mask, for example.

Download the Photoshop files used in this screencast (except for the LandFormer artwork).

Category: Blog, idevblogaday, Photoshop for Devs, Resources  Tags: clipping masks, iDevBlogADay, Photoshop, screencast, vector
You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.
  • http://twitter.com/MostTornBrain Brian Stormont

    Great overview of masks! Thanks for taking the time to put together those videos! Very helpful!

  • http://acornheroes.com George Sealy

    Nice work Mike. Every time I see a professional using Photoshop, I always learn something new. Keep them coming!

  • kwigbo

    Awesome tutorial, I will definitely have a use for this. No matter how much you know about Photoshop there are always new things to learn. Thanks!

  • http://www.streamingcolour.com Owen Goss

    Awesome-sauce, Mike! So if I send you the rest of the LandFormer art, do you want to fix it up for me? ;) I kid, I kid…

  • http://weheartgames.com WeHeartGames

    I do *want* to (I'm just like that when it comes to Photoshop, especially when it comes to games), but I don't have the time right now! :P

  • http://twitter.com/MindJuiceMedia Ken Carpenter

    Thanks Mike! I was just saying to myself the other night that I need to figure out how that masking stuff works. I've managed to use it once or twice before, but wasn't really sure if I was doing it “right”. And the adjustment layer stuff I've never used, but I've wanted to do exactly that, so it's good to know that feature exists!

    BTW, does the color of the pixels in the mask have any effect on the masking or is it just the transparency?

  • http://weheartgames.com WeHeartGames

    Great! Glad to have helped. There is another way to do layer masks, I'll be going over that in another screencast. It's a bit different, but this way is more flexible in some ways.

    Pixel colour for the base layer has NO effect on the masking. Try painting on a layer and using it as a mask to test it out.

  • http://maniacdev.com/2010/07/photoshop-tutorials-for-iphone-developers/ Photoshop Tutorials For iPhone Developers | iPhone iOS 4 iPad SDK Development Tutorials, Programming Tips, News

    [...] How and when to use clipping masks – how to place a photo within a special border, texturing a chess board, adding reflections, adding art to a shaped and angled surface (in this case a billboard), and creating sillhouettes for your vector art. [...]

« Take the wide turn, love what you do.

iDevBlogADay Advertising Opportunity »

    Follow on:

    RSS | Twitter | YouTube

latest blog posts

  • Protect yourself against theft
  • New website for One Man Left
  • I like two things
  • Photoshop tip – layer style defaults in CS5
  • Sortie game icon with time-lapse video

Buy it now
on the App Store

A camera-based
party game for iPhone

© 2012 - We Heart Games Inc. All rights reserved.