I am sure that by now, you have seen what brushes in Photoshop can do for you. It is a pretty handy tool to create good looking backgrounds and wallpaper. But brushes are way more than just clicking here and there, there are a lot of options for brushes. You can scatter your images all over your canvas area or even make them change colour. Here is a slightly more advance brushes tutorial.

I will start by creating a simple leafy kind of background. This is what I have created.

1. Start Photoshop and create a new image. You should choose a area big enough to accomodate a certain number of elements, so choose something bigger in size like 640×480 or more. It will not look that good on a small picture. The things you should also consider is the background color, I have chosen white because it is the easiest to deal with. You can experiment with other colours later if you choose to.

2. Now let’s choose the Brushes option on your left-hand side tools palette. It looks like a small brush. I have shown it below.

It looks nearly the same as the pencil option, so becareful. Alternatively you can use the Shift-B key to toggle the Brushes or the Pencil controls. After you have done that, you will be able to see the Brushes Option Properties on the top or since it is dockable, you can have it anywhere. If you don’t see it, goto Window and tick Options to enable the Option properties.

This is the part we would like to take a closer look at. From here, click on the pull down option next to the Brush type. You can see they have the Master Diameter, Hardness and a little scrolly thing for you to choose the brush type. For this short tutorial, we will take a look at the Leaf brush only. So ahead and choose the Leaf brush type for your brush. Now you can play around with it. See how well it “scatters” and “tilts” when you click on the canvas? You can create a beautiful leafy background with it.

But in order to undestand the brush command, we need to go deeper into the brush option. So stop playing with the brush, we have things to learn. Yes, stop now.

3. We now go more into detail with the brush option. Click on the Brush tab (usually on the right top of your Brush option properties panel) and you will be shown a list of optons for you to choose.

Go ahead and untick all of them for this tutorial. We will go in step by step and see what each of these options do.

4. Now tick on Shape Dynamics and then click on it (the name) again. You will be presented with an array of options and drag/slider bars.

-  Size Jitter is simple. It randomly changes the size of the brush image. So if you set a high value, the brush images will vary a lot in size. Try it by sliding the bar and then clicking on the canvas. You can choose to control how the size jitter will effect your images.  

- Angle Jitter is exactly like Size Jitter, just that now it controls the angle of the image. It really looks cool if your images are all in random rather than looking like a neat stack of cards. But of course, it depends on what you are creating.

- Roundness Jitter is less obvious in our case. It is more to using normal dot(or round) brushes. What it does is control the roundness of your brush image. So if you set your roundness jitter to a high value, you will get more images which look flatten or squashed. It affects only the vertical height.  The below image shows the difference, the top image doesn’t have any roundness jitter while the bottom image has.

5. The next one is Scattering. One of the coolest feature you can find in the Brushes option. It sort of creates a wide area of the image scatter according to your preference. I like it a lot. So tick  the Scattering option and then click to go into it’s options. Again, we find options and slider/drag bars.

- Both Axes option. Well, to make it easy to understand, it scatters a bigger area in all directions if enabled. If not enabled, it only scatters in one direction. You would thought that it would create a wider area but instead it looks sort of clumped together if enabled because the scattering is in more directions. I was a bit confused initially but now I realize that it makes sense.

- Scatter.  Simple, the more scatter you provide, the wider the area of scatter. Depending on your image size, you may need to control the area of scatter.

- Count. The amount of images. So if you set a high value here, you will see that there will be more images being “scattered” all over. For a dense area, I would usually choose a high count value and a low scatter value. You will then get  more images scattered in a smaller area.

- Count Jitter. It controls the amount of images so that each instance will produce a more random number of images. If you set your Count Jitter value high, you will get a more random and varied look for your image. You should play around with all these values in the scatter option as they do a good job so that your images won’t look like a fixed pattern.

What I normally would do is to create a large image size, then set the brush scatter value, count value and count jitter value high to create a beautiful background easily without too much clicking. Sure you get less control, but the “randomness” of the image is good and you can always touch up afterwards. Of course, as I said before, this is dependent on what you are planning to create.

6. I will skip Texture and Dual Brush. This will be covered a later tutorial because doesn’t really affect much in our current tutroial. Now we go to the Colour Dynamics Option. So do the same thing, tick in and click on it to show the options.  This option allows you to control the colour of the brush images (for both background and foreground).

You can adjust the slider according to what you need. The very interesting option is the purity option. It deals with the saturation actually, and if you are looking to create a different variety of”darkness” and “colours” for your brush images,then you should set it high. If you only want minimal changes of tone colour, then you should set it low. Oh, you should also increase the values of the Hue, Saturation and Brightness values too. If you set them too low, the purity slide is of not much use to you anyway.

And you should experiment with all the sliders and try to get a good mix of colours for your image.

7. Okay, now let’s go to the Other Dynamics Option. Tick it and click on the Other Dynamics name to show the options. What will be as usual several sliders and options for you to fiddle around with.

- Opacity Jitter. A very powerful tool to create more randomness for your image. It is to control how opacque your brush images will be. Sort of like whether an image is a “see-through” kind or not. So if you set the Opacity Jitter high, you will get a number of “translucent” images which actually looks quite good.

- Flow Jitter. This controls the flow rate of your movement or stroke. You know like when you brush a stroke, you will usually get a continuous stroke but sometimes you will have missing “areas” on that stroke. So if you set the flow jitter high, you will see gaps in that stroke.

You can view a example here: Simple Sites

Well, that’s end end of this tutorial. Hope you guys know a little more about Photoshop’s brushes. I think you will definitely enjoy toying around with this powerful tool. You can even create paintings from it. But this is best left to another time. Ciao for now!

The best way to improve on something is to practice. And so, in order to improve my photoshop skills, I have done a little poster called Animal Farm. It’s done on Photoshop CS and is mainly with brushes and some text. It’s nothing impressive but I think it highlights the usefulness of brushes in Photoshop to create good and very elegant looking backgrounds. It’s also very simple to do. I think this poster came out okay, considering that I am someone with pathetic skills in Photoshop.

If you would like a simple walkthough on creating this poster, please keep on reading. It involves just simple brushes.

1. Okay, Start your photoshop software and create a new image, I chose 640×480 size, color mode RGB Color and background White. Next I go Layer->New->Layer to create a new layer for my animal prints.

2. The next step is to use brushes to create the paw prints of the animal. I use just 4 “dots” per print. 3 small ones and 1 big one. So I start brushes by going to the Tools Palette and choosing the brush command. It is usually on your left. Or you can just use Shift-B (twice if needed) to toggle to the brush. Make sure you are at the brush command instead of the pencil command. At the brushes properties, you can choose the size of the brush. If you look carefully, you can see that the bottom paw prints are slightly faded than the ones on the top. You can use the Hardness option to change that. if you would like it to be blur, that reduce the Hardness value. You also need to change the color in the color palette (usually on your left as well).


3. So now, go ahead and start doing your 4 dots (3 small and 1 big) per paw print. If you need 5 paw prints, then you need 15 small dots and 4 bigger dots. Remember to choose the Hardness level as needed. I use it to make the appearance that the bottom paw prints are further away than the top paw prints.

4. Now, let’s create the text. You can see that once you choose the text option (that’s also on the left menu) or just Shift-T and click and draw onto the area you want to write the text, you will have created another layer as well. You can type whether you want on the text box. You can choose the options like size and font type from the text properties. The Color Palette (same as the above) is for you to choose the color of your fonts. If would like to add other text boxes, you can do it here as well.

5. Next let’s choose the rectangle marquee tool (or Shift-M) and drag an area covering about 20% of bottom from the left to the right of the entire drawing area. The choose the color from the Colors Palette and the click on Paint Bucket Tool (Shift-G) to fill that area with a certain color. And you are about done. The next few steps are just repeats of what I have done previously.

6. Blood Splatter Brushes. You can see from the finished poster that there are several blood splatter which looks pretty realistic. I use VexingArt’s Blood Splatter which works really well. All you need to do is to download the zip file, uncompress it with some unzipping software and than double click on the .abr file. Next you will have to copy the .abr file to the Photshop directory, the preset and brushes folder. The brushes will then be loaded with you restart Photoshop. Next, you need to goto the Brush tool, choose Brush preset picker, then goto options and choose the new brush. That’s it. And you are done and can start to play with blood splatter.

Hey, good luck and have fun. If you don’t enjoy playing around with Photoshop, you shouldn’t be doing graphic design. For this poster, I think what it needs is to change the colour of the blood to a more reddish (bloody) type. Perhaps add a hand at the bottom so that it looks like it has been ripped apart by some animal.  Yes, I have a lot of ideas but no time and no skill.

If you are “brave” like me and would like to experiment with different colours for the web, one of the safest way to do is to use colours from flowers, fruits, plants or even the landscape. One of the things I discovered is that “natural” colours usually don’t clash and they complement each other very well. For example, if you take a flower (that is the entire plant which includes the flower) and create a theme, you will usually get a good mix. So, the next time you decide to design a website, you should go on the web and start downloading photos from nature like rivers, mountains, gardens, trees and even fruits.

You need just one little software called The Color Picker in order to figure out what colors the pictures or photos have. This software allows you to find out the RGB or the Hex value of the colour of anything on your screen. So all you need to do is to start the software and the move your mouse cursor to whichever you want to find and it will tell you the colour codes. And it’s free. I will do a little review on this software next time. It’s a great software.

Here are some samples (of flowers) colour themes which I have done:

#ECCAE1, #A04438, #C06DAC, #F5C629, #CA5AA2

#A5842D, #BD9674, #3A4F29, #E87B24, #DEB325

#F3EB3B, #0D1C15, #6BBB44, #E4DF4E, #DA59A1

Now let’s try others:

#C38D2B, #1E0A0C, #A44723, #425A28, #E88923

#E9D29D, #CD792C, #E49224, #D8B478, #F69246

#F3AC5A, #D7AF2E, #F9D290, #191512, #C23E26

#F69970, #456A80, #F5918C, #596A73, #B1A281

#EDA54B, #B05C7A, #FAEC9B, #E881AE, #6D6B7F

#F7E68B, #08182D, #E3E2E5, #667AA8, #B0BFCF

I am not a professional, but I hope that this little post will tell you how to easily choose your colours. Think nature. I think they are great for logos and graphics but you should use caution when you are using them for your webpages. This is because although the colours don’t clash, you need to figure out which colours will be for fonts, headers, background and so on. Using the wrong colours for your site will make your webpages look out of place. For me, I will usually go for light background with headers and footers a darker colour and their fonts something very light or even white. But of course, this is my opinion. And it would work well for beginners. Darker backgrounds should be meant for those more experienced with web design, since they do need more effort and care when choosing the colours.

What do you think of the colour blends I have made? Please, I would like to hear your comments.

What’s worse then going to the public toilet, shitting and THEN realizing that you don’t have anything to wipe your ass with? And that toilet cubicle doesn’t have anything, not even a tap to wash my ass with. Tell me, is there anything worse than that? That must be the grossest thing you have ever heard right? You must be guessing what I did. I am not going to tell you. I think it could even be illegal to post on the Internet.

And my office’s Internet access is flaky today. Sometimes it will just time out when I surf websites and I had to refresh and refresh constantly. Think it has to do with my ISP’s proxy. Isn’t proxies supposed to make surfing much faster and more reliable? Well, that’s what they tell me anyway. It just gave me more problems and headaches and everyone in the office is complaining about the slow speed. The boss is looking at me like it’s my fault and the technical support for my ISP seemed not to really care. “Thank you for calling LGA!” is the only thing they can say. Thanks for nothing. Can’t even do my work properly too, not to mention video and audio steaming. This is the kind of day I am having today.

If you got any worse days, please tell me about it. I wish to feel better. Or I could just go to bed and sleep.

New Theme For The Blog

August 28, 2007

Well, what do you guys think of the new theme? Is it better than the previous design? I had spent a few hours re-designing the theme and I think it turned out okay (I hope). At least it looks presentable to me. I mean, I had done several website designs before and most turned out disastrous! Some people even called it hideous!They were what I would call the bane of the Internet, probably scaring people so much that they quit going on the Internet anymore.

Anyway, before I go off topic, I would like to thank Han of Eruanna.net for the wonderful tutorial on writing and creating your very own theme. I couldn’t have made it without this nice tutorial. And I had also created a little logo for the blog. I think it is supposed to be little fiery dancing things but they could do with slightly more colours. A bit too plain and uninspiring for a logo. Maybe I will change one or two of the flames to fiery red or even bright yellow. Don’t worry, it won’t be over the top, and the logo itself is rather small so it won’t be that prominent.

The colours seemed to have matched well. I got the colours from some colour wheel which is pretty useful if you need something to help you choose colours for your site. I never fail to consult colour wheels whenever I do web design. The colours make or break a website and choosing the correct colours is paramount for every web designer. However, I am not too sure about the size and type of the fonts. Is it too big? It feels to me that the fonts are crowding the webpage too much. Would using smaller fonts or even a different of type of fonts help the layout and the overall look of the blog? I was thinking of changing to another font, so that it won’t feel too cluttered.

Well, if you any comments on the design? Please keep in mind that this theme is a “simple” and minimalist kind. I am not aiming for those flashy and loud sounding design, perhaps it is more a subtle, clean and even functional kind for higher resolution monitors. It looks way too cluttered if viewed on a lower resolution monitor. I really hope that the design makes reading this blog much easier. And I guess I need to think up a name for this theme.

This one was introduced to me by Scolls, it’s yet another tutorial for creating your very own Wordpress theme. You can find it here on Urban Giraffe. This tutorial is a little more detailed than the previous one I had read and it explains everything from location to style to functions. Everything. Which is of course very good, especially for beginners like me which can’t figure out one end from the other. There isn’t too much tech talk in the articles. And I can see that a lot of effort had been put in into creating this tutorial for us.

I think the main reason why I like this tutorial is that it explains clearly step by step the entire theme creation process. The authour doesn’t think that you know everything and he/she strives to give the reader details and explanations so that it gets less confusing as it goes on. Although I have a little understanding on this Wordpress theme creation, this tutorial does clear up some doubt I have with Wordpress. It even tells you how server-side PHP works! It comes in 4 parts and by the end of the fourth part, you should have nearly everything you need to create your very own theme for Wordpress. It starts with how the theme works, then followed by header and footer, next comes the sidebar and finally the content. This very smooth flow of the process makes understanding and working with Wordpress much easier.

Oh, the tutorial comes in the downloadable pdf format as well. But you need to pay for it. And you can even purchase a “professional” printed copy of the ebook.

And if you keep on browsing on this blog, you will find a lot of other information on Wordpress as well. They have several  articles on  how to make use of Wordpress like how to translate into other languages, how to separate comments and pings and so on. I think you will find it interesting to have a read. You can also download various Wordpress plugins from their site.  Some of these plugins are pretty useful to have.

Just when you thought that I had enough of searching for open source alternatives for commercial software, I am at it again. This time it is for CD/DVD burning software. I will now introduce to you InfraRecorder, a feature rich CD and DVD recording software for Windows. And this one looks good. You can do nearly everything with it as with Nero. I normally just burn data and video (like VCD and DVD-Video) with my burning software and that’s about it. It’s good to see an open source that provides the basic functions plus some additional features like audio.

Well, looking from it’s official website, this software is supposed to be able to burn data, audio, video and disc images. However, it supports only iso and cue/bin image types. And it is also surprising that it doesn’t support conversion to VCD format from other video formats. However, I am sure that there are other open source software which can convert to VCD (or mpeg) image for you. InfraRecorder allows you to create a DVD-Video Disc though. But as with VCD, conversion is not supported. There is an open source called K3b for Linux which can do all those and more. Too bad, there isn’t a version for Windows.

However, if you are looking to create audio discs, then IrfanRecorder is for you. It allows you to convert to audio cd format from a variety of audio formats without much hassle. And the audio conversion is reasonably fast. But then I am not too particular with my audio anyway.

Oh, InfraRecorder comes with something called InfraRecorder Express. It is just like Nero Express, meant for beginners. So when you start InfraRecorder, it comes with a wizard, asking what you would like to do. Like create a data disc, audio disc, video disc and so on. Yes, so that you won’t be confused with you are faced with the “mind-boggling” number of options in the actual software. Thank god for Wizards, right?

There have been a lot of discussion on the rel=”nofollow” tag recently. It seems that a lot of webmasters have taken to using these tags like nobody’s business. Nearly every single outgoing link has been tagged with “nofollow”. The reason is because a lot of webmasters are afraid that too many outgoing links will leak their PageRank and thus make their site less important. They are afraid that with less PageRank, they will lose out in Search Results rankings. As I said before, I am no fan of rumours and paranoia and if a lot of outbound links will make a site less important and leak PR, then Google (the Search Engine with tons and tons of links to other sites) will be the least important site on the Internet without any PageRank. Who can beat Google in indexing (and thus linking) the Internet?

Worse of all, some sites are suggesting to webmasters that one-way links are “toxic”. One way links are links that goes one way, without any linkage back. These sites suggest that 2-way links are better. So if a site reciprocate the link, then it would be healthy, but if not, they are suggesting webmasters to use rel=nofollow tag. Oh my god, you really can find all sort of nonsense and rubbish on the Internet. And these sites claim to be authority sites on Search Engine Optimization. Internet is all about links, and without links, we won’t be calling it INTERNET, won’t we? And if one-way links are toxic, then authority sites will never exist. Enemies of reason.

I think the rel=”nofollow” tag is good for stopping spam comments on blogs and other sites. That’s what it is meant for anyway. Google had known about the problem with blog comments and this is their solution. If a webmaster didn’t read the article, then I guess using the rel=”nofollow” tag on links for comments is reasonable. However, if a webmaster himself were to link to a site, then it should not have a rel=”nofollow” tag. If you write it, you should stand behind it.

And please, stop worrying about PageRank. It’s not very important anyway. I don’t mean to ditch link building completely, but you shouldn’t lose sleep over it. It’s a good gauge on the number of backlinks you have and it gives you a figure to “approximate” the “value” of your site. That’s about it. Write good content and do a decent amount of link building. Then be happy and drink some strong alcohol.

I am currently on a roll in regards to open source software! I am here again to introduce to you yet another open source software called Scribus! People usually use this software to help them create professional looking publications and documents, just like Adobe InDesign (or Microsoft Publisher if you are not into geek language). So desktop publishers can rejoice when they ditch their crappy Microsoft Publisher. In fact, Scribus has almost all the features that the commerical software Microsoft Publisher has. But then who in the publishing industry really uses Microsoft Publisher anyway?

And if you have been using Microsoft Publisher, you will find that Scribus is a bit too complicated to use. Not as user-friendly as it claims to be but if you would like higher quality and more professional looking publications, you will see that using Scribus is the way. It makes use of GIMP (which I had touched on a little while back) to do graphic editing and Ghostscript for PDF conversion. Scribus recommends using high quality fonts (and not freeware/shareware fonts) to do your publishing. While I agree with them completely, it is surprisingly that Scribus, an open source developer recommends commercial fonts instead. Kind of ironic. But they do include some additional fonts in their installation. It’s too bad that they don’t have the fonts preview option, so that you can see how the fonts look like before you use it. Another feature which I like is the Story Editor, which allows you an interface to easily format your text but still doesn’t come with a text preview. Being a software which relies a lot on fonts, I find that rather weird not to have.

And I tried to do some photo editing on their software and found that it is rather difficult. I can’t properly resize my image into the image frame. I had to do the resize on another software (or you can do it with GIMP from Scribus itself) and then re-import it back. Well, from what I heard that is what the developers want (to ensure the quality of the image), but find of frustrating to know that anyone can just resize the image from another third party software and just re-import it back! Seriously, what’s the difference? Anyway, if you don’t often do a lot of desktop publishing (like me), it should be alright. And the results can be rather impressive.

This software has potential. If they would concentrate on making it more user-friendly, especially for the beginner, it would be great. Even most of the publishers don’t really need some of the features they have. I am guessing that’s not their aim. This software is more inclined to professional publishers. Not for us regular users. But they do have a very active community to help others on their problems with Scribus. So if you faced some problem with using Scribus, you can find help from their wiki, mailing lists and through IRC Chat.

If you are using Windows, you need to have Ghostscript installed first to do printing and PDF conversion.

GIMP which stands for GNU Image Manipulation Program is a good open source alternative to the very expensive Photoshop. Yes, it’s free and it has some pretty impressive features. Most users use it to do touch-up on their photos, create special effects or just to edit their photos or images. I have been using Photoshop in my office for a while and I realize that it is very powerful. In fact, you can do almost anything on it. However, even for a company user, the price is quite out of the range for most. So I am here to introduce to you GIMP.

GIMP feels a lot like Photoshop. If you have been using Photoshop, you will find the switch to GIMP quite easy. However, the interface can be confusing at times because the GUI is very spartan and bare. Yes, it has to be get used to. But the incentive is that this software is free and you won’t need to fork out thousands for a copy. I often use this software to repair and improve my photos, like those unfocused photos, or those underexposed/overexposed photos and to remove the “red eye” effect without losing quality at all. And I often use this software to resize and sharpen my images. It comes with a full set of tools for painting, graphics manipulation, compression and so on. It easily converts from one graphic format to another. If you want to create animations with this software, you can! You can even add more features to it with plugins. And the possibilities are limitless!

And finally they have created a comprehensive manual for their users. But even without the manual, you can find a lot of resource (like tutorials, guides and walkthroughs) on the Internet on GIMP. It has become one of the most famous graphic manipulation software out there and it is constantly being updated. This software for available for Windows, Mac and Linux. And oh, if you find this software useful, please consider donating to their cause. It will help create a more powerful software for all of us to use.