Fresh Resources for Designers and Developers – December 2012

We are already in December; time seems to be running too fast, right? Much like the previous few months, we are going to feature some useful resources for web designer and developers.

This time we have some cool resources from one that capable of slicing your design in Photoshop to some fresh new jQuery plugins with stunning effects.

Check out all our fresh resources (according to month):

Cut and Slice

Slicing Photoshop for web is a daunting task, particularly when you have a bunch of layers. To make this unavoidable job (for web designers) faster and easier, you can use a tool called Cut and Slice.

It is a free Photoshop plugin that lets you slice your Photoshop layers for web use in seconds. Unfortunately, this plugin it currently only available for Photoshop CS6.


Folding effect with jQuery is nothing new in the web development world. There are many free plugins available to create such visual effects. But with PFold, we are able to unfold and fold the targeted element back like how we do on paper.

We are also able to aim the the fold direction. Have a better look at the demo here.


Pinterest is gaining more popularity and unlike other social media it presents the layout in grid. Now, you can create similar grid layouts with this jQuery plugin called Grid-a-licious. But this plugin does it better. It is now responsive.


CSS3 has a bunch of cool additions such as Transformation and Transition. But, the implementation is rather convoluted. Now, Adem ilter has created Liffect, a tool to add cool (I mean really cool) effects

to <li> elements. There are many cool effects provided, starting from the simple fade-in and fade-out to Star Wars effect.


Makisu is light jQuery plugin to create 3D dropdown effect. As the name implies, the effect looks like Makisu when it is being folded down. Makisu is a mat woven from bamboo and cotton string that is used in food preparation, it’s how you usually roll sushi.

One thing worth noting is since the 3D effect is built upon CSS 3D Transformation, the effect can only be viewed in very modern browsers. See the demo here.

Interface Sketches

If we build websites or webapps, we might frequently need to sketch the ideas on paper before we work on the codes. To do that job, you can use special templates from Interface Sketches.

It provides sketch templates for various devices and screen: Desktop, iPad, iPhone, Nexus and Windows Phone.

Web Platform

A few big tech corporationslike Adobe, Facebook, Google and W3C teamed up and found to make the Web a better place.

Web Platform contains comprehensive web documentation for HTML, CSS, JavaScript and other web technologies. It also has a Q&A section, where you can ask for solutions form the community.

jQuery Countdown

jQuery Countdown is a jQuery plugin for creating those cool flip clock effects. You can set it for the day, hour, minute and even second. This plugin is perfect to creating things like a Coming Soon Page or Product page with limited time offer. You can see the demo here.

So Fresh

All this time, every time we change the CSS, we need to refresh the browser to see the effect. Using So Fresh, you no longer need to do that.

You can select which CSS file you are editing, and So Fresh will automatically refresh the browser whenever the changes are made.

Tiny PNG

Every bit counts and speed matters. One of the way to make our website load faster is by optimizing the image file size. As we already knew, smaller size tend to load faster. If you have some PNG images on your website, you can use Tiny PNG to make their size smaller.