First, I’d like to thank Joubert Quentin a.k.a hybrid-creation for allowing me to create this tutorial based on his image, Your Skull is Red. You can see his portofolio in DeviantArt or his personal site. Before we start, take at look at the image we are about to create below.

In this tutorial we will learn how to create selection, adjusting color, and adding depth to image.

Source Needed

For this tutorial, we will need these images:

• Water Tower from fairiegoodmother.
• Premade Background from night-fate.
• Brocade Victorian Gustov 3 from falln-stock.
• Top Hat from luna-8.
• Old Top Hat collection from azenor-stock.

Step 1: Selecting The Victorian Man

We’ll start by cutting this man from his background. For this type of selection, I prefer to use the manual way, path. From paths panel create new path then using pen tool draw path around the man. As you can see i don’t care much about his face because we will remove it later.

Step 2

Once we’re done creating path, hit ctrl+Enter to change it to a selection. Press ctrl+J to duplicate the selection to a new layer. You can also do this by selecting menu Layer > New > Layer via Copy. To help focus on the man, hide Background by clicking its eye icon.

Step 3: Removing Face

To remove his face we can just use an eraser.

Step 4: Fixing Floating Hat

Now, we need to create his bottom hat. To do this we must draw manually using clone tool. Activate clone tool and check Sample All Layers. This option allow us to clone on a separate layer and keep the original picture safe. Then create a new layer. With clone tool sample a similar color from his hat by alt+click it.

Step 5

With clone tool, draw his bottom hat. This might take a while, I spend 10-15 minutes for this. To keep it natural I suggest you to use different clone source every time you click.

Step 6

Using lasso tool, create ellipse selection underneath his hat and fill it with black.

Step 7

Add Gaussian Blur (Filter > Blur > Gaussian Blur) to give it a soft realistic shadow.

Step 8: Fixing Collar

We need to manually draw his back collar. The step is a bit similar to what we do when creating bottom part of his hat. Create a selection in collar shape, sample color from his front collar, then draw it directly with brush tool. To avoid flat color we must use many color source from his front collar.

Step 9

Draw shadow inside his collar and add another Gaussian Blur.

Step 10: Import Man Without Face To New Background.

Now we’re done with this man. Select all (ctrl+A), click Edit > Copy Merged (ctrl+shift+C). In our new background paste the man (ctrl+V) and resize it (ctrl+T). See image below for reference.

Step 11: Dodge and Burn

We still need to fix lighting on the man. To do this, we will use non-destructive burning and dodging. First, alt+click New Layer icon. In the dialog box select Use Previous, Mode: Overlay, and Fill with Overlay.

Step 12

See picture below! The light source is behind the man so his back must be lighter than his front. To fix this, paint with burn tool to make it darker and dodge tool to make it lighter.

Here’s what we see if the layer is in Normal blend mode.

Step 13: Add Shadow

Off course this man must have shadow. We know that the light source is behind him, so the shadow must be in front of him. Duplicate the man layer and hit ctrl+T. Hold ctrl and move its corner until it lies on the ground.

Step 14

We don’t want to see his twin lying on the ground right? We want his shadow.

So, here’s the trick. Hit D, this will change foreground color to black. Then hit shift+alt+delete, this will fill layer with foreground color (in our case, black).

Step 15

We still need to focus on the detail. As you can see below, cane’s shadow moves a little and there’s a hole between his feet. I fix this by doing minor transformation and painting with black.

Step 16

Add Gaussian blur to create a soft realistic shadow.

Step 17

Farthest shadow need to be more blurry. So, select those part, soften the selection with Feather (Select > Modify > Feather), and another Gaussian Blur. Here’s a tip: because we’ve just perform a Gaussian Blur we can just hit ctrl+F to repeat it again. If you want to use different radius use ctrl+alt+F.

Step 18

Add layer mask and add black to white linear gradient to make the shadow fades away.

Step 19: Add Water Tower

Selecting the water tower with path is not a good idea. You’ll get frustrated doing it. The easiest and smartest way is using color information in channel. Our image is in RGB, that’s Red, Green, and Blue. The water tower stands in front of a clear blue sky. So, the sky will be very visible in Blue channel. Now, I want you to duplicate Blue Channel by dragging it to the new channel icon.

Step 20

Add Levels (ctrl+L) with this setting.

You can see that the sky has magically disappear. Try that with pen tool!

Step 21

Some part of the water tower is turning white. We can fix it easily by painting it with black.

Step 22

Here’s the basic principle of masking: “White reveals, Black conceals.” We want to select the water tower, not the sky. So, the sky has to be black and the water tower has to be white. Wait! Our image is completely wrong. That’s easy, just hit ctrl+I to invert it.

Step 23

Ctrl+click blue copy channel to convert it to a selection. Copy the image and paste it behind our faceless man.

Step 24

You might notice that the there’s a small part of the sky in the water tower. Here’s one easy way to fix it. Ctrl+click water tank layer. Contract selection by 1 px (Select > Modify > Contract). Click add layer mask icon.

Here’s the result.

Step 25

Fix the lighting with non-destructive dodging and burning. We have done this in step 11.

Step 26: Adding Depth of Field

It’s time add depth to this image. Cut one of the hat collection from old top hat set. Paste it and place it near the edge of the canvas. Hit ctrl+T and rotate it to give a more dynamic movement.

Step 27

Give it a Gaussian Blur. Because this hat is near us, we’ll give it a big radius.

Step 28

Add another hat and give each different radius depends on its position.

Step 29: Add shadow

Dont forget to give shadow to the water tower. The step here is similar to what we did when creating the man’s shadow. Duplicate water tower layer, fill it with black, transformation, add Gaussian blur, and fading it with gradient mask layer.

Step 30

Again, don’t forget to add shadow for those hats.

Step 31: Final Adjustment

I want to add more blue to the sky. For this, I add adjustment layer Channel Mixer on top of all layers with these settings.

Step 32

Paint everything with black except the bright sky in top right. Now, only that part is affected by the Channel Mixer.

Step 33

To add more contrast add adjustment layer Levels with this setting.

Step 34

Paint everything with black except the faceless man.

Step 35

Finally, I want to make this picture warmer. Add an adjustment Layer Photo Filter with Warming Filter (85), Density 25%.

Conclusions

And here’s what we have now. I hope you like the final effect. If you have better tips about the technique used here I’d love to hear it.

Download FREE PSD File!!!

To help you learn this tutorial you can download the psd file here.

Tumblr is set to become the blogging tool of 2010 with its massive growth, yet still many people don’t fully understand what Tumblr does, or how it works. If you’ve ever tried to start a blog, but found yourself struggling to find the time, Tumblr is something you’re definitely going to want to take a look at.

What is tumblr?

Put simply, Tumblr is a service that does exactly what Wordpress does for blogging, but for microblogging, or tumbleblog’s instead. To fully understand what Tumblr does, you first need to understand what these so-called tumbleblog’s actually are.

A tumblelog is a variation of a blog, that favors short-form, mixed-media posts over the longer editorial posts frequently associated with blogging. Common post formats found on tumbleblogs include links, photos, quotes, dialogues, and video. Unlike blogs, this format is frequently used to share the author's creations, discoveries, or experiences without providing a commentary. – Wikipedia

What does this mean? Well basically, Tumblr fills the gap between Twitter, where people tweet resources, images, and thoughts, and traditional blogging platforms, like Wordpress where each post is a proper article. Instead, Tumblr works with seven types of post; text, photo, quote, link, chat, audio and video, and it handles them all very well.

Why is Tumblr becoming increasingly popular?

According to Tumblr statistic’s, in the last six months, Tumblr has grown from around 300M monthly page views, to over 1 Billion in February 2010; a massive growth for any product, and it speaks for itself really. A product doesn’t grow at such a rapid rate, if people aren’t enjoying using it.

Easy to update

The biggest reason behind Tumblr’s growing support, is it’s vast number of social features, and it’s ease of use. For a start, Tumblr make it extremely offer for you to post to your blog, even if you can’t access your homepage yourself. Here are some of the clever ways Tumblr makes it possible for you to update your tumbleblog:

• Text your blog updates from any mobile phone
• Email your updates via one of the most sophisticated email publishing platform available.
• A Bookmarklet allows you to post anything and everything you come across while browsing the web.
• Post via AIM by messaging TumblrBot.
• Phone your TumblrBlog, and leave voice posts.
• Automatically post from any other site or profile.
• Use the official Tumblr iPhone app to easily update your blog.
• Third Party App’s expand your options even further.

3rd Party Applications

As well as the fantastic free iPhone app that is available officially from Tumblr, you also have access to a multitude of applications for the iPhone, Web, Desktop’s, Mobile’s, Widget’s and Browser’s. They are all filed away tidily in an official Tumblr app directory.

Social Network Integration

Definitely high up on the list of reasons for Tumblr’s acceptance has been its solid two-way integration with other social media, and networking services. Part of its automatic posting from other sites come from major names such as Digg, Youtube, Facebook and Twitter, but it doesn’t stop there. As well as having the ability to automatically pull in your content live from these sites, you can also send information back. Facebook is a prime example with its ability to show your activity on Tumblr on your Facebook wall, keeping all your friends up to date with what your blogging and activity.

Other notable features

Other than those already mentioned, Tumblr also focus’ on those important, but small things that you need.

• Easily add any analytics tracking code you want to your tumbleblog
• Tubmlr is optimised for Google in everything from the site slugs, to the sitemap
• Built in privacy allows you to restrict specific posts, or your whole blog to certain people
• The ability to use your own custom domains on your tumbleblog
• FeedBurner support allows you to see important RSS feed stats
• It’s free, and you don’t need to pay for hosting, or storage!
• You have the ability to create your own custom theme.

What is the backend of Tumblr like?

First off, Tumblr wouldn’t be where it was if it wasn’t for its easy to use backend user interface. The interface is split into two sections; the dashboard, where your’s and other peoples content meet you, and customisation, where you control all sorts of aspects of your tumbleblog.

Dashboard

Posting any of the seven different type’s of content from your dashboard is a breeze, with visual buttons, and a clean design. The backend goes on to keep you up-to-date with all the Tumbleblogs you are following, in a very Twitter like manner, keeping it clean and easy to read. For a look at how the dashboard looks, click on the image below.

Customisation

Customisation though, is a whole different kettle of fish. It is basically a dummy page of your current theme, with one default entry in each of the seven post categories. A menu bar at the top of the page allows you to make many important, and useful changes and decisions that affect your tumbleblog.

The menu provides a multitude of options;

• Info - This allows you to specify the basic information of your blog; things like your blog title, description, and avatar picture. The notable option here though, is the ability to change your tumbleblog url instantly, or even use your own personal domain allowing you to use a domain without the tumblr.com suffix.
• Theme – This menu item is fairly self-explanatory; it allows you to select a theme from Tumblr’s “theme garden” to use for your blog. There are over 300 of them, all for free, some of which are of an impressive quality. As well as using a premade theme though, you are given the option to use “custom html”, another way of saying your own custom-made theme, something we will go through in great detail at a later date.
• Appearance – This allows you to make quick changes to your current theme. Not every theme has appearance options, but the default Tumblr theme certainly does, and allows you to change things such as font’s, colour’s, and background images without touching any code; anther thing that makes Tumblr so popular for those that are not so comfortable delving into code.
• Pages – This allows you to create static pages, much like other blogging platforms such as wordpress. Pages come in three categories; Standard Layout, Custom Layout, and Redirect.
• Services – Already I have mentioned the great amount of social networking integration that Tumblr has, as well as its integration with other web services such as YouTube and Feedburner. Services allows you to pick and choose which of these services you want to use, and lets you connect all your accounts up.
• Community – This allows you to add, as the title dictates, a community element to your blog. There are to ways to do this. One is the creation of a page that allows your readers to ask you questions, and the other allows your users to contribute their own posts to your submission queue for approval by you.
• Advanced – The final menu item features further options for your blog that don’t really fit into the other categories. These are things like your timezone, url slug structure, privacy options, post’s per page, and so on.

As you change these options, especially your theme options, the dummy page below changes to mirror the choices you have made, allowing you to check how your blog will look, as you work.

Conclusion

Tumblr is a fantastic piece of kit, filling in that gap in the market between products such as wordpress that provide full blogs, social networking such as facebook, and status updating from Twitter, and it does it extremely well.  Tumblr is honestly a pleasure to work with. Simplicity makes the user interface effect and easy to use, and you never feel like there isn’t anything important missing, or out of your control. It makes blogging and sharing things you find on the internet a breeze, and most importantly, unlike Twitter, it does so visually. If you find yourself failing to keep a full blog up-to-date, and enjoy sharing the things you find, the there’s no easier way to do so than Tumblr, so give it a go.

Keep an eye here at 1stwebdesigner for more on Tumblr!

For those that do choose to start using Tumblr, or already do, then keep an eye here, because coming up are several articles that will increase your happiness with Tumblr, such as a roundup of fantastic themes, and more importantly learning how to create your own custom theme! For now, check out these 5 impressive tumbleblogs for inspiration to see what Tumblr is truly capable of.

Metalab

It’s the interwebs

Mark Jardine

Tmblg

Name that film

Hope you enjoyed this post – keep coming back for more!