• Home
  • About
  • Advertise
  • contact
Subscribe: Posts | Comments | E-mail
  • 1.RhapsodyAnything & Everything
  • 2.Web DesignStandards rule!
  • 3.Photoshop... Love Buzz
  • 4.The WebNews and Trends
  • 5.Web DevServer Side
  • 6.Hosting...for the web
  • 7.Science... DNA and Stuff

WebScienceMan

Posts Tagged ‘Adobe’


Posted on January 16, 2009 - by Khaled

Easily achieve the trendy LetterPress effect with Photoshop

photoshop_tut_splash_lp

In late 2008 and early 2009 LetterPress effect is becoming increasingly popular and used in many web sites. So here 2 quick examples on how you can create a realistic letterpress effect with Adobe Photoshop (Version 7 or newer). This will take you just a couple of minutes and you can achieve it even if you are a beginner.

Example 1:

Open Photoshop, create a new document (600 x 400 for instance). I started with a white background and typed the word Letterpress (Font: Century Gothic, 60pt, All caps and set the color for instance to: #00bae8).

photoshop_tut_splash_letterpress2Now we are going to add layer effects (double click the text layer) and simply check the inner Shadow box and set it to these values (shadow color: black #000000):

layer_style

You will obtain this kind of effect:

photoshop_tut_splash2

As you see we’re almost there! You can customize a bit more with overlaying a gradient overlay or you can rasterize the type layer and work on it with burn/dodge tool. You can check out this tutorial to see how to use Dodge/Burn tools. You should be able to end up with a final aspect that looks like this:

photoshop_tut_splash3

I just applied a gradient overlay effect and some burning at the base of the letters.

Example 2:

Ok, let’s see another variation that might work better if you are after a metallic Letterpress effect. Create a new document, fill in the background with a light grey color (#d0d0d0 for instance). Type in LETTERPRESS (Font: Century Gothic, 60pt, All caps, Set tracking to 50 and set the color for instance to: #919191). Now we’re going to add an inner glow effect this time. Set the Inner glow values as following (color: #000000):

layer_style2

The noise percentage can be tweaked and set to what is best for your purpose!

photoshop_tut_splash4

Now apply an outer glow with these settings:

layer_style3

You should obtain something like this:

photoshop_tut_splash5

All you need now is to play with your background to make it look like brushed metal using noise filters and motion blur along with dodge/burn tools. May  be also add a gradient overlay to the text layer and you will have something that looks like this:
photoshop_tut_splash6
If you think I should put more details about the creation of this metallic background or on the last steps of this tutorials let me know!


Posted on April 15, 2008 - by Khaled

Photoshop Wrap background Tutorial

Another old Photoshop tutorial picked up from the kyscorp archives again. This is just to show you how to create some special background effect with Photoshop. Of course once you see how the background was done you can change it and make some tweaks all along the tutorial modifying any step to obtain what you exactly need. It is an old tutorial that was created for Adobe Photoshop 7 but you can of course use Photoshop CS, CS2 or CS3. More old tutorials will be posted soon…



(more…)


Upgrade adventure


    • BreedSoftware HostGator
  • Twitter feed

    • The value of social is empowerment through broadening of contextual intelligence! #e2conf #socbiz about 2 hours ago from web
    • "If you're not #failing, you're not pushing hard enough" - BE #BOLD - Jeff Turner #7tmUAE - Via @rsavoia about 2 hours ago from web
    @khaled_ouanes
  • Featured News

    • Natural leadership is a Truth but it has to be nurtured! by Khaled on May 21, 2013
    • … On being successful by Khaled on March 26, 2013
    • A collection of motivational Digital Post-its by Khaled on March 26, 2013
    • The Perfect WorkSpace by Khaled on March 12, 2013
    • What does UX mean for me (and my team) by Khaled on May 11, 2012
  • Tag Cloud

    • 2.Web Design 2.Web Design 3.Photoshop Adobe Adobe Photoshop blog browser Browsers CMS color creativity CSS DNA Facebook FireFox Genetics graphic design Graphics HTML Internet Explorer JavaScript Joomla Mozilla Opera palette Photo Manipulation Photoshop tut Photoshop tutorial productivity recession recipe Science Sitepoint social tutorial Twitter Usability UX web web design business web designer Web Development WordPress WordPress plugins WordPress Update
  • Take a look

    • BreedSoftware
    • Kyscorp.com
    • Scriptomania
    • TunisDesign
    • TwittHero

Subscribe: Posts | Comments | E-mail

Add to Technorati Favorites WebScienceMan © 2006-2013 |Powered by WordPress| KYSCORP.COM 2000-2013| Rainbow Cliff Theme.
Optimized for FireFox 2+ | Google Chrome 1.0 + |Opera 9+ | Safari 3+ | IE7+ [Web Standards are cool!]