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.
- large preview3 (.png, 0.72 Mb)
- download the .zip-package4 (zip, 6.5 Mb)
- alternative download link (zip, 5.1 Mb)
- release on the developer’s page5
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.
Thank you, guys. We appreciate your work and your good intentions!
You may want to take a look at the following related posts:
- Designing A Facebook Fan Page: Showcases, Tutorials, Resources16
- How To Integrate Facebook With WordPress17
- How To Integrate Facebook, Twitter And Google+ In WordPress18
- 1 http://surgeworks.com
- 2 https://www.smashingmagazine.com/wp-content/uploads/uploader/images/facebook-gui-psd-kit/full_preview.png
- 3 https://www.smashingmagazine.com/wp-content/uploads/uploader/images/facebook-gui-psd-kit/full_preview.png
- 4 https://www.smashingmagazine.com/wp-content/uploads/2010/07/facebook-gui-psd-kit.zip
- 5 http://surgeworks.com/blog/design/facebook-gui-free-psd-resource
- 6 https://www.smashingmagazine.com/wp-content/uploads/2010/07/Facebook-App-Authorization-Request.png
- 7 https://www.smashingmagazine.com/wp-content/uploads/2010/07/Facebook-App-Authorization-Request.png
- 8 https://www.smashingmagazine.com/wp-content/uploads/2010/07/Facebook-App-Template.png
- 9 https://www.smashingmagazine.com/wp-content/uploads/2010/07/Facebook-App-Template.png
- 10 https://www.smashingmagazine.com/wp-content/uploads/2010/07/zoom01.png
- 11 https://www.smashingmagazine.com/wp-content/uploads/2010/07/zoom01.png
- 12 https://www.smashingmagazine.com/wp-content/uploads/2010/07/zoom02.png
- 13 https://www.smashingmagazine.com/wp-content/uploads/2010/07/zoom02.png
- 14 https://www.smashingmagazine.com/wp-content/uploads/2010/07/zoom03.png
- 15 https://www.smashingmagazine.com/wp-content/uploads/2010/07/zoom01.png
- 16 https://www.smashingmagazine.com/2010/07/designing-a-facebook-fan-page-showcases-tutorials-resources/
- 17 https://www.smashingmagazine.com/2009/09/how-to-integrate-facebook-with-wordpress/
- 18 https://www.smashingmagazine.com/2012/01/facebook-twitter-google-wordpress/