Advanced Search
Keywords

Create a Fantasy Village Suitable for the Smurfs

This entry was posted By Cubert on Thursday, February 25th, 2010 at 11:20 pm and is filed under Tutorials. 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.

WARNING: This tutorial will increase the chances of a Gargamel attack on your website. Today we learn to create a mushroom-hut fantasy village suitable for habitation by the Smurfs, as seen the Fantasy Village Template.

You can download the Fantasy Village Template with full PSD source files and sliced table free HTML pages for this template in BoxedArt’s members section, as well as thousands of other website templates and web design products. Get a membership here.

Step 1: Let There Be Sky

First, create a new document with the size of 1200 x 950 pixels. Next, we fill it with a sky color -a soft blue gradient. Set the foreground color to# 60c2d6 and the background color to #d7f0f5. Here are the results:

Step 2: Let There Be Land

Now, let’s create the ground. Start with creating a simple curve with a pen tool and fill it with color #99c83e. Here are the results of this template design:

Next, let’s give a little depth to the ground by giving it some gradient. Right click on the ground layer and use the below settings for the gradient:

The results should be like so:

Step 3: Let There Be Shrooms

Ok, the basic scene is set with the sky and earth, now it’s time to start filling in the landscape, so let’s create a fun mushroom village. This part will take some drawing technique to draw the shape, and you can take any mushroom as a reference. Use the pen tool as shown below and draw a few wavy lines similar to the shape of a mushroom. To draw the lines, just click and drag a line across the image using the pen tool that you selected. This is how our mushroom looks:

To complete the mushroom shape, let’s create a black stroke around it with the settings below:

Step 4: Let The Shrooms Be Decorated and Ornate

Next, let’s create some circles on top of the mushroom for a spotted look, after all, the Smurfs had spots on top of their mushrooms in Smurf Village. Use the eclipse tool (U) and draw a few oval shapes above the mushroom, fill it with any color you prefer, and then paste it with the stroke we create above. Right click on the eclipse layers and choose create clipping mask so that it all appears inside the top mushroom section.

Here is how the mushroom should look now. You can place the white spots anywhere you like:

Next, the mushroom hut needs an entrance, so let’s create a door. You pick brown you prefer, or you can use the color we used: #cd8652. Use the rectangle shape create the door, and place in above the mushroom stand layer, and create a mask to it just like the above step. Here’s how it’s going to look:

Step 5: Let There Be a Village

We are done with one mushroom house, you can duplicate them and place them all around the ground and lay them out the way you like. Here’s how ours were placed:

Step 6: Let There Be a Road and Trees

Then let’s add a road path and some trees to it. Using the pen tool, just draw the path freely in the middle of the ground just like the below, and then apply the gradient effect you have on the ground layer onto it.

Now let’s add some trees, and some walk paths to it using the pen tool to draw a tree, and duplicate it and place it all over.

Step 7: Let There Be a Template

Now let’s use the rectangle tool (U) to draw a white shape for the content area, and place it below the ground layer so it is behind all the elements:

To add some final touches to it, you can select the custom shape tool (U), go to the nature section and pick some clouds, and other elements to the design:

Here’s is the final look of it. You can place your content in the content area.

Here is how we finished off our design:

Thanks for reading!

You can download the Fantasy Village Template with full PSD source files and sliced table free HTML pages for this template in BoxedArt’s members section, as well as thousands of other website templates and web design products. Get a membership here.

Tags: , , , ,

('DiggThis') StumbleDelicious

Comments

User angelica trompieri says: March 10, 2010 at 5:48 pm

I loved this tutorial. You should have a smurfs tutorial too, to complete the scene.
Thanks.
Angelica

Simple but Amazing…
Thanks.

Leave a Reply


  • Built2Go
  • ThemeStock
  • Stockedphotos
  • Bravenet
  • Bluehost