• You will need an 18X18 square grid pattern overlay created in this tutorial. Download it, put it in your adobe/photoshop/presets/patterns/ directory.
  
• Install this pattern by clicking edit=> Preset manager. Select patterns up top and click load. Find your square grid pattern.
  

1. Create a canvas that is 400 wide by 400 high, 72 ppi, RGB transparent.
[You must be registered and logged in to see this image.]2. Insert a layer. Set your default colors by pressing your D key. Click Filter=>Render=>Clouds.
3. Click Filter=>Render=>Lens Flare. Set the lens flare to the following:

• 100% brightness'
  
• 50-300 mm
  

4. Click Filter=Distort=>Polar coordinates. Set the polar coordinates to Polar to Rectangular.
5. Click Edit=>Transform=>Flip Vertical.
6. Click Filter=Distort=>Polar coordinates. Set the polar coordinates to Rectangular to Polar.
[You must be registered and logged in to see this image.]

7. Select your elliptical marquee set to fixed size of 400 wide by 400 high and select your globe.

• Click Select=> Inverse. Hit your backspace key.
  

[You must be registered and logged in to see this image.]

• [You must be registered and logged in to see this image.]Click Select Deselect.
  
• Click image=> adjust=> Autolevels.
  
• Click image=> Adjust=> Invert.
  
• Click Image=>Adjust=> hue/Saturation
  

<BLOCKQUOTE>

• Colorize
  
• hue= 106
  
• saturation=100
  
• lightness= -57
  

</BLOCKQUOTE>
[You must be registered and logged in to see this image.]8. Insert a new layer. Use your rectangular marquee set to 110 wide by 400 high to select a central area of your image.
Click Edit=> Fill. Set fill to Pattern, Select the square grid pattern.
9. Click Select=>deselect. Click Filter=>Distort=>Shear. Set the shear to wrap around. Place the points as in the diagram on the right.
10. Click Image=>Adjust=>Invert. Set the layer mode to luminosity with 15% opacity
11. Use the move tool to move the grid so the upper right curve sits on the upper right sphere edge. Link this layer to the sphere.
[You must be registered and logged in to see this image.]12. Duplicate this grid layer twice. Rotate and move the first copy so the upper right curve will sit on the lower right edge of the sphere. Link this layer to the sphere and the original grid layer.
13. On the second copy of the grid layer click edit=> Transform=> Flip horizontal. Move this layer to cover the middle of the sphere. Link this layer to the other grid layers and the sphere. Click Layer=> Merge Linked.
[You must be registered and logged in to see this image.]14. Use the move tool with bounding boxed to resize the sphere with grids and to move it up into the corner so it is pleasing to the eye.
15. Click Image=>canvas size. Set width to 750 pixels with current selection on the left.
16. Turn the eye off on the sphere. Click back on the background layer. Insert a layer.

[You must be registered and logged in to see this image.]17. Select the pen tool. Click in the corners in this order:

• lower left
  
• upper right
  
• lower right
  
• lower left.[You must be registered and logged in to see this image.]
  

18. Use your Convert point tool to double click the lower left point and drag out until you see two handles. Adjust the handles to make a nice curve to the upper right. Double click on the upper right point and drag out the handles. Adjust the handles to make a nice curve to the lower left.

[You must be registered and logged in to see this image.]19. Click on the paths palette. Right click on the path and select Set path as selection. Click back on the layers palette and insert a new layer. Click edit fill, set to white.
20. Click Select =>inverse. Fill with black. Turn your sphere layer on and highlight it. Set the mode to screen. Click the Add Layer mask button on the bottom of the layers panel
[You must be registered and logged in to see this image.]21. Add a new layer on top. Click Edit =>fill and set to black. Click Filter=>Render=>Lens Flare. Set the lens flare to

• brightness = 100%
  
• lens = 50-300 mm zoom
  

Set the layer to screen. Use your move tool to position the lens flare in the upper right corner of the black banner area.
22. Type in the Title of your website in the Top left of the page using the following settings:

• Arial
  
• Bold
  
• 48 Pt
  
• smooth
  
• Color = Hex #FE6363[You must be registered and logged in to see this image.]
  

.23. Right Click on the text layer and select Blending options.
Check Drop Shadow and set the following for drop shadow:

• mode = multiply
  
• opacity = 75%
  
• angle - 120
  
• Change the distance to 10 px.
  
• Spread =0
  
• size =5
  

[You must be registered and logged in to see this image.]
Check Gradient overlay and set the following for gradient overlay:

• Blend mode=normal
  
• opacity = 41%
  
• gradient = copper
  
• Check Reverse
  
• style linear
  
• Check Align with layer
  
• angle =90
  
• scale = 145%
  

[You must be registered and logged in to see this image.]Check Stroke and make the following stroke settings:

• size =1
  
• position = outside
  
• blending = normal
  
• opacity =100%
  
• fill = color
  
• Color = hex #9B3939
  

24. Type in Each Menu item of your website right above the curve on the right, on separate layers using the following settings:

• Arial
  
• Bold
  
• 14 Pt
  
• smooth
  
• Color = WHITE
  

Menu items on our sample are as follows: About Us, Services, Portfolio, Contact, Home.
25. Use the Move tool to slightly rotate each menu item to fit the curve and set it right above the curve, in the black area. Space them evenly .
26. Click the button on the bottom of the tools palette to Switch to Image Ready.
27. Use the slice tool to Slice your image into 4 images as shown below. The banner should be abpout 100 pixels high. The border slice on left should be about 80-100 pixels on the left..
28. Label your slices on your slice panel. Banner, border, wedge, white1 and white2.
[You must be registered and logged in to see this image.]Image mapping
29. Select the rectangular image map tool from the tool bar. Place a rectangle around the About Us menu item and open the Image Map palette.
30. Name your link on the image map palette, and type in the URL, either relative or exact, that this menu item should point to. If the target is different from replacing your current page, then type that in the target field. Add your alternate text label for this link to the alt field.
[You must be registered and logged in to see this image.]
40. Do the same (29 and 30) for the other menu items, making distinct names, and URLs that they point to.
Optimizing
41. Use your slice selection tool to select each slice one at a time, set the resolution your want on the optimize palette. For this Template, I set each slice that had the colors in them to JPG at 40%. I set the white areas to Gif at 2 colors.
42. Click to the 4 up tab for your image. On the upper right is the optimize settings we just set. lower left is lower res, lower right is even lower. check to make sure that images are still quality in the lower resolutions as you can select them here if you want to save at those resolutions. If you decide to stay with the jpg quality of 40, click on the upper right image so it is selected. Then click File=> Save optimized as. Save your template now. An HTML document will be created with your images placed inside an image folder where the html was saved.
your done!
You may want to edit this template in an html editor such as front page or dreamweaver. You will want to remove the white images from the table so you can type over them.]