NEW ARTISTS ARENA

New community is already open!!! Still in BETA but please go try
It is called ArtistsArena.Org
Before posting please watch the video instruction
here:
Make sure you follow the instruction otherwise your post will not show up.
Watch out for the up coming ART TOURNAMENT every two weeks with awesome PRIZE for the winner!!! Be prepare. ;-)
Showing posts with label Help Files and Tutorials. Show all posts
Showing posts with label Help Files and Tutorials. Show all posts

Saturday, January 31, 2009

Tutorial Perspective interior

Final Image:


In this tutorial I'll show you how I created this image.

If you wonder how to use some of the tools or where to find stuff, go to Photoshop Help (F1) and search for it.



Step 1: Setting up the perspective grid.

I like to get rid of the white canvas so I fill it with grey using the paint bucket (G).

Make a new layer.

Choose the line tool (U). In the top left you can change the settings for this tool. Set the weight low to make thin lines, about 3 pixels. Choose the mode in the middle: to draw paths. Because they're paths, you can see them outside the canvas which is nice when the vanishing point is outside the canvas. The lines you draw won't appear in the layers window but in "Paths" (Window > Paths). If you right click on this you can fill it with a color.

Deselect the paths by clicking beneath the path you just created. Now that we have the grid on a layer, we can head back to the "Layers" window. Eventually lower the opacity on the grid so that it won't be in the way.




Step 2: Sketching.

The sketching stage is probably the most important one. This is where you put down your idea and set the base for the entire drawing.

Make new layer. This layer is for sketching. Use the perspective grid to help you. If you're unfamiliar with drawing in perspective, don't worry. You'll notice if you make a mistake and it's easy to correct it. I sketched a hall. One-point perspective is great for halls and things like that. When done, you can make the perspective grid invisible.




Step 3: Cleaning up the sketch.

Create a new layer and, lower the opacity of the sketch layer. Draw over and clean up the sketch. When you're done you can make the sketch layer invisible so that you only have the clean lines.



Step 4: Blocking in value.

You can paint clean shadows by painting with 100% black on a separate layers. The layer opacity should be around 30%. I used multiple layers here.




Step 5: Correcting value.

Take a big round soft brush, set the brush opacity to around 30% (hotkey: 3). Paint until it looks good. Don't care about details, but focus on the picture as a whole. Correct the values as you see fit.




Step 6: Adding reflection.

Reflections are always nice. Copy you layers and flatten them. Flip the layer and move and scale it into place using the transform tool (Ctrl + T). Add a layer mask. With the layer mask selected, select all (Ctrl + A) and delete. Switch to the brush tool (B). Paint the reflection back in using a brush with low opacity. When satisfied, merge it with the layer beneath (so there are no holes) and use auto contrast (Shift + Ctrl + Alt + L). The contrast should be a little higher now.




Step 7: Texture.

Instead of painting the texture which is very time consuming, I go to www.cgtextures.com and grab a brick texture and a stained glass texture.

Copy the brick texture into Photoshop and change the blending mode to Overlay. Press Ctrl + T. Right click at the transform box and choose "Distort". Distort the texture into perspective. Use layer masks to make the texture fit. To texture the rest, copy the texture and repeat until you're done.

Import the stained glass texture into Photoshop. Fit it into the image by resizing, lowering saturation (Ctrl + U), and using levels (Ctrl + L)

Finally add some color by importing the brick texture and set the blending mode to "Color".



Step 8: Photo Filter.

Click on the black and white button at the bottom of the layers window. Choose photo filter. Use "Warming Filter (85)". Density 100%. Preserve Luminosity should be checked. Set blending mode to "Color" and Layer opacity to 75%.

Create another adjustment layer, this time "Brightness/Contrast. Contrast +50.



Step 9: Adding detail.


Add more color by using color layers and overlay layers. Add figures for scale and a monster to make it a bit more exciting.

I also chose to dim down the lines a bit. To do this, Ctrl-click on the line layer to select its content. Hide the selection (Ctrl + H) to see better. Use the Spot Healing Brush Tool (J) to blend the lines into the surroundings.


Step 10: Minor Touchups.



And that's it. I hope you have learned something from this tutorial. Have a nice day :)

Saturday, December 6, 2008

Process

Process:

  1. find some nice images, take them into Photoshop, lay them on top of each other. Change opacity and eventually the layer's blending mode. Flatten and use auto contrast. (scott robertson, andrew jones, craig mullins & more)
  2. find shapes sampling colors from the image. Sketch it out. Rotated image for a more dynamic composition.
  3. Continue.
  4. Added foreground element and the sheep.
  5. Changed sky. Gradient maps, overlay layers, soft light layers, photo filter, color/value adjstments.
  6. Final touchup. unsharp mask, grain.

Saturday, October 11, 2008

Color

Inspired by Xia's color posts, I'll post this:

http://www.graggspaint.com/images/colour_wheel.jpg

It's a nice palette to use.

Friday, October 10, 2008

How to draw cloth

Does the cloth you draw look wierd? Try this tutorial I found on the net (I've actually known about it a long time) :


http://conceptart.org/forums/showthread.php?t=14739


I hope it helps.



-pokepetter

Wednesday, September 24, 2008

When your work goes from screen to tangible.


Ok, I previously posted some info on vectors, which are nice.
But whats even nicer, is when you can get your work from
the screen and make it more tangible. Now I'm lucky enough to
have the opportunity to be able to.

While most of you are probably thinking of printing, which is
nice also of course, I think most of you will like this also:



This one is from Afro FM.
The "print" (can't find a better word for it, but actually its being heat pressed on)
is made of a very thin layer of rubber called "Superflex".

It starts off with a whole roll of this, which is loaded into
a plotter, which cuts the pattern following a loaded vector image
(thats where the vectors come in).

After that, you have to manually remove the excessive Superflex from
around the image you eventually want.

Once that is done, it's press-ready.

Pressing is done at a heat of 170C for 17 seconds with quite some pressure,
hard to give an exact example, but you don't want to get stuck in between.

So after the 17 seconds you let it cool down a bit and than remove the backing.

The image above is one of the examples of what the end result can be.

Although the menu is still under construction, here are some more examples
of clothing I made.

On Pixels and Vectors.


I know this community is mainly Photoshop based, but I think a bit of side
tracking once a while won't do to much harm.

A while ago some of you requested 3D tutorials so I assume those of you
are familiar with Vector's. But I assume that there are also a lot of you
out there that have no clue what vectors are.

First thought, Pixels.
Pixels are the little squares that build up your screen. Pixels have a fixed
size. If you enlarge a small image, your computer can only make the squares larger.



While Pixels are nice when you don't scale them to much (specially important when printing).

But thats what Vectors are good for. Vectors are actually not much more than two
points, between which the computer calculates the line. The advantage is that you
can scale an image as big as you like, while keeping the sharpness of the image.

3D programs also use vectors to build up models the same way.
Personally I like to use vectors better, but most often you get very straight
illustrations with it.

Although you can make very nice work with it its very hard to get to that level.
My favorite site for such.

So well this is just some very very basic on Vectors and Pixels I just felt like
posting, but I would recommend to do more research for your self if your interested.

Specially if you want to work with Illustrator or Flash, its not bad to know the basic
behind it. Its also handy when you work as a Signmaker (from personal experience).

Monday, September 15, 2008

How to Make Thumbnails Tutorial. Tropical Enviroment. Step for Step.

I start out with a A4 page in photosop. Here I can draw thumbnails. This is a process to test out different ideas, composition, lighting. Everything really.

1) I sketch out a rough idea with a small brush. I draw basic outlines. Then I fill in the basic values. This is the first step and is definitly the most important one. Think about composition. The blue lines show the rule ot thirds. This is higher than wider which is less common than a wide one.Notice the red lines. All objects points at the point of interest. The point of interest is located in the middle-ground. Dont't include any details.




2) I remove the lines and refine the shapes. You can clean up the lineart and keep if you want to too.





I haven't got any further with it, so that's all for now.

Monday, September 1, 2008

Photoshop Tools


Ok so here is something for you to mess around with.

What you see here is an interactive demo for the basic tools of
Photoshop, since there was ask for it. Enjoy.



I uploaded the full version now. This one features full tool
menus and an about page. Maybe later, I will add key-shortcuts
and some other features to make it mimic Photoshop better and
make the use of tools more clear.

Sunday, August 31, 2008

CS3 Icon Tutorial



So here is a new tutorial on how to make your own custom icons.
In the example we will make an CS3 style icon. Personally I favor
Adobe Fireworks for these kind of things, but since this is a Photoshop
based community, Photoshop it is.

Note that at the end of this tutorial we need to use a small program (so
small you can run it without installing) from Greenfish, a Hungarian company
that makes free-ware software. I found the Icon Editor to be quite nice as
a converter, since the actual editing blows.

You can download the editor free from the Greenfish Download Page.

So here we go:
First start Photoshop and open a new document.


In this case, the icon will be used for thumbnail view in windows (48x48).
Next set the background to "transparent". This can specially be important
when making icons used for desktops.

Other sizes:
24x24 Toolbar
32x32 Desktop


Next select the Marque tool (M) and draw a square taking up about 80% of the
canvas. This will be the size of the "body" of the icon.

With a square setup, we can colour it. Press G to select the gradient tool.
Depending on what you used last it can look different:
In our case we need the right one, since the left one is the
"Bucket Tool" used to fill only in one colour.

At your upper left, you will see a small preview of the gradient and some other
options.

The one highlighted right is to make a radiant, rather than a linear gradient.
The gradient has to glow from the upper left corner.

Next, click the thumbnail gradient, highlighted left. This will open the
gradient menu.


When clicking the lower pastels for colour, you can adjust the colour using the
preview. Clicking this will open the normal Photoshop colour palette.

Note that the highlight should be on the left side.

The upper pastels are for opacity, so we can leave those.


After applying the gradient, it should look something like this.


Next press T for the Text tool. Draw a text area large enough to fit a capital
and regular letter. By default the font is set to Myriad, which suits our purpose.
Depending on your gradient, pick a font colour. The CS3 icons all use white.


I used "Wa" in this case for the Wacom Drivers.

Again, select the Marque tool (M) and select the square again. With the body
selected again, go to the bottom of the layer panel.

The second icon on the left is the effects list, select "Drop Shadow".


In the Drop Shadow Menu, adjust the settings to your liking. Most often adjusting
the angle and opacity will be enough. Also make sure you have the preview on.


After applying the drop shadow, we are done with Photoshop. Time to save.
Go to: File -> Save as. or Crtl + Shift + S. Pick .PNG from the list since
.psd doesn't work with the icon editor program and any other format (.jpg or .bmp)
doesn't support transparency. .gif does on the other hand, but the quality is not
to well.

Now comes the part where we boot up Greenfish Icon Editor.

Select "Open File" and search for the .png you just saved.

The only thing we will do with this program is re-save it as .ico.

This I found is the only way to get decent icons. Making one in Photoshop and
than renaming them from .bmp gives very poor icons with no transparency.

After you saved your new icon, you can change folders or programs there icon.
Right click the shortcut or folder and select properties.

The far right tab (Dutch Windows here) should say "Adjust" or something like it.

Selecting that tab should show this:

The button highlighted here should read something like "Change Icon".
Press it and you will get a selection of windows standard icons for folders.
Program shortcuts might have a standard selection or program specific icons.

Click the "Browse" button at the upper right and locate your custom icon.
Select it and just "OK" you self out of the menu's.

And than your done, having your own custom icon.

Of course the possibilities are endless now. Specially in combination with a
custom wallpaper. Like when your at work and all the games are banned. You
can make a chess board as a wallpaper and make the pieces out of icons.
Not to mention office spread Battleship during the break.

Monday, March 24, 2008

Open Soure Software

I just did a quick search for open source software, and found this.

An article that contains a selection of replacements for the Adobe Creative Suit.
Guess one has to be creative when low on money. ;)

It also contains Open Office, a free variant on MS Office. One of the programs I use.

Free software is a matter of liberty, not price. Think of "free" as in "free speech,"
not as in "free beer." Free software is a matter of the users' freedom to run, copy,
distribute, study, change and improve the software. (from Free Software Directory)

Some more links:
Free Software Directory
Source Forge
Gara Systems

Have to advice this one also though Classic Media Player. Like the old windows media
player, but no need to install and it plays about everything.

Also recommended Greenfish. Personally I found the Icon Editor quite handy.

And of course one of the best known: Firefox
Although I do have to admit I use Netscape. ;)

Let the open source revolution begin!

Thursday, March 20, 2008

Heat Blur Tutorial

If I recall correct, some time ago someone asked how to make a heat blur for mech exhausts ext.

This tutorial is an after effect, so far I found that it only works on finished .jpg's ext.

A summery:
Gaussian Blur's,
Saving your selection and
the Ocean ripple Filter.

In this tutorial, we are going to add a exhaust heat to this MiG31:


First we need to select the area where the heat
would distort using the circle selection tool (M)


After having the right area selected, we can add the Gaussian blur:
Filter -> Blur -> Gaussian Blur...


The Gaussian Blur window:


Tweak around with the Radius, just don't put it to high.

Next we need to save our selection, since we well need to use it again later:
Select -> Save Selection...


The Save Selection window:


We don't need to add a name since its the only selection save we will use this time.

Now we select a smaller part, within the previous selection that we just saved:


This is to give it a bit more effect. Repeat the Gaussian blur (Ctrl + F)

Reload the selection we just saved: Select -> Load Selection...
The load selection window:


We can just click OK.

Now that we have our original selection again, we can add the Ocean Ripple:
Filter -> Distort -> Ocean Ripple...


The Effect Filer Window:


Here we can add all kind of filters, each with there own effect.
But for now we keep it to the Ocean Ripple. Adjust the "Size" and "Magnitude"
to your liking. It's again advised to keep the values low for a more realistic effect.

So there you go, now the MiG31 has a exhaust heat blur:


This effect can of course also be used for fire's ext.

Digital Matte Painting and Techniques Tutorials

A friend of mine found this the other day on the intranet (internal network)
and passed it onto me as he thought I might like it also, which I do:

Digital Matte Painting and Techniques Tutorials

I haven't finished it jet, but from what I have read I'm sure you all
will find it also useful. It's in PDF format, which I assume most of you
can open or else you can download a free reader here.


Colour Harmony

During my break I took the time to look a bit into colour harmony.
First I came upon this site, which gives the general idea of the whole:
Color Harmony

After that I found this site that I think is very useful for all of us:
Color Harmony Tool (Flash required, free for download here)

Enjoy.

Tuesday, March 11, 2008

Brushed Aluminum

How to make brushed aluminum in Photoshop.


We start off with making a rectangle, by default hotkey U.


Next we select it with the path selection tool (A).


To get the brushed effect, we first need to add some Noise.
Filter -> Noise -> Add Noise...


Next we will get this warning message, it only asks if we want
to convert the rectangle from vectors to a bitmap. It's not that
we have much choice here.


First turn on the Monochromatic option, to make sure we lose the
colour. Than adjust the amount until you get a good mix of gray tones.


Next we want to add a motion blur.
Filter -> Blur -> Motion Blur...


Adjust the Distance to your own liking. Optional you can add an angle to it,
as a different direction of brushing.

Note that the edge of the rectangle gets blurred also, making it slightly
smaller.


This can easily be removed with the Marquee Tool (M) [select and press Delete]
or with the Eraser (E).

You can also select a part and apply the filters:

(the highlighted part is to make the selection stand out better)


I Draw Girls, and more

↑ Grab this Headline Animator

TO JOIN Idraw Community Sketches and Doodles: Click here or contact Knuckle930.
Peace!

* We have reached the member cap of blogspot and haven't found any solution jet. If you know any, let us know. *

Exclusive Sketches from SketchWich!!!