USB Stick Tutorial

1 Star2 Stars3 Stars4 Stars5 Stars45 Votes, Rating: 4.22
Loading ... Loading ...

Create a new document 800×400 with your desired background color. Goto “view > snap” this will will make your cursor snap to a grid, to view the grid we goto “view > show > grid” your canvas will look like this.

Now create 2 cirlces using the elliptical tool, make sure you hold down shift when drawing the 2nd one.

Now select the polygonal lasso tool whilst holding down shift join up your cirlces, follw my red path in the picture below.

You now be left with a selection like this. Turn off your grid and the snap tool.

Fill the selection with any color you desire. Now Add these layer styles.

Your shape should now look like this.

Press “ctrl + T” and drag one of the middle anchor points on the side inwards decreasing the length of the shape. Duplicate your shape, right click your duplicated shape and goto clear layer styles. Refill your duplicated layer using the paint bucket tool in the color white. Set layer opacity to 30% and blending mode to soft light. Press “ctrl+ T” and drag the anchor pointers to make the whole shape smaller length ways and width ways, we dont want to make it to small thou. Place similar to the image below.

Now we need to create our lid, so for this step we need to cut away a portion of the shape aswell as the highlight we just made. To do this create a selection like this.

Goto “edit > cut” then “edit > paste” re-align your lid next to the shape, copy your layer styles over from the orginal shape. You should have something like this.

Repeat the step above only this time cut and paste your highlight. When your done place them side by side like this.

Under your main shape layer create a small rectangle and add these layer styles.

You should have something like this.

Do the same again only this time make it longer and thinner and add these layer styles.

You should have something like this.

Now using two 1pixel lines add an indent, and using 2 boxes make your usb connection come alive.

Add some text and your prefered logo.

Thats it all done, now you could add a few extras like the strink etc… heres mine.

Stay Connected...

Subscribe Via RSS

Subscribe Via RSS

Subscribe Via Twitter

Subscribe Via Twitter

Subscribe Via E-Mail

Subscribe Via E-Mail

64 Responses to “USB Stick Tutorial”

  1. Jesi Says:

    That’s a cool tutorial. :)

    Easy to follow too, and a nice result :)

    Thanks, Jesi.

  2. Rick Says:

    Hey :) That’s awesome!, i’m not good at PS but i could do this :D Off to the next tutorial! :cheer:

  3. minhtuan Says:

    That’s great! Thax

  4. Nathan_1979 Says:

    AWESOME! XD
    5/5!

  5. Naveed Says:

    yeah this is TIGHT…simple and easy to follow :)

  6. Rana Naeem Says:

    Very nice

    Good looking

    Pforessional tutorial

  7. Rana Naeem Says:

    professional

  8. booris Says:

    thats nice but i can’t pay photoshop

  9. rainh Says:

    Thanhs for share!^^…Very nice

  10. Ovais Says:

    tht’s a nice tutorial..thanks for sharing…

  11. Aleks Says:

    Very great!

  12. Daniel Norton Says:

    step four (4) doesn’t work for me as my circles dont go away:(

  13. ADMIN Says:

    draw a square (marked in red) whilst holding shift. you must overlap the circles for them to transform into the shape

  14. aamir ali Says:

    Photoshop is a great fun to use but the moment I visit HV-Design.co.uk this has become even cooler to rejoice. Things have never been so easy before.

    Great

  15. Mehrdad sharif Says:

    THANKS.THAT IS A COOL EFFECT.

  16. Tarik Says:

    Josh josh josh! Kothin Hoise mama…
    (English: Awesome! Gr8 work…)

  17. Phantom Design Says:

    easy and powerfull tutorial, great work :)

  18. Pius sarfo Says:

    This tutorial is wonderful, and I have been reading a lot from your site.

    You are helping me to improve upon my skills. from Ghana

  19. mj Says:

    nice tutorial!
    very cool.
    thanks for sharing

  20. prohacking Says:

    Hi there, what font have you used on the usb where it says FLASH DRIVE 2GB? Thanks.

  21. Gaurav Chaudhary Says:

    Great Tutorial!! I am applying the same layering styles to the button but i am not getting exactly the same effect and color you got. i have tried hard to figure out the problem. I particularly love the color of the button and really looking forward for same effect. Any suggestions are greatly appreciated. Thanks!!

  22. ADMIN Says:

    dont understand why your not getting the same effect, its all written down, maybe show us a picture of your effect.

  23. Gaurav Chaudhary Says:

    I am relatively new to photo shop so i may be making a blunder. Here is my psd file and jpeg image

    Thanks for your help…

  24. LOVE MALHOTRA Says:

    HMMMMMMMMMMMMMM……… I LIKE IT YOUR COLLECTION

  25. HaKi Says:

    hi can you share the font on the usb stick?

  26. Joe Says:

    Wow! Surprisingly easy to follow and it turns out great. Thanks

  27. Kanchan Says:

    Cool One!!
    Just Loved It!!

  28. Himanshu Kapoor Says:

    Thanks. Just completed the tutorial. Wonderful result.

  29. eddy Says:

    good effects

  30. Lucas Li Says:

    It is Cool Tutorial! Your Design is so professional. Thank you for sharing!

  31. ????? ???? Says:

    Explain the stock

    Thanks

Leave a Reply

Name:

E-Mail:

Website:

Your Reply:

Trackbacks

  1. All about Gadgets : Digital arts, Tutorials, Links « exdez
  2. 40 Icon Tutorials for Photoshop | Vandelay Website Design
  3. 27 Best Photoshop Gadget Design Tutorials to Design Realistic Gadgets
  4. webbyarts.com » fucking post
  5. 40 Icon Tutorials for Photoshop :: Antilogic Media
  6. ?????? ????? 40??? ???????  | trmez
  7. 10 Coola Tech Photoshop Tutorials
  8. san-des
  9. 27 Best Photoshop Gadget Design Tutorials to Design Realistic Gadgets | rowebdesign
  10. AllTuts - Photoshop Tutorials, Illustrator Tutorials, Free Photoshop Brushes and more
  11. 27 Tutoriales en Photoshop de Gadgets « Libertad Creativa
  12. Photoshop Tutorials To Improve Your Modeling and Design Skills | Tutorials | Smashing Magazine
  13. Photoshop Tutorials To Improve Your Modeling and Design Skills | Tutorials | Smashing Magazine
  14. ??????????????? @ Usuning ???????????
  15. Photoshop Tutorials To Improve Your Modeling and Design Skills | fatcityart
  16. Photoshop Tutorials To Improve Your Modeling and Design Skills | Web Burning Blog
  17. Ontwerp snel je eigen Photoshop iconen |
  18. Photoshop Tutorials To Improve Your Modeling and Design Skills | A.Niraj Kumar
  19. 27 Best Photoshop Gadget Design Tutorials to Design Realistic Gadgets | SulVision
  20. pligg.com
  21. 42 Amazing Photoshop and Illustrator Icon Design Tutorials : Speckyboy - Web Design, Web Development and Graphic Design Resources
  22. Photoshop and Illustrator Icon Design Tutorials | CSS Experiments
  23. Photoshop Tutorials To Improve Your Modeling and Design Skills | Web Design,Photoshop Tutorial,Design News
  24. Wordpress Blog Services - 43 Really Useful Photoshop Tutorials For Excellent 3d Effects
  25. FreeDownloadSecrets.com » Blog Archive » 43 Really Useful Photoshop Tutorials For Excellent 3d Effects
  26. 43 Really Useful Photoshop Tutorials For Excellent 3d Effects | Programming Blog
  27. 43 Really Useful Photoshop Tutorials For Excellent 3d Effects | soccermania
  28. 27 Best Photoshop Gadget Design Tutorials to Design Realistic Gadgets — Dindandon
  29. Photoshop Tutorials To Improve Your Modeling and Design Skills | Design-Tut+
  30. 40 Icon Tutorials for Photoshop « Online Free Application Software Tips Tools Wallpapers
  31. 35+ Photoshop Icon Tutorials | Free Tools And Wallpapers
  32. 42 Tutoriais de Criação de Ícones – Photoshop e Illustrator | RHOdesign Blog: Webdesign, Otimização SEO e Webmarketing