Menu Search
Jump to the content X X
Smashing Conf San Francisco

You know, we use ad-blockers as well. We gotta keep those servers running though. Did you know that we publish useful books and run friendly conferences — crafted for pros like yourself? E.g. our upcoming SmashingConf San Francisco, dedicated to smart front-end techniques and design patterns.

Free Full Layered Facebook GUI PSD Kit

In this post we release a free Facebook GUI PSD Kit, designed by SurgeWorks1 and released for Smashing Magazine and its readers. The main idea behind the kit is to speed up the prototyping of Facebook application UIs and Facebook fan pages, thus sparing you from drawing all the comps and letting you customize all the texts, buttons and data as you need. As usual, the kit is free to use in all projects, without any restrictions.

The kit brings the Facebook vector icon and logo. Also, since the focus of this resource are the UI elements, it brings a main window with the header, menu and the chat window for you to set up your realistic mock-ups. Plus all the modal components, comment boxes, buttons, message boxes, tabs, etc. All the components are full layered, built using vectors and blending options, so that scaling and editing the objects will not be a problem.

Download the set for free! Link

The theme is released under Creative Commons. You can use it for all your projects for free and without any restrictions. Please link to this article if you want to spread the word. You may modify the kit as you wish.

Screenshot2

Features Link

The PSD set consists of 3 PSD files:

  • Facebook-GUI.psd contains all Facebook UI elements;
  • Facebook-App-Authorization-Request.psd and Facebook-App-Template.psd contain the basic structure for Facebook applications design.

Facebook-App-Authorization-Request6
Facebook App Authorization Request (large view)7

Facebook-App-Template8
Facebook App Template (large view)9

Features10
Features (large view)1511

Features12
Features (large view)13

Features14
Features (large view)1511

Thank you, guys. We appreciate your work and your good intentions!

Footnotes Link

  1. 1 http://surgeworks.com
  2. 2 https://www.smashingmagazine.com/wp-content/uploads/uploader/images/facebook-gui-psd-kit/full_preview.png
  3. 3 https://www.smashingmagazine.com/wp-content/uploads/uploader/images/facebook-gui-psd-kit/full_preview.png
  4. 4 https://www.smashingmagazine.com/wp-content/uploads/2010/07/facebook-gui-psd-kit.zip
  5. 5 http://surgeworks.com/blog/design/facebook-gui-free-psd-resource
  6. 6 https://www.smashingmagazine.com/wp-content/uploads/2010/07/Facebook-App-Authorization-Request.png
  7. 7 https://www.smashingmagazine.com/wp-content/uploads/2010/07/Facebook-App-Authorization-Request.png
  8. 8 https://www.smashingmagazine.com/wp-content/uploads/2010/07/Facebook-App-Template.png
  9. 9 https://www.smashingmagazine.com/wp-content/uploads/2010/07/Facebook-App-Template.png
  10. 10 https://www.smashingmagazine.com/wp-content/uploads/2010/07/zoom01.png
  11. 11 https://www.smashingmagazine.com/wp-content/uploads/2010/07/zoom01.png
  12. 12 https://www.smashingmagazine.com/wp-content/uploads/2010/07/zoom02.png
  13. 13 https://www.smashingmagazine.com/wp-content/uploads/2010/07/zoom02.png
  14. 14 https://www.smashingmagazine.com/wp-content/uploads/2010/07/zoom03.png
  15. 15 https://www.smashingmagazine.com/wp-content/uploads/2010/07/zoom01.png

↑ Back to top Tweet itShare on Facebook

Advertisement

Vitaly Friedman loves beautiful content and doesn’t like to give in easily. Vitaly is writer, speaker, author and editor-in-chief of Smashing Magazine. He runs responsive Web design workshops, online workshops and loves solving complex UX, front-end and performance problems in large companies. Get in touch.

  1. 1

    guitarguru102

    July 23, 2010 6:45 am

    That’s pretty awesome! Does it come with free updates? :-P

    -1
  2. 2

    This is great – really useful for anyone creating Facebook Applications!

    0
  3. 4

    Adrian Demian

    July 23, 2010 6:14 am

    useful stuff… thx for the effort :)

    2
  4. 5

    uau thanks for the great kit :) especially now with facebook fan pages and client applications, good for concepts! :)

    2
  5. 6

    Great!
    I’ve been looking for this long time ago.
    Thank you very much, it looks awesome.

    1
  6. 7

    amazing! Thanks a lot!

    1
  7. 8

    Mimojito (aka Efren)

    July 23, 2010 6:42 am

    Excellent! I can now throw out all my PSDs ;)

    -2
  8. 9

    Sudarshan Gurung

    July 23, 2010 6:46 am

    Great stuff. Thanks.

    1
  9. 10

    Awesome! This is one of the reasons I visit smashingmagazine each and every day… :)

    -2
  10. 11

    wow just when need them ! thnx a lot

    -2
  11. 12

    Nice! The examples contain several typos though – I’m assuming I can edit those out?

    1
  12. 17

    lol I can’t believe the timing of this.

    I just spent 4 days doing just this to make a FB themed Powerpoint for the office Town Hall/year in review brief. Did it all in PS from scratch..used a few screen captures, mimic the fonts and everything, creating profile pages for each division etc etc.

    I’m just amazed this came out 2 days after the meeting was held.

    Ah well, it’s still a great download so thanks :)

    1
  13. 18

    It would be really great if there were a Fireworks version too!

    -4
  14. 20

    Tomislav Bilic

    July 23, 2010 7:58 am

    Woohoo… Congratulations Ney & Renato for being featured on Smashing Magazine. :)

    0
  15. 21

    Just what I needed! Thanks for the post – Hope to see updates since Facebook makes changes to their UI quite often! :D

    0
  16. 22

    Thanks!

    -1
  17. 23

    Gerd Wippich

    July 23, 2010 8:01 am

    Cool stuff. Thanx a lot!

    0
  18. 24

    great! thx!

    0
  19. 25

    Morris Clay

    July 23, 2010 8:38 am

    Thanks, for the great job! Really useful :)

    0
  20. 26

    FeryKloucek

    July 23, 2010 9:10 am

    Thanks for great and very useful package! Super..as usual on smashing magazine :)

    0

↑ Back to top