Tutorials-Photoshop.com » Color Stip Sidepanel http://tutorials-photoshop.com Learn - Play - Create Tue, 29 Nov 2011 17:51:21 +0000 en hourly 1 http://wordpress.org/?v=3.3.1 Color Stip Sidepanel http://tutorials-photoshop.com/graphic-interface-tutorials/color-stip-sidepanel/ http://tutorials-photoshop.com/graphic-interface-tutorials/color-stip-sidepanel/#comments Sat, 12 Sep 2009 20:41:52 +0000 Kpmedia http://interfacemojo.cashfiles.net/?p=63 colorstripside008For Use With Web Creation or Graphic Design Below you will find various graphic design instructions as they relate to web design. Let’s walk you through the process of creating an sidepanel for your website designs. These are useful when you design your website and you need some side buttons to help with the navigation. Step-By-Step Instructions: 1. Open a new document. 500×500 width/height. 2. Create a new layer. Name it “Button”. 3. Select the Rectangular Marquee tool. Create a rectangular selection as follows: 4. Select the Paint Bucket tool. 5. Fill in the selected rectangle with the button color you desire. (This tutorial Hex Code: #5B5B5B). 6. Select the Rectangular Marquee tool again. Create a smaller rectangular selection at the right end as follows: 7. Select the Paint Bucket tool. 8. Fill in the selected rectangle with the button color you desire. (This tutorial Hex Code: #ADE6FD). 9. Click Ctrl+D to select. 10. Right click the “Button” layer. Choose “Blending Options” from the pop-up list. 11. Choose “Bevel and Emboss”. Set to the following: 12. Click OK to close out and return to button. 13. Copy and paste the button to create multiple buttons in a column. This is [...]]]> colorstripside008

For Use With Web Creation or Graphic Design

Below you will find various graphic design instructions as they relate to web design.

Let’s walk you through the process of creating an sidepanel for your website designs. These are useful when you design your website and you need some side buttons to help with the navigation.

Step-By-Step Instructions:

1. Open a new document. 500×500 width/height.
2. Create a new layer. Name it “Button”.
3. Select the Rectangular Marquee tool. Create a rectangular selection as follows:

4. Select the Paint Bucket tool.

5. Fill in the selected rectangle with the button color you desire. (This tutorial Hex Code: #5B5B5B).

6. Select the Rectangular Marquee tool again. Create a smaller rectangular selection at the right end as follows:

7. Select the Paint Bucket tool.
8. Fill in the selected rectangle with the button color you desire. (This tutorial Hex Code: #ADE6FD).

9. Click Ctrl+D to select.
10. Right click the “Button” layer. Choose “Blending Options” from the pop-up list.
11. Choose “Bevel and Emboss”. Set to the following:

12. Click OK to close out and return to button.

13. Copy and paste the button to create multiple buttons in a column. This is now your sidepanel. (Note: You can use the Rectangular Marquee tool to select the small color bar on the right side of each button, then fill with a color to add some color variation).

14. Type text onto the buttons and then you are done.

]]> http://tutorials-photoshop.com/graphic-interface-tutorials/color-stip-sidepanel/feed/ 1