Create a Realistic Vinyl Effect

By | 15 comments | Photoshop | Tags: ,

 

Designing a Retro Vinyl Effect in Photoshop

Step 1

Start off with a file 500×500.

Make a new layer. Get the Elliptical Marquee Tool (press M) and hold shift while dragging a Circle. Then fill that selection with black.

Now Duplicate that layer (Ctrl J), Load the Selection of the duplicated layer (Ctrl click on layer) and press Ctrl T to get in free transform. Now go into the percentages box Now go into the percentages box and set them to 40%, both, height and width.

Select the original layer and hit delete.

Delete the middle Circle (the small circle) layer. (layer 3 in my image)

Step 2

Select the Main Circle again and go to Filter>Noise>Add noise

Use these settings:

Load Selection(Ctrl click on layer) on the Main Circle. Then go Filter>Blur>Radial Blur And use these settings:

Step 3

Now use your Magic Wand Tool to select the middle of the circle.

One you have done that create a new layer and go Select>Modify>Expand and use 2pxNow fill the selection with any colour you like (I used #fa8100)

Use Blending options: Bevel And Emboss

Step 4

To get the light effect, we are going to make a Adjustment layer. Click the Adjustment layer icon

And select Levels. A window will popup, Use these settings:

You can play around with these settings later

Now fill the mask with black

Get the Gradient Tool (G). Set your Fore- and Background colour White and Black, select the Reflected Gradient box and select Foreground to Background

Then drag a Gradient like this:

Your done!

Now you should be creative and make some text and images in the middle circle!

Ultimate Designer Toolkit: 60,000+ Premium Design Items, Only $49!

READY TO TAKE WEB DESIGN SERIOUSLY?

Today, I am giving away Web Design Riches, the ultimate guide on how to run a profitable web design business. Enter your name and email below to get instant access.

Comments

15 Comments

  1. hosting peru (4 years ago)

    This is a good article I would like to have more info about this site I will subscribe to the feed

    • employee monitoring software (11 months ago)

      This blog has given me some ideas about the vinyl effect which is definitely a new term in the field of graphic designing.So I am so much excited to apply this new effect on my upcoming event.

  2. Nguyen Phuong Thu (4 years ago)

    This tut helped me a lots. Thanks..^^

  3. RBR Video Production (4 years ago)

    This is a very good resource for learning to use Adobe Photoshop. For someone just getting into Photoshop this is very helpful.

  4. who (4 years ago)

    Thank you! Really helps in developping some music stuff))

  5. NJ Website Design (4 years ago)

    i was actually looking for something like this for a website i’m building. thanks a lot

  6. Jarvis M. Fretwell (4 years ago)

    Hi nice post, i have come across your site once before when searching for something so i was just wondering something. I love your theme, would it happen to be a free one i can download, or is it a custom one you had made? In a few weeks i will be launching my own site, i’m not great with designs but i really like the style of your site so it would be cool if i could find (or pay for) something with a similar look. :) Thanks!

  7. EGESHI (4 years ago)

    Thanks for a nice tutorial!

  8. Create a Realistic Vinyl Effect Web Design Tutorials Creating | Shed Kits (3 years ago)

    [...] Create a Realistic Vinyl Effect Web Design Tutorials Creating Posted by root 1 day 4 hours ago (http://www.webdesigndev.com) What to add that retro vinyl effect your website banner or design 06 mar 2009 interesting article were did you got all the information from reply to this comment powered by wordpress designed by woo themes Discuss  |  Bury |  News | create a realistic vinyl effect web design tutorials creating [...]

  9. Gabydunet (2 years ago)

    Good and simple tutorial for a nice looking creation, thanks a lot ! I save this for later. I love your site.

  10. Robert (2 years ago)

    I’m new to PS, and I’m a little confused on step one. You state “Select the original layer and hit delete.” then you state “Delete the middle Circle (the small circle) layer. (layer 3 in my image).” If I do both of those things, the only layer I have left is my background layer. Can you please help this simple-minded newbie understand your instructions?

  11. Name (required) (1 year ago)

    This Tutorial help me lot.it rally magic.Thanks

  12. Pc expert (11 months ago)

    this is really amazing.I do not have much knowledge about this vinyl effect.But this blog has given me much ideas about this effect.I think it is such an easy process but the designed object outstanding.

  13. Pc expert (11 months ago)

    this is really amazing.I do not have much knowledge about this vinyl effect.But this blog has given me much ideas about this effect.I think this certainly a very good tip for a graphic designer.

  14. 8 Bassein (11 months ago)

    Thanks for sharing the information! Although your “cd” looks edgy, I thought you can actually use Stroke or something to make it smoother.