Discover the best Sketch plugins, where and how you can get them, and how to make the most of them.
What is Sketch?
Sketch is a professional design tool for Mac that utilises a fully vector-based workflow. Its simple layout, features and plugins make it a very capable replacement to other design tools like Photoshop. Here at Impression, we use it for creating UI, mobile, web, icon and wireframe design.
What are Sketch plugins?
What you might not know is that there’s a thriving community of people working to extend Sketch’s functionality and features by building custom plugins. These range from custom improvements a developer could build for themselves to speed up things, to much bigger plugins like Zeplin or Craft that could make a significant improvement to how you go about your designs.
If you see any you’d like, find out how to install Sketch plugins here.
1.Plant app
https://plantapp.io/
There’s a lot of apps claiming to add version control to Sketch, but Plant is by far the best. Plant allows you to push your changes to the rest of your team directly from Sketch to a version controlled file on the cloud. To anyone familiar with Git repositories, it is an identical setup, with a push & pull feature to keep you and anyone else with access to the file with the latest updates.
2.Icon font
https://github.com/keremciu/sketch-iconfont
Icon font is a very simple way to add all your favourite icons into your project in one place, simply download and install your favourite icons (Font Awesome, Material IO) and easily insert them into your design with a few clicks. This git repository comes with a guide on how to install all the fonts into your Sketch setup, and also a search feature, if you’re looking for a choice of icons.
3.Lightwire
https://lightwireplugin.com/
If you’re looking to design an app wireframe, this plugin has a collection of popular artboards ready for you to download and use for free! It’s a life saver if you’re looking to prototype an app wireframe quickly.
4.Craft
https://www.invisionapp.com/craft
Craft is a plugin package from Invision which comes with a bunch of features, such as duplicating content, pulling live content from URLs, and of course syncing to Invision prototypes.
5.Content generator
https://github.com/timuric/Content-generator-sketch-plugin
Make your designs more realistic by pulling in randomly generated pictures and text into your mock ups, such as names, user profile pictures and biographies, all in a few clicks.
6.Magic Mirror
http://magicsketch.io/mirror/
If you want to present your mockups in 3D, Magic Mirror can transform your flat design onto a collection of devices to give it that realistic edge.
Check out how easy it is in the one minute video here, if you still need convincing.
7.Find and replace
https://github.com/thierryc/Sketch-Find-And-Replace
Text editors aren’t the only place you need find and replace – it’s useful in Sketch, too. This plugin has lots of advanced options, and it enables you to search for instances of particular words or phrases in the text in selected layers (and everything contained within), then replace it easily.
8.Zeplin
https://zeplin.io/
If you’re looking to bridge to gap between design and development, look no further than Zeplin, a program that turns a Sketch file into something that all developers can work with. If you haven’t already downloaded Zeplin as an app or signed up online (it’s free!) and are working in a team of developers, go and do it!
Zeplin pulls out fonts, line heights, CSS, colours, symbols, images and many more, allowing them to be previewed through their web app. This is essential for presenting your concept to the development team, as everyone can keep track of the look and feel when inevitable changes happen in the development cycle.
9.Overflow
https://overflow.io/
Overflow is a design tool focused on letting you construct elegant user flow diagrams, and works perfectly with Sketch’s in build prototyping tool. When you’ve setup your prototyping in Sketch, Overflow can take it one step further by making a presentable user journey you can share, it’s a great way of understanding how your artboards connect if you start to lose track.
10.React Sketch App, the wildcard
http://airbnb.io/react-sketchapp/
This in my opinion, has huge potential to change a design workflow. The react app built by Airbnb is the most advanced plugin I have seen that taps into the scriptable json platform Sketch sits on, as it compiles components into a Sketch file through code. Once setup, the plugin also provides live updates, so you can input values into the code and see instant changes in your Sketch file!
As of yet, it is tailored towards Airbnb’s approach and design system, but I wouldn’t be surprised if this approach to design was implemented more broadly in the near future.
Have any thoughts on the above, or know any cool plugins I am missing? Get in touch…
