dcsimg
A Flash Developer Resource Site

Results 1 to 6 of 6

Thread: How are these done??

  1. #1
    Member
    Join Date
    Feb 2002
    Posts
    70

    How are these done??

    How can the grid and left side buttons effect (http://www.foundstone.com/) be acheived using Photoshop?


  2. #2
    Junior Member
    Join Date
    Jan 2003
    Location
    Leeds, UK
    Posts
    19

    Yep - Photoshop

    To get the squares effect have a look at this tutorial:-

    http://www.jlswebsource.com/typicaltut.html

    This will show you how to create the squares pattern.

    After you've filled the area you require use a gradated layer mask to fade off the squares. You'll need to create another layer that contains a gradient, place this behind the pattern layer.

    It looks like the buttons on the left have been created using a layer style - probably a Bevel/ Emboss. This is probably one of the easier ways however you may want to do a search for 'photoshop 1 pixel bevels' etc on google, this usually pulls up a load of other methods that you may want to have a look at.

    ttfn

    tecnik

  3. #3
    Member
    Join Date
    Feb 2002
    Posts
    70
    thanks for that link..but that's not exactly what i'm looking for..

    That one is more of a bg filled with squares instead of a grid bg..

    so any idea how i can acheive that grid effect?

  4. #4
    Junior Member
    Join Date
    Jan 2003
    Location
    Leeds, UK
    Posts
    19

    Change the suares

    The tutorial was meant to show how a pattern can be created and then used to fill an area. Instead of creating a square create a capital L shape without any space round it. When used to fill an area the shape fill will produce a grid!

    I've attached a couple of files for you.

    Open gridbit.eps in photoshop.
    Select all
    Edit-Define pattern
    You'll be asked for a name under which the pattern is to be saved.

    Then select the area you require.

    Using the paint bucket tool fill the selected area with the pattern. This option will need selecting - I'm using PS6. When you select the paint bucket there are a couple of options in the top info bar. One is the 'Fill' type - change this to pattern. The other should be 'Pattern' - select the pattern you created.

    Et Voila!

    The area you selected should now have a grid in it.
    Attached Files Attached Files

  5. #5
    Blue Haired Muppet

    Join Date
    Jul 2000
    Location
    ----->
    Posts
    443
    ok, try this.

    Make a new layer

    Then, make a square (just the outline).. in other words.. select a small area using the square selection.. fill in with black.. select the box by holding control while selecting the layer.. go to selection>modify>contract .. set to one pixel, then delete.

    Then, delete the top and left side of the box. Now, the thing should look like an "L".

    Ok, now make sure the background layer is turned off..

    select the "L" by using the square selection (thus also selecting area around it).

    Then go to Edit>define pattern

    Now, it is a pattern.. make a layer, select the fill tool and instead of filling a whole area with a solid cool, select pattern and select the little black L..

    That should make the grid.

    Hope you followed that.. Let me know if it works

    Patrick Johnson
    www.mana03.com

  6. #6
    Member
    Join Date
    Feb 2002
    Posts
    70
    It works! Thanks!

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  




Click Here to Expand Forum to Full Width

HTML5 Development Center