How would you create this graphic

LouTheDesigner · 06-26-2009, 05:14 AM

Hello,

I am mostly into web design, and consider myself a graphic designer secondly.

My question is, how would you go about (preferably using illustrator or photoshop) creating the graphic that is located on the top left on the following URL:

http://tinyurl.com/l385an

I just can't seem to do this with either program. Any advice would be appreciated. I like the horizontal lines and the lighting on the text the most.

Thanks in advance.

Lou

wachtn · 06-26-2009, 05:54 AM

Hi, I consider myself to be as much a graphic artist as I am a cowboy. I wear their boots, thats about it.

In After Effects you have a lighting tool, I believe it is called a spot light. That could create the lighting effect.

In Photoshop, there is a filter, in sub menu "render", called lighting effect. That could also make the lighting effect your looking for.

In Fireworks, you have "Styles". These can be used to create the button look as well as the dark fading to light effect. If you use the right style with layers, you could easily create the wave look with the dark fading to light over black.

The text is very simple. Just make the text layer transparent to get the color effect.

I have no clue how to avoid making the horizontal lines by hand. One would think there is a pattern or filter or style or something in the Adobe suite for making it. I just dont know where it might be, Sorry.

wachtn · 06-26-2009, 05:56 AM

Have you thought about taking your window blinds and spray painting them? With a good digital camera and some time, you could easily make those lines. LOL

Unknown98 · 06-27-2009, 01:49 AM

LOL. You'd need new blinds though.

wachtn · 06-29-2009, 02:51 AM

I think I have found out how to make those lines, or at least something close.

In photoshop:
Filter >> Halftone Pattern >> patter type: line

Also...

Filter >> Conte' Crayon
These lines are not as smooth and the Halftone Pattern. If you play around with the setting for this filter, you might find something you enjoy.

Be sure to post back and let us know if that worked. Good luck to you.

PixelPusher · 06-29-2009, 06:03 PM

Are you trying to create the rectangle with Charm written in it or the textured background? or both?

Photoshop will be the best app to achieve this.

PixelPusher · 06-29-2009, 06:07 PM

The vignette (circular fade out on all four sides) can be achieved by using a layer mask. Lighting effect could work but I would recommend the mask.

In a layer mask, the black represents what will be visible.

To Add:
Select the layer to mask, then click the layer mask button in the bottom of the Layers pallet. Make sure the layer mask box is selected (will have a border around it in the layer your added it to) and draw an ellipse with the circular marquise tool (M). Fill it with black. With the ellipse selection still present, go to Select > Modify > Feather and choose something like 15px. Then go to Select > Inverse and hit delete (your can hit it a couple times to make the fade more pronounced) whala!

wetgravy · 07-05-2009, 08:49 PM

Quote:

Originally Posted by LouTheDesigner

Hello,

I am mostly into web design, and consider myself a graphic designer secondly.

My question is, how would you go about (preferably using illustrator or photoshop) creating the graphic that is located on the top left on the following URL:

http://tinyurl.com/l385an

I just can't seem to do this with either program. Any advice would be appreciated. I like the horizontal lines and the lighting on the text the most.

Thanks in advance.

Lou

the background is just a simple pinstripe pattern on top of a red circular gradient, the box is a a combination of things ... 1. it's got a bevel, gradient, and drop shadow, 2. it's got a multiply layer to create the black drop in the middle, and 3. there is some detailing work to create reflective shadows and highlights as well as to provide some false depth in the interior the text uses the mulitply layer (probably as it's own seperate layer in a smaller fill %, an inner shadow (set to be a solid stroke) and an outside glow (of black)

Quite easy actually. Just gotta practice with it a little.

bugeyesweb · 07-08-2009, 05:32 PM

use fireworks made by adobe.

pratishtha · 08-09-2009, 10:31 AM

you thought about taking your window blinds and spray painting them?

06-26-2009, 05:14 AM	#1
LouTheDesigner Gold Member Join Date: Oct 2008 Location: Yonkers, NY Posts: 495	How would you create this graphic Hello, I am mostly into web design, and consider myself a graphic designer secondly. My question is, how would you go about (preferably using illustrator or photoshop) creating the graphic that is located on the top left on the following URL: http://tinyurl.com/l385an I just can't seem to do this with either program. Any advice would be appreciated. I like the horizontal lines and the lighting on the text the most. Thanks in advance. Lou

06-26-2009, 05:54 AM	#2
wachtn Silver Member Join Date: May 2009 Posts: 107	Hi, I consider myself to be as much a graphic artist as I am a cowboy. I wear their boots, thats about it. In After Effects you have a lighting tool, I believe it is called a spot light. That could create the lighting effect. In Photoshop, there is a filter, in sub menu "render", called lighting effect. That could also make the lighting effect your looking for. In Fireworks, you have "Styles". These can be used to create the button look as well as the dark fading to light effect. If you use the right style with layers, you could easily create the wave look with the dark fading to light over black. The text is very simple. Just make the text layer transparent to get the color effect. I have no clue how to avoid making the horizontal lines by hand. One would think there is a pattern or filter or style or something in the Adobe suite for making it. I just dont know where it might be, Sorry. Last edited by wachtn; 06-26-2009 at 11:08 PM.

06-29-2009, 06:03 PM	#6
PixelPusher Super Moderator Join Date: Oct 2008 Location: Arizona, USA Posts: 1,053	Are you trying to create the rectangle with Charm written in it or the textured background? or both? Photoshop will be the best app to achieve this. __________________ John Darling Graphic / Web Designer SmarterTools Inc. (877) 357-6278 www.smartertools.com

06-29-2009, 06:07 PM	#7
PixelPusher Super Moderator Join Date: Oct 2008 Location: Arizona, USA Posts: 1,053	The vignette (circular fade out on all four sides) can be achieved by using a layer mask. Lighting effect could work but I would recommend the mask. In a layer mask, the black represents what will be visible. To Add: Select the layer to mask, then click the layer mask button in the bottom of the Layers pallet. Make sure the layer mask box is selected (will have a border around it in the layer your added it to) and draw an ellipse with the circular marquise tool (M). Fill it with black. With the ellipse selection still present, go to Select > Modify > Feather and choose something like 15px. Then go to Select > Inverse and hit delete (your can hit it a couple times to make the fade more pronounced) whala! __________________ John Darling Graphic / Web Designer SmarterTools Inc. (877) 357-6278 www.smartertools.com Last edited by PixelPusher; 06-29-2009 at 06:15 PM.

07-08-2009, 05:32 PM	#9
bugeyesweb New Member Join Date: Jul 2009 Posts: 11	use fireworks made by adobe. __________________ Tampa Web Design

06-26-2009, 05:56 AM	#3
wachtn Silver Member Join Date: May 2009 Posts: 107	Have you thought about taking your window blinds and spray painting them? With a good digital camera and some time, you could easily make those lines. LOL

06-27-2009, 01:49 AM	#4
Unknown98 New Member Join Date: Jun 2009 Posts: 7	LOL. You'd need new blinds though.

06-29-2009, 02:51 AM	#5
wachtn Silver Member Join Date: May 2009 Posts: 107	I think I have found out how to make those lines, or at least something close. In photoshop: Filter >> Halftone Pattern >> patter type: line Also... Filter >> Conte' Crayon These lines are not as smooth and the Halftone Pattern. If you play around with the setting for this filter, you might find something you enjoy. Be sure to post back and let us know if that worked. Good luck to you.

08-09-2009, 10:31 AM	#10
pratishtha New Member Join Date: Aug 2009 Posts: 3	you thought about taking your window blinds and spray painting them? __________________ modern fitted kitchens water damage in houston

Thread Tools
Show Printable Version Email this Page
Display Modes
Linear Mode Switch to Hybrid Mode Switch to Threaded Mode