While Adobe
Photoshop is a powerful, creative
platform, using plugins can help to extend its capabilities and use it to its
full potential. Using an add-on can help you perform tedious or difficult tasks
in a more efficient manner, enabling you to spend more time on design.
There are
thousands of plugins to choose from, but many are outdated and no longer work
with updated versions of Photoshop. We've collected the best free plugins you
can download, install and start using right away.
1.Social Kit
Social Kit provides
customizable templates for four of the biggest social networks -- Facebook,
Google+, Twitter and YouTube -- along with a variety of social buttons. Each
template is fully sliced and customizable, and the plugin automatically updates
when there's a minor change to the social sites' designs You can see your
design changes in real time, and you can add contributors to projects to help
improve it.
2.Layrs Control
Layrs Control is a free
plugin that houses a collection of scripts to make the more mundane tasks in
Photoshop. It provides five main features, including a layer name editor and
options to remove any unused effects, flatten all layer effects, delete empty
layers to cut down the file size, and rasterize smart objects.
3.Cut&Slice Me
Cut&Slice lets you export your assets
to different devices in seconds, and it improves your workflow by naming your
layers. You can cut and export files in PNG format, trimming extraneous pixels
or specifying you size you require. Cut&Slice also exports your button
states.
Exported
files have unsupported characters in the file name removed, with support for
.xxdpi, .Idpi, .mdpi and .hdpi. While Photoshop hasn't changed the way it
exports for the web for years, Cut&Slice offers new capabilities, allowing
you to create overlapping slices and exporting only what you need with maximum
detail.
4.CSS3Ps
CSS3Ps is a free cloud-based Photoshop
plugin that converts your layers to CSS3. Since it's based in the cloud, the
updates and bug-fixes are transparent, so there's no need to update the plugin
to use new features. It's easy to use -- just select your layers and click the
CSS3Ps button, and it directs you to the CSS3Ps webpage where the output is
generated.
The
plugin features support for vendor prefixes for cross-browser compatibility,
SASS and SCSS support, border radius, stroke, gradient overlay, drop shadow,
outer glow, and inner glow. You can select multiple layers and groups of layers
at once and convert them with one click, with additional support for blending
modes, bevel and emboss. It's worth noting that in order for the plugin to convert
appropriately, you need to use the correct Photoshop effects.
5.BlendMe.In
BlendMe.in is a plugin for both Photoshop
and Illustrator that lets you search thousands of assets (including popular
icon packs) that you can simply drag and drop into you canvas and continue
work. All the icons are vector format, so they're inserted as smart objects and
are infinitely scalable.
The
assets are provided under the Creative Commons Attribution license, so you can
use them in your personal and commercial projects. If you wish to have your
collection of icons or assets considered, simply email the developer. All you
need to do is install it via the extensions manager and you're ready to start.
The
interface sits within the Photoshop panel, so it's unobtrusive and makes it
easy to drag assets onto your canvas.
6.Renderly
Renderly will automatically exports
screens, assets and detailed design specs, and with its smart technology, only
those elements that have changed are exported. All you need to do is use a
proper prefix and Render.ly will do the rest.
To
keep your icons as vectors, simply add a prefix of "ico." For
buttons, name a group with "btn" and create a state (e.g., add
":hover") at the end of the name inside that group. To export images,
add "img" as a prefix and the image will be exported as a raster
graphic. Inside your group, each variant must have a "+" in front of
the layer name, and Renderly will automatically export as many screens or
variants as you require. Each top level group is treated as a separate screen,
so you can design your entire app or website in one PSD file.
Renderly
is currently in private beta, but it's accepting new designers -- simply sign
up for a chance to preview it.
7.Guide Guide
Dealing with multiple guides in Photoshop
can be a pain, but using GuideGuide makes it easy to have pixel-accurate
columns, rows, midpoints and baselines based on your document or selection.
Your frequently used guide sets can be used for future use, with the ability to
use multiple types of measurements.
The
plugin works with Photoshop CS5, CS6 and CC and is simple to install. You can
also use the plugin to measure exactly how wide a navigation element should be
to fit evenly across the width of a site, as well as creating baseline grids
and element padding.
8.Composer
Composer lets you update multiple layer comps
in Photoshop with a single click, meaning less maintenance and more designing.
It works on Photoshop CS5 or higher.
Select
any layers or groups to which want to apply changes and use one of the four
commands to update the selected layers: Update Layer Style, Update Position,
Update Visibility and Update All. The plugin sits inside the Photoshop panel
for easy access.
9.WebFont
The Web Font plugin lets you design with
your desired website fonts from within Photoshop, with access to thousands of
web fonts from prestigious foundries. It works in combination with professional
font manager Suitcase Fusion 5 and web font service WebINK.
You
can preview any font while you're working on a design, without having to
download and install individual fonts to use in Photoshop. If you've chosen a
font from WebINK, you only pay for the fonts that you use in your final site.
It's important to note, however, that you can't use fonts purchased from WebINK
for derivative work -- only as part of the website design process. When new fonts
are added, they're available automatically.
10.Flaticon
Flaticon is a free project, created for
and by designers and developers. It's home to one of the largest databases of
free vector icons, available to download in SVG, PSD or PNG formats. You can
also convert icons into web fonts, with all the icons on Flaticon completely
scalable and editable, and accessible to any screen reader.
You
have instant access to more than 31,000 icons. The database always stays
synchronized so you never have to worry about manually updating the icon
collection. The plugin has support for Photoshop CS5, CS6 and CC, and it's
compatible with both Windows and Mac OS X.
11.Breeezy
Breeezy is a free plugin that adds
multilayer export functionality to Photoshop. This makes it quick and easy to
prepare graphics for app development or websites. It features the ability to
save a layer's transparency when exporting, pass layer names to files, and
organize all exported files and assets in one folder.
It
works with Photoshop CS5 and higher on both Windows and Mac OS X.
12.Save Panel
Save Panel is a Photoshop plugin that
optimizes file saving, meaning that you can configure the buttons to save
documents with your favorite settings. It features the ability to customize the
destination folder (either absolute or relative), image dimensions, file type
and filename. Using the Save Panel with a service such as Dropbox lets you
effectively share images with other people directly from Photoshop.
It's
easy to configure, with no limitations on how many buttons you can create and
customize. To set up, simply save presets created in the options dialog -- each
preset will then be represented with a button on the panel, giving you quick
access to your favorite settings.
