Jan
28
2011

Make a Prince Of Persia Style Babylonian Architecture in Photoshop

Hi everyone its good to be back after a long time. This tute i bring to you is unique in many ways. First up its a landscape manipulation. Landscape manipulation is the stream of digital manipulation in which you concentrate on creating the background rather concentrating on any subject in particular.

This tutorial covers the creation of Prince of Persia style city of Babylon! Landscape manipulations can be tricky especially if you have your mind set on some old architecture. The single biggest problem that you might face lies in finding the right kind of architecture stocks.

Final Preview:

Make a Prince Of Persia Style Babylonian Architecture in Photoshop

Ok enough background lets get started first up grab the following stocks :

1. Window by DarkBeCky-StOcK
2. Tower by jm-stock
3. Fort by Amor-Fati-Stock
4. City by Amor-Fati-Stock
5. Sky

Note : The stocks used here are the copyrights of the respective owners.

Step 1

Open the window image and very carefully extract the window out of the image. To accomplish this easily; switch to Blue Channel(Ctrl+5) [This channel has the maximum amount of contrast] and use quick selection tool and brush size 90px to make a selection around the window. Once done switch to RGB mode (Ctrl+2).

Make a Prince Of Persia Style Babylonian Architecture in Photoshop

Next Invert the selection(ctrl+shift+i). Goto Select>Modify>Feather(7px) and Hit delete. This will leave you with a nice window overlooking nothin! In case you are left with some extra bits here and there, simply use the eraser and a small soft brush and erase the extra chunks.

Make a Prince Of Persia Style Babylonian Architecture in Photoshop

Finally Call this layer Window.

Step 2

Ok next open the tower image. The image is amazing but for our work it has two problems. The first is that in the fourth level in the tower has too many trees in the front and the second being that the color of the tower is different from the rest of the city. We will deal with both issues separately. Start off by switching into an appropriate channel(I selected Blue) and use quick selection tool to select the tower.

Make a Prince Of Persia Style Babylonian Architecture in Photoshop

Once done, invert the selection(ctrl+shift+i) and hit delete.

Make a Prince Of Persia Style Babylonian Architecture in Photoshop

Step 3

Next we will tackle the trees, this is a bit tricky we will use the clone stamp tool here. Select clone stamp tool,use Alt+click to mark the cloning point.Mark the cloning point near the left top edge of the window on the third level as shown in the figure.

Make a Prince Of Persia Style Babylonian Architecture in Photoshop

Next leave alt to switch to the cloning brush, point it to the left top edge of the window on the fourth level and start cloning slowly. Make sure that you don’t warp the lines formed by the bricks as it will make the tower look unrealistic.Once done goto Edit>Transform>Flip Horizontal. We flip it to get in alignment the light falling on tower with the rest of the scene.With a little patience and careful painting you will achieve something like this.

Make a Prince Of Persia Style Babylonian Architecture in Photoshop

Leave the tower like this as of now once we are through with our city blending steps we will work on the color aspects of the tower.

Step 4

Next bring in the fort picture. In this picture we will only remove the sky. The plants will be hidden by the city image. To select the sky in one go; choose magic wand and set tolerance as 50 and click anywhere on the sky. Finally delete it and our fort image is ready to use!

Make a Prince Of Persia Style Babylonian Architecture in Photoshop

Using the above steps delete the sky from the city image too!

Make a Prince Of Persia Style Babylonian Architecture in Photoshop

Step 5

Now comes the difficult part of sewing all images into one. To do this efficiently we will start off with the city image. Arrange the city image towards the bottom of the window as shown.

Make a Prince Of Persia Style Babylonian Architecture in Photoshop

Duplicate this layer and arrange it towards the upper right corner of the window. This completes our basic city layout.

Make a Prince Of Persia Style Babylonian Architecture in Photoshop

Step 6

Resize and introduce the fort image and arrnage it towards the right of the city image.

Make a Prince Of Persia Style Babylonian Architecture in Photoshop

It looks good but there is a bit of space left towards the left.To fill the space we need to get two extra Keeps. To accomplish this simply duplicate the fort image and put this towards the left of the base fort image and use the mask tool to hide the extra bits and pieces.Repeat this step one more time to fill the remaining space with one more Keep.

Tip : If you find a little gaps here and there, or you need to hide the trees. Simply use the clone stamp tool to give the keep wall a smooth finish.

Make a Prince Of Persia Style Babylonian Architecture in Photoshop

Step 7

And now we come to the tower, this is the easiest step of them all just resize and arrange the tower behind the keep.

Make a Prince Of Persia Style Babylonian Architecture in Photoshop

Thats it! this completes our layout process.

Step 8

In this step will fix the color of the tower to match with the rest of the city. Select the tower layer and goto image>adjustments>match color [In the source select the name of your current PSD file and in layer choose the layer that contains the city image] and use following settings:

Make a Prince Of Persia Style Babylonian Architecture in Photoshop

Next goto Image>adjustments>Brightness/Contrast and punch in Brightness -> +30 and Contrast -> -15.

Make a Prince Of Persia Style Babylonian Architecture in Photoshop

This will finally make your tower blend in with the rest of the city.

Step 9

Now we need to give this image an interesting sky. Simply open the sky image, stretch it by around 25% and arrange it as shown.

Make a Prince Of Persia Style Babylonian Architecture in Photoshop

To fill up the left over space on the top duplicate the sky layer flip it horizontally.

Make a Prince Of Persia Style Babylonian Architecture in Photoshop

Use a soft medium eraser to blend the two skies together.

Make a Prince Of Persia Style Babylonian Architecture in Photoshop

Step 10

Before we move onto the light adjustments we need to group all the layer that belong to the city area(All Layers except window and sky layers) and merge them to form a single united image. Next merge the two sky layers together. So we will have a total of 3 working layers now Window, City and Sky! If you want you can leave your manipulation here only as all the basic blending of the architecture is done.

Step 11

Now we will introduce some light adjustments to give it an overall dramatic feel. Goto layer>new adjustment layer>Hue/Saturation and put following setting in the red channel.

Make a Prince Of Persia Style Babylonian Architecture in Photoshop

We need to have a curve layer adjustment too with above shown. The whole city seems to glow with a yellowish tint as of now.

Make a Prince Of Persia Style Babylonian Architecture in Photoshop

Step 12

Now above the Sky layer we will introduce a radial gradient from #3e3e3e to #b6ad0c where the darker portion should be behind the tower. This will make the sky glow yellow. Switch the mode of this layer to color and reduce the opacity to 75%.

Make a Prince Of Persia Style Babylonian Architecture in Photoshop

Step 13

We are almost done, but the city still seems to glow a bit more then the amount of light falling from the sky, therefore select the burn tool with a large radius and burn the whole city layer to make it dark. Next select a smaller radius burn tool and burn the glowing areas a little more till you feel the image is right.

Make a Prince Of Persia Style Babylonian Architecture in Photoshop

Thats it we are done!

Related Posts

About the Author: Akshat Chaudhari

5 Comments + Add Comment

  • Hi! You have lot`s of great tutorials!
    Congratulations!
    I`we just started a tutorial indexing website and I would like to ask you to submit some tutorials :D
    You can submit tutorials without registering, but if you register you will get gift points for each tutorial and you can use these points to buy ads.

    Please visit it: http://www.tutorialswindow.com
    Thanks

  • Wow. Thanks for using my tower image to create such a gorgeous piece! I’m so happy you found a use for it. The tutorial is great BTW.

    • Thank you!!! :)

  • wow… superb tutorial to derive the perfect PoP look !

Leave a comment