31 December 2008

iPhone Wallpaper - Tutorials


You were wondering how to make that wallpaper? Well it's here now, a little big but not hard to follow Tutorial, you will learn everything from the liquid to the blending of the iPhone Apps. In the end you will have a piece like mine. Remember experiment, be creative too.

What you'll need:

  • iPhone PSD (Credit to Kol's) Get it here
  • Icons of iphone applications (browse google)

Credits of this Tutorial:

  • Artist: Duarte Pires
  • Website: http://www.DuartePires.com
Creating the Background

Create a new Document name it Liquid, make sure you use 2560x1600 or not everything will work like in mine.

Create a new layer and name it BG, get the gradient tool (G) and go to the gradient tool options, there put this values and save this as "Basic Gradient". After that go to your document again and do a Radial Gradient with your current options to make the background, I made from the left to the right.

The Liquid

It's very simple to make this effect, just pick up your Pen-Tool (P) do a selection like I did or something similiar, just make sure you have a nice perspective. Fill it with "f445ac" (don't mind the blue color in the image below).

Go to the Blending Options and use these settings:(click them) Drop Shadow, Inner Shadow, Bevel and Emboss, for the contour use 89% default. Make more cut's in the middle of the liquid.. add some little bubbles outside to make it more real, pay attention to the next pictures to see how I did.

Get your iPhone PSD here. Now simply place the "front" in your document, remove the Drop Shadow layer, the Reflection layer and duplicate the Shadow layer. Also right click the "front" Folder and select Merge Group to make this only one Layer.

This is what we have so far, see the cut's I did in the middle of the liquid? And the little bubbles I was talking about? It's easy select your liquid layer and make small selections inside the liquid, hit delete and that's it.

A little Illustrator

Go to Illustrator and create a new document 800x600 is good and make some strokes like I did below, make sure the fill color is set to NONE and the stroke color is "425e71".

Go to Object -> Blend -> Blend Options and make the following settings.

Go to Object -> Blend -> Make and that's done, ctrl+c or command+c and paste this to your iphone document, name this layer "Flow".

In the "flow" layer give it a Layer mask(don't mind the Quick Mask name in the image), choose a soft brush and put the opacity of the brush to 30%, now simply brush away the ends and soften the color of the strokes, like the image below.

Create a new layer and do a selection now using the Lasso Tool (L) make sure you use a Feather of "50px" do a selection around the iPhone and go to Filter -> Render Clouds (black and white as your colors). Create a layer mask here and eliminate some of the clouds with a soft brush, especialy below the iPhone. Set this Layer to Color Dodge.

Create another new layer and another selection still with the lasso tool and 50px feather, this time select around your Strokes (the ones you brought from illustrator), and go to Filter -> Render Clouds.

Go to Blending Options and use this settings: Gradient Overlay.

I also used this gradient, you don't need to be exact like this.. try to find similiar colors. And lower the opacity of this layer to about 70%.

Gradients and more Gradients

Ok now see our Strokes there? follow that path and make a selection like I did.

Now Fill it with a Gradient of White to Transparent follow my image below.

You got a white gradient right? Make a Layer Mask, choose a soft brush and lower the opacity of the brush to around 35%, brush around play until you got something like me.

Great now do the same for some of the paths there, like I did here. Remember you are completly free, Experiment, create something different!

Dont' Forget the Other Side!

The Falling Liquid

Ok maybe the hardest part is now, I use a Wacom tablet it's much easier to give some soft shadows and highlights but you can do this with the mouse too. One of my procedures and ways to work is to draft everything before, and everyone should do it, this way I know exactly hows it going to be...

Now that I got my draft done I know where to start doing my paths, get your Pen Tool (P) and make a selection like I did.

Easy right? Now just follow the draft and make a similiar form, like mine, try to make it look like it's falling, and splashing, give it some splashs.

Get your Burn Tool (O) and set the exposure to 6%, this tool is used to darken the liquid in certain areas to make it look like ..well like liquid. See Below where I've darken it.

Don't mind how rough this looks, it will look better. Get your Dodge Tool (O) and give it an exposure value of 20%, use a bigger soft brush for the major highlights and choose a 2px 100% hard brush for those little highlights. See image below.

Now go to Filter -> Artistic -> Plastic Wrap, give it the following values, or play with them at your liking.

Now select some of your splashs and go to Filter - Blur - Motion Blur, give it a little test and see what you like, this way it looks like they are really moving and gives more depth to the work.

The Little Door

One of the easiest steps in our tutorial. Get your Rectangular Marquee Tool(M) create a new layer and fill it with black, create another layer and use your Polygonal Tool (L) make a selection like the one below.

Remember the gradient I said you should save? Get it again and make a gradient like I did.

Create a New layer and name it Soft Shadows, get your Pencil Tool and make a 1px line using black, set this layer to Soft Shadows. Create a layer mask and soften the top and bottom of the line.

Do the same for the inside of the door but this time with white.

Create another new layer and name it "Light" get a big brush like 140px 0% hardness, and lower the opacity to around 10%-20% click 1 time in the center of the door, then choose a smaller brush 80px and do the same thing again.

Select your Door Layer (ctrl/command+click on layer), but keep your new "light" layer selected and hit backspace to delete.

Do a Selection like mine and hit backspace to delete again.

Now to make it perfect to a layer mask on the "light "layer and brush away those hard edges.

The iPhone Apps

Get your self some iphone apps, go to google and browse away. Create a New Folder and put them in individual layers each one.

Remember my process? Always draw first, and as you can see I drafed how my apps will fall.

Ok now simply pick up your Apps and start spreading them around, rotate them, resize.. experiment, As you see for some of my apps I did a Gaussian Blur, go to Filter -> Blur -> Gaussian Blur give them a big value, experiment.

Wet Apps

Select your mail app layer, or whatever you using here and put them below our "light layer", ok now create a new layer and name it "lightmailapp" get a small 0% hardness brush using about 5% opacity, choose white as your color and give it some small light there as you see the picture.

Now create a new layer and put it below our mail app layer, again using 5% opacity brush, get your black color and use a small brush with about 50% hardness.


Easy, simply select your app layer, create a layer mask and using a 50% hardness brush simply start erasing to look like the liquid is "eating" the app, and after that use a hard brush to make it look good.

Again the shadows, create a new layer and simply paint the shadows, 5% brush opacity using black with a soft brush and voila... paint away.

Do the same for all the other Apps that are touching the liquid. This is what we got so far.

The Twitter app is just perfect for this..
  1. Put it by the side of the liquid
  2. Using the Elipse marquee tool(M) make a selection like that.
  3. Using a gradient of Black to Transparent Radial.
  4. Gaussian Blur it a little, and take down the opacity.

Don't forget your other apps, continue adding shadows to them, using the techniques you've learned.

I don't like how the liquid is... so CTRL/Command+Click the liquid layer.

Go to Select -> Modify -> Contract and give this a value of 5px.

Ok now get the Gradient Tool, and select a dark pink/magenta and your normal liquid color. Make a Radial Gradient from the middle out, Dark to Bright.

Go to Filters -> Blur -> Gausian Blur and give it a value of around 3.0, put your layer to multiply and play around with the opacity I choose 75%.

Tutorial Finished.

More Info:

If you enjoyed this Tutorial, please subscribe to our Tutorial RSS feed, and digg our page, also you can check out our Wallpaper section with of course only Good-Walls.

Submit your Tutorial.

Send us your tutorial too, check out our Submition page for more info.

You can also Sugest a Tutorial.

You want to see an effect done? Please send us a suggestion and we will make it possible, all you have to do is Contact Us (use our About Us form) or just leave a comment.


No comments:

Post a Comment

Follow on Buzz