Web Hosting Deals Holiday Logo Design Webcam Chat Website Header Templates Register domain Search Engine Optimisation Web Hosting
Go Back   Talk Mania Forum > Tutorials > Photoshop Tutorials > Web Layouts

Web Layouts Create professional webpage layouts with this very detailed, step by step tutorials.

 Image
Buy Sell Downloads

Reply
 
Submit Tools LinkBack Thread Tools Display Modes
  #1 (permalink)  
Old 03-06-2007, 11:11 PM
admin's Avatar
Administrator
 
Join Date: Sep 2006
Posts: 1,340
Blog Entries: 2
admin has disabled reputation
99 Subacvatic layout

Hello my friends

Today i will show you how to create a business layout

This is the Tutorial Number 99 from our 100 Tutorial Marathon
Soon this marathon will end, and i will start another one. I will not tell you how many tutorials i will create in my future marathon

This is what we gone do today



Open a new photoshop document
Size 760 x 780 pixels
Background color : White

Select Gradient Tool and create the following gradient:



Then with Gradient tool, apply the following gradient. Follow the green arrow



Now find some Clouds brushes over the internet , or make your own brushes if you want , and on a new layer, add a a few clouds.



Select Rounded Rectangle tool, ( set the radius to 5 pixels ) and start making some rectangles



Then add the same layer style for all the rectangles from the top









This is the result



Then for the big shape add the following layer style





This is the result



Now create a new pattern
Create another document:


Zoom this document to 1600% and with the Pencil Tool Draw 3 points:



After that go to Edit > Define Pattern...
Choose a name for your pattern and press OK
To learn more about patterns , please visit the following link.
http://www.talk-mania.com/showthread.php?t=37

Then you can close this 3 by 3 pixel document , and go back on our main layout

Now select one button, hold the CTRL key down and press on the layer thumbnail with the left mouse button.



You can see that a new selection will be visible around your button



Create a new layer ( press CTRL+SHIFT+ALT+N )
Select Paint Bucket tool,
Use the following settings



And press one time inside your selection
Go to Select > Modify > contract ( and choose contract to 3 pixels )



Choose Select > Inverse , then hit one time the " Delete " key from your keyboard
Now press CTRL+D to deselect



Press on " Add layer mask " button



Select Gradient Tool
Use the following settings:



Then make a small line from Top to Bottom ( please follow the red arrow )



Then duplicate this layer with this pattern , and place it on each button



Now add some tech brushes on your header, and also some text on the buttons



Now you can add another rectangles



Then add the following layer styles









This is the result



Now create some dots with Type tool. rasterize the type , and rotate this layer. I want to add some dots like in the image



Now zoom your document to 1600 %. Choose Pencil tool ( use a square brush ) and add some simple squares on your buttons



Now create a new layre , Select Brush tool ( use a smooth round brush ) and make some random lines. like in the following image. you can use 2 -3 colors if you want



Then go to Filter > Blur > Gaussian Blur



Then you can reduce also the layer opacity to 50 %, and you can also change the blending Mode to overlay



This is the result. It looks almost like water



Now you can add some images on your layout. I will add one Oil Rig , and i will combine with a octopus. the effect is very simple. you have to cut different parts from the octopus , and place it under the oil rig

You can see that i have another sea creatures on the bottom of the layout. now you can add as many details you want. if you have stock images.
this is my final result



If you want to add extra details on this layout then you might be interested in Talk-Mania Big-Pack
Thank you

Attached Files
File Type: zip layout99.zip (1.07 MB, 858 views)
__________________
3D Logo Creator + Mega Pack + Photoshop Designer's Pack = Only 148$ ( save 150 $ - use coupon code: talk )
Reply With Quote
  #2 (permalink)  
Old 03-07-2007, 02:57 AM
Member
 
Join Date: Mar 2007
Posts: 31
Robbie is on a distinguished road
I very much like the outcome, except for the lines and other gfx in top right rectangle - very different also. Keep it up! 8/10
Reply With Quote
  #3 (permalink)  
Old 03-07-2007, 05:55 AM
Lukeintosh's Avatar
VIP Member
 
Join Date: Oct 2006
Location: I live in New Zealand
Posts: 249
Blog Entries: 13
Lukeintosh is on a distinguished road
Send a message via MSN to Lukeintosh Send a message via Yahoo to Lukeintosh
!!! Finaly!!!

FINALY!!! I GREAT LAYOUT!!! WELL DONE 7/10
I don't like the sea things down the bottom thoe the Layout looks good! i will post a picture of my layout with mix of some of your tutorials. Well don Admin i hope to see the last one a GOOD One i would like to see a Food layout for the final one. By the way your only up to 98.
Reply With Quote
  #4 (permalink)  
Old 03-07-2007, 06:01 AM
Junior Member
 
Join Date: Mar 2007
Posts: 9
Neenahred is on a distinguished road
looks great

love the marathon

8/10
Reply With Quote
  #5 (permalink)  
Old 03-07-2007, 09:04 AM
Junior Member
 
Join Date: Mar 2007
Posts: 10
Melkor is on a distinguished road
Personally I would choose this one, but its a great layout for those deepsea divers ^^

I can't believe you've done nearly 100 tutorials.. My god I'd of gone crazy.
Reply With Quote
  #6 (permalink)  
Old 03-09-2007, 09:56 PM
Member
 
Join Date: Feb 2007
Location: Virginia
Posts: 60
modest is on a distinguished road
Did you purposely try to spell "Subaquatic" as "Subacvatic"?

I'm not a big fan of this tutorial, I can get some use out of the header, but I've liked some of your other work a lot better. I'd give this a 6/10
__________________
Modest
We build the mods, you dig the est.


If you find my comment useful, please click the Green Checkmark to the left and add to my reputation


Reply With Quote
  #7 (permalink)  
Old 03-09-2007, 10:31 PM
mmc mmc is offline
Member
 
Join Date: Mar 2007
Posts: 33
mmc is on a distinguished road
not bad.....
Reply With Quote
  #8 (permalink)  
Old 03-11-2007, 11:17 PM
Junior Member
 
Join Date: Mar 2007
Posts: 9
Vader is on a distinguished road
not bad, i like the good idea with the sea stuff, 10/10
Reply With Quote
  #9 (permalink)  
Old 03-12-2007, 12:41 AM
Junior Member
 
Join Date: Mar 2007
Posts: 10
H4ed is on a distinguished road
god work 10/10 .Very Nice layout
Reply With Quote
  #10 (permalink)  
Old 03-12-2007, 07:36 PM
Junior Member
 
Join Date: Mar 2007
Posts: 10
aximilian1 is on a distinguished road
ce goro

ce misto/verry nice brush

Reply With Quote
Reply

Bookmarks

Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are On
Forum Jump


All times are GMT +2. The time now is 07:59 PM.


Fake ID

Powered by vBulletin® Version 3.7.1
Copyright ©2000 - 2008, Jelsoft Enterprises Ltd.
SEO by vBSEO 3.2.0 RC8
Forums Copyright © Talk-Mania.com