Mask Tutorial and a Link for Coding

Hi, everyone!  I have a couple of things I want to share with you today.  They are a mish-mash of topics, but, all should come in handy.  Shall we get started?  M’kay!

First up is a series of posts, “31 Days of Coding Basics”, to help you with some of the simpler codes you can use on your own blog or on others, like in the comments section.  This series is on This Bold Girl.com.  Coding is all of the Greek, or Swahili, I’m not sure which, that allows you to create some cool stuff on your blog or website.  It’s really ‘html’!  LOL  For instance, you can add a bold heading to each sub-section of a post if you are posting on several topics, as I often do (See Below).  You can add a link to a comment you make on someone else’s blog.  You can create lists, breaks, emphasis and italicization.  The last two are useful for me since these attributes don’t exist as options on the ‘visual’ page I post on here at WP.

None of the posts/instructions are very long or tedious.  Rather, you may just learn something quickly and easily.  Gwen, the ‘Bold Girl’, writes a good tutorial!  Give it a shot and see!  I know I was envious of those folks who could place links in their comments on other folks’ blogs.  Now, I can do it!  There may be a trick in there that you can use!

Look at the sub-title just below.  I used code to get it like that.

Key-Stroke Shortcut

Next up, I want to show you something.  It is kind of a keystroke, only different.  LOL  If you use Masks in Photoshop, this is a cool tip!  Say, you are extracting an item from an image.  I almost always apply a Mask to the image I am going to extract from.  This gives me the ability to change things and clean things up more easily.  It keeps your image ‘non-destructive.  Then, I begin selecting the item with the Quick Selection Tool, getting up close to the edges as possible.  When you are satisfied with the selecting, click on the ‘Add Layer Mask’ button at the bottom of the Layers Palette.  This should isolate your item.  If, instead, you’ve masked over the image in error, just switch the masking to the item by clicking on Select>Inverse, then, add the Mask.  (Whichever area you Mask, either the background or the circle, the selected area will remain visible, while the remaining area ‘disappears’, when the Mask button is clicked.)

Here is the tip!  If you would like to check the Mask to be sure there aren’t any places missing or ragged-looking, press ‘Alt(Options-Mac)’ and click on the Mask in the Layers Palette.  The Mask will be completely visible.  This is priceless on difficult images.  You can brush over any areas that you need to, then, simple do the same keystroke to return your image mode.  Or, just click somewhere on the mask’s Layer itself and the image reappears.

Here is a simple image I whipped up to show you how to do this.  I want to isolate the circle to use elsewhere.

Select the circle with the Quick Selection Tool.  Add the Mask.  Then, press ‘Alt'(Options-Mac)’ and click on the Mask in the Layers Palette.  You should see this:

Remember, White Reveals, Black Conceals.  The Layers Palette looks like this:

When you get the Mask cleaned up, and you are satisfied, simply click the same Keystroke or click anywhere on the grey part of the Layer.  This is the result:

(Though it is hard to see, the PS background pattern is showing all around the circle.  I can now save it as a .PNG file.)

When I get the Mask work done, I can right-click on the Mask and select ‘Apply Layer Mask’.

And, here is my newly extracted circle!

Being able to tweek the Mask is a perfect way to see what you may have missed while selecting.  My eyes aren’t as good as they used to be, so, this helps me bunches!  Because Masks are editable, you can make changes by going over any areas with the opposite colors: black-conceals or white-reveals.

I think this will do for today.  I have some more things to share, so, watch for them.  Until then,

SMILE!

Hugs,

Su

Advertisements

“The Worms Crawl In, The Worms Crawl Out” – Freebie and Tut

Greetings, All!  I’m back to share a little more gross-ness with ya for the spooky holidays coming up!  If you saw the QP’s for this month’s freebie, “Goth-n-Gore”, last week, one of them had a dirt background with grub worms crawling throughout.  I meant to include just the background in the kit, but, I forgot it.  So, I am going to go ya one better!  I will give it to you here, plus, I’ll show you how I made it, complete with resources!

Here is a preview of the QP’s from last week’s post:

Click on image to visit post.

Here is a preview of the ‘dirt’ texture I made:

The ‘grubs’ are from an ‘.ASL’ file from Sonarpos at DeviantArt.   Here is a preview of what it looks like:

Here is a zip of the texture and the pattern:

http://www.suruha.com/download/su_oct12/su_DirtWorms.zip

And, finally, the tutorial for the wormy-dirt background!

1 – In Photoshop, open the 3600X3600px ‘Dirt Texture’ from above.  Load the ‘.PAT’, Pattern, file.

2 – Create a ‘New File Document’ at 3600X3600px, 300DPI, RGB, Transparent Background.  Copy and paste the ‘Dirt Texture’ into this ‘new doc’.

3 – Create a ‘New Layer’ in the Layers Palette and fill it with the ‘Worm’ pattern.  I increased the ‘Size’ of the pattern to 200% for a better look.  This pattern is not seamless, but, since we are only showing several of the worms, it won’t matter.  Just avoid any ‘lines’ where the patterns don’t match.

4 – Slip the ‘Worm’ layer down underneath the ‘Dirt Texture’.

5 – Add a Layer Mask to the ‘Dirt Texture’ layer.

(A Layer Mask is white when you first apply it.  The image it is fully visible.  By painting over it with black, it ‘erases’ those parts of the Dirt Texture the mask is on.  This allows the image/pattern beneath to show through.  The beauty of masks is that, if you mess up, simply paint back over the area with white and start again!)

6 – Lower the Opacity of the ‘Dirt’ layer enough to see the Worms underneath.

7 – Click on the Mask to activate it.  With a soft brush, using black, ‘paint over’ several of the worms to expose them.  I lowered the ‘opacity’ of my brush to 15% to let the worms peek through gradually.  Brush over the lighter areas more than the darker areas, following the highlights and shading of the worm pattern.  You can vary the strokes to achieve a more random look.  It will appear as though the ‘worms’ are coming through the soil.

8 – Raise the Opacity of the Dirt Texture layer back to 100%.

9 – Add any enhancements or adjustments to the overall image, merge the layers and save!  That’s it!

Finally, here is one background I made if you don’t want to make this yourself.  Click on image to save it full size.  It is 3600x3600px @ 1.6mb.

I hope you understand my directions.  If not, post a comment and I will get back to you.  Have fun!

Hugs,

Su

 

Burn and Dodge ‘Non-Destructively’ Tutorial

It has been some time since I posted any kind of tutorial.  I think it is time.  I’ve been using a technique. lately, that I learned recently.  It is a tutorial for using the ‘Dodge’ and ‘Burn’ tools easily and ‘non-destructively’.  The goal in Photoshop, ideally, is to effect ‘non-destructive’ editing.  That is when all of the filters and adjustments are on separate layers, thus, making the editing of those layers a snap.  This is so that one can save the .PSD file and come back to it at a later time and still be able to affect changes to it.  Clear as mud, right?  LOL 
When one uses the ‘Burn’ tool, it affects the actual layer.  It darkens, or ‘burns’, the image layer, so that, if you changed your mind later, you would have to re-upload that image and start over.  For this reason, I seldom used either of these tools.  Supposedly, if you add too much ‘Burn’, you can undo it by going over it with ‘Dodge’.  It never looks right, though!  It’s hard to ‘Dodge’ over the same exact spots as the ‘Burn’, as well.  
With this technique, all of your ‘Burn’ and ‘Dodge’ effects are on their own layer, not the image layer.  When you use either of these tools, you can’t get any results by applying them to the empty layer just above the desired layer.  Unless, that is, that layer is filled.  Fill it with ‘Edit’ > ‘Fill’ > ‘50% Grey’ and change the blending mode to ‘Overlay’.  It will be as good as invisible.  Yet, when you apply ‘Burn’ and/or ‘Dodge’ to it, they will show up just as if you applied them to the image layer itself.  Try it!
Here are a couple of screen shots to show what I mean.  I’m using some vintage frames from Star Sunflower Studios, “CU4CU Frames 5 Freebie”, available HERE.  For the purposes of this tutorial, I am going to ‘age’ one a little more with the ‘Burn’ tool.
Here is what I start out with:(I am using CS5 for this tutorial)

While the layer I want to ‘Burn’ is highlighted/selected, click on the ‘New Layer’ tab at the bottom of the Layers Palette.

Go to ‘Edit’ > ‘Fill’ > ‘50% Grey’.

When the box pops-up, select ‘50% Grey’.

You will see this:

This is when you need to change the blending mode to ‘Overlay’.

And, voila!  Good as invisible!

But, as you see, because the frame is transparent, the ‘Grey’ is showing in the blank spaces surrounding it.  We need to clip the Gray layer onto the frame with a ‘Clipping Mask’.  Right-click over the Gray layer and select ‘Create Clipping Mask’.

This is what you end up with:

It looks just like it did when we started!  Yet, look at the Layers Palette.  Now, we have an invisible Grey layer in there and that is where we are going to add the ‘Burn’ and ‘Dodge’.  After selecting the ‘Burn’ tool, go up to the Menu Bar and set the ‘Range’ to Mid-tones and the ‘Exposure’ to 10% to start out.  
With a soft brush around 200px, burn around the edges, or where ever you wish to add the burn.  Here is just a wee example:

This isn’t a real good example, but, you can see that the ‘Burn’ tool worked great on the Gray layer.  Zoom in on the above image and see how the Gray layer is ‘Burnt’.  I simply ran it around the edge.  If you don’t like the results, delete that layer and create a new Gray layer.  Easy-peasy!  The ‘Dodge’ tool works, as well, though, I only added a little bit right in the middle of the frame.  Give it a whirl and see what you think!  If you use these two tools to add shading and highlighting to an image, this will give you a little more leeway.  Try different blending modes on the Gray layer, or leave it on ‘Overlay’.  You could even duplicate the Gray layer several times to get a heavier effect.  This image is with the Gray layer duplicated only once:

The original ‘Frame’ layer is completely intact, too!  We haven’t touched it.  If you save this file, as is, with the layers not merged, in .PSD format, you can return to it at any time and change any part of it to adapt to your needs.  Change the color, using the ‘Adjustment Layer’ feature, also at the bottom of the Layers Palette.  Those adjustments go to their own layer right above where you need it.  Here, I added a violet color adjustment layer with an ‘Hue’ blending mode applied to it.

I got this:

Font:  KingThings – ‘Willow’

Cool, huh?  LOL  And, if I ever need a green label, it’s simple a matter of turning off the violet color layer and adding a new ‘Color Adjustment Layer’ for my choice of green.  I can change any part of it!  This will certainly be useful for photo-manipulations, particularly, if you are having problems getting the light right.  You can try it out on a Gray layer until you get the results you like. 
I know that there are other ways to go about every thing I have shown you here.  There are keystrokes that could be used and other ways to ‘Fill’ a layer.  But, to try to keep this short enough so as to prevent ‘Novel-length’ status, I leave them out, this time.  See what I made?  I needed one for my blog, anyway.  I moved all of my ‘blinkies’ to their very own page and need a new button to click on to get there.

I hope this is understandable.  If you have any questions, please, do not hesitate to ask in the comments below.  Be sure to stop by Star Sunflower Studios and get your own set of these frames.  By the way, there is a PS Shape in the file with the frames, too.  Say “Hi” to Sü for me!  LOL
FYICommon ‘Umlaut’ letters:Type ‘Alt’, then, the number combination.Alt + 129 = ü
Alt + 137 = ë
Alt + 148 = ö
Now, when ya’ll go see Sü, you can impress her by typing her name in the comments as she does!  LOL
I have a freebie in the works.  It will be up in a day or so.  Also, don’t forget Monday, Miss Edna and I come out with our February freebie.  It’s purdy!  LOL
Until then…
SMILE, YA’LL!
Hugs,
Su
SU CheshireCat

A Tip and A Spooky Freebie

Lesa Snyder’s 4-Day ‘Photoshop CS5 Intensive’ wrapped up today.  Lesa is so knowledgeable!  She explains things so thoroughly!  I missed the first day, but, with what I already know, hopefully, it would have been ‘old news’.  LOL  I doubt it.  One can always learn something new!  Some of the things she has taught that I did know, she has offered an understanding of why it works, or how, so, that is always nice.  Understanding the where-to’s and what-for’s has always done the trick for me in remembering stuff.  So, go Lesa!  LOL
One of the areas I haven’t really learned yet in PS is ‘Smart Objects’.  Somewhere, I got the notion that they were some special trick that everyone but myself knew.  I caught that they were editable, but, I thought images already were if you saved the layers.  It depends on what you do to an image, I guess.  I learned how to use the ‘Adjustments’ on a separate layer so these could be turned off if desired.  But, I did wonder about ‘Filters’ and some other things on a separate layer.  That is exactly where Smart Objects rule!
Even if you are scared, like me, to try something new and tense-sounding, here is a super easy way to show you how they work.  I Googled ‘wild flowers’ and got the poppy image from Kyle Veldhouse.com. 
So, ready?
Open your image.  Right-click over the layer and click ‘Convert to Smart Object’ from the menu.  This is necessary in order to be able to apply a non-destructive adjustment.  Next, go up to ‘Filters’-‘Blur’-‘Gaussian Blur’ and set it to the amount of blur you wish.  This will depend on your image.  For mine, I chose a setting of 3 point 4.  When you click ‘Okay’, look at the ‘Layers palette’.  Now, there is a layer beneath our image, with a mask.
You can see, in my screen shot, that there is a small circular black spot on the mask.  That is the next step.  Just select a soft round brush and be sure the foreground color is black.  By using black on my mask, I am ‘erasing’ the blur over just the red flower(even tho the filter is ‘below’ my image).  Zoom in close and get the details on the edges for a more realistic look.  By using a mask, if you make a mistake, just hit ‘X’ and the black and white will reverse.  ‘White reveals – black conceals’ the image the mask is applied to.  I’m not really erasing it.  I’m covering it up.  This is what I get.
Ta-da!  I’ve added the blur all over, except over the one red flower!  This is kind of a simplified technique, but, look at the possibilities now with the image.  Say, I later tired of so much blur.  All I have to go is go back to my image file(be sure to save it as a .PSD document).  I can click on the ‘Gaussian Blur’ layer and still make adjustments!  There is no need to keep a copy of my poppy image since I already have one in this file.  No adjustments what-so-ever have been applied directly to the image.  Rather, all the adjustments, filters, etc, are on separate layers. 

If you’re wondering what the attraction to all this is, the ultimate goal of Photoshop learning is to do all of your adjustments and fixes, to all your lovely photos and/or creations, non-destructively!  Having your tweeks and filters and all that stuff on separate layers from your image is so nice!  A prime example of needing this set-up is those times when you are half way through, say, a beautifully textured paper and you don’t like one part of it.  If you’ve Blurred it or applied any other ‘destructive’ technique to any part of what you are doing, it can’t be ‘undone’.  Not unless, that is, you just did it!  I have applied Gaussian Blur to different layers of something I’m working on so many times, it’s insane!  I had to delete that layer and go find the texture, or whatever, that I had, so, I can try a different filter or adjustment on it.  By doing things with Smart Objects, I would merely have to delete the filter layer and do another.

I realize this is but one teeny-tiny way that you can use Smart Objects, but, getting a good basic concept of how they work really does help!  I found that, after I grasped this concept, the rest of Lesa’s class made so much more sense to me!  I had no idea what Smart Objects were all about!  LOL

Give it a try!  If Smart Objects are new to you, too, you’ll begin to see the importance of using them.

I can’t leave without a little something for you all.  This is a set of six papers, grunged out, each bearing a different spooky, Hallowe’en-y symbol.  I did them just for fun and just for ya’ll.  I don’t know what you might use them for, but, do with them as you like.  The texture came from LostandTaken.com.  The symbols are shapes from ActionFX.com

Speaking of ActionFX.com, if you head on over there, right now, you can get a year of his super Photoshop goodies for $16.95!  Can you believe that price!  But, hurry, ’cause Al is getting the site all loaded up and refurbished, then, his prices will go up.  It’s worth it either way.  You name a pre-set, ie brushes, patterns, styles, actions, etc., Al has it – lots of it!  He caters, too, to the scrapbookers, as well.  There are tutorials, plus, he has a custom photography service that yields some beautiful pictures!  Oh, and his terms are that you can use use his stuff commercially.

I got side-tracked!  Sorry!  It’s just that Al is one Hell of a great guy!  LOL

Anyway!  Click on the preview to go to Minus.com to download the papers, if you like them!

Until next time…
Dance on into Autumn!
  Winter is on her way!
Hugs,
Su

SU CheshireCat

Collab Freebies – Parts 3 and 4, Plus Links

Good Morning!  I trust your weekend was relaxing and that you are ready for the week.  It’s here!  It’s a Monday morning, both g-kids are home with me and another one is on the way.  The little one, my son’s son, is coming so his mommy can go to an appointment.  I’m slugging back my first cuppa and trying to get ready for the day.  You know how it is.  You’re ready ’cause you gotta be!  In hind sight, one may wonder why we put ourselves through such difficult times – three little kids, first thing on a Monday morn.  Well, it is rather like the song,  “The Dance”.  I might have missed some pain, but, then, I would have missed the ‘dance’.  Life is a dance.  We dance our little hearts out all our lives.  Sometimes, we try to avoid ‘bad weather’ and we hide in our shells.  Other times, we’re right out there, dancing in the rain, making the most out of a rainy day.  That is me.  It took me quite a few years as this is a learned attribute.  When you get older, you relish any dancing and try to withstand any inclement weather the best we can.  You roll with it.  That is when life becomes the best, to me.  I can choose to react to every situation with the same panicky anticipation, or, I can choose to pick my battles.  Life sure gets a lot easier when you do.
Alrighty, then!   Onward, I have some links to share with you.  How do ya’ll like vintage clip-art?  I found a website that has a ton of clip-art and it’s free.  Let me tell you.  The website is from the University of South Florida.  It is a part of Florida’s Educational Technology for educators.  From their site they, “provide digital content, professional development, and technical services supporting the appropriate integration of technology into K-12 and preservice education.”
The terms are that you may use up to 50 images at a time for educational purposes.
The screen shot above shows the 4 main categories, Clip Pix, Clip Art, Presentations and Maps.  The first two are self-explanatory.  So is Maps.  Presentations is neat!  They are designed for PowerPoint, but, there is an awesome collection of paper figures.  Here is an example:
What’s even nicer is they come in several sizes.  They’re ‘.TIFF’ files, which are supported by many programs.  I know you will be interested in the variety, as I was. In addition to the people clip art, there are frames, some Alphas and some PowerPoint templates.  There is bound to be something you can use.  Go give them a visit.
For a quick run through of some old standards worth paying a visit, let’s start with Atomic Cupcake.  Their new freebie is a ‘barely stamped’ action.
The Coffee Shop, has posted some new frames and storyboards.  Rita shows you how to get the most out of the frames, which come complete with a vintage texture.
Next, if you are into digitally mastered images, like DAZ and Poser, I have a link for you for very nicely done ‘stock’.  DeviantArt is an entity in and of itself, but, one stock provider I found, Cheyenne75 has an awesome collection.  The menu is down the left-hand side.  Be prepared for ‘creatures’, in that she has all kinds of aliens and unusual ‘monster-ish’ goodies.  I like this site with Halloween coming.  After all, where else are you going to find a ‘magic beanstalk’ or a ‘zombie dog’?
Another site, Made to Be Unique, is similar.  There, you can find all kinds of images, digitally produced, to help with designs.

If you’ve never considered this kind of stock, these folks have done a good job and their goodies are worth checking out.

The last one is a designer who keeps a DeviantArt website and a blog.  JustieJ and Just Creations are there for designers.  ‘Justie’ creates templates and Photoshop resources to make designing easier.  Both websites of hers have about the same stuff, though, it looks like many of the actual downloads are on the blog, Just Creations.  On the DeviantArt pages there are a lot of ‘cut-outs’, .png files for you to use.  Like this:
In addition to her wonderful designs, she also has an blog devoted to tutorials, Just Creations Tutorials.  There is quite a selection.   She teaches the details of light and shadows, plus, a lot of coloring or recoloring of elements.  One tutorial shows how to make a paper preview for one’s designs.  There is also a free pre-made template for it if you just don’t have the time.  Like this:
And, that is it for the links today.  But, I’m not done with you, yet!  Today is the second set of parts from my collaboration with Miss Edna’s Place, “Tropical Sunset”.  Last week you received the QP’s. Pts 1 and 2.  This week and next week, we’ll be giving away the scrapbooking papers and elements.  We each give two(2) parts each week, so, you should have four(4) parts today.  Though my previews indicate the elements separately from the papers, each part is a combination of both.  The first preview will take you to Pt. 3, and the second one is to Pt. 4.  Then, after that, you’ll see Miss Edna’s preview.  Click on it and you’ll get to her blog for her downloads.
 Part 3
Part 4
Miss Edna’s Place Preview
(click on preview to navigate to her blog)
Isn’t that awesome?!
(Note:  All of my past links are still active.)
I want to share a little something else, real quick.  I found the neat ‘ant’imation, below, at Crafted by Gina blog.  Gina does beautiful scrapbooking designs and has taken part in several blog trains.  A lot of the links are still active for the older posts, so, check those out.  All this is is a .GIF image.  You treat it like you would any image.  If you want to use it down in the siggy on your own blog, here’s how:
On Blogger, go to ‘Dashboard’;’Settings’;’Formatting’.  Down the page you’ll find a text box labeled, ‘Post Template’.  There, you paste the ‘HTML’ link that Photobucket, or any other host site, provides you.  Then, after you save, the very next post will have the ant, or any other little goodie you like for the siggy part.  I have two, right now, the ant and the Cheshire Cat.  I thought you all might be interested, so, that is how it is done.

PhotobucketRemember to keep smiling!Hugs, Su SU CheshireCat