CloudApp brings screen recording, screenshots, and GIF creation to the cloud, in an easy-to-use enterprise-level app. Just capture, share, and accelerate your workflow.
CloudApp brings screen recording, screenshots, and GIF creation to the cloud, in an easy-to-use enterprise-level app. Just capture, share, and accelerate your workflow.
In April 2018, Pablo Stanley, Lead Product Designer at InVision, delivered a workshop about plugins, add-ons and extensions. He opened our eyes to the best Sketch plugins to achieve beautiful designs in half the time. To make things easy for you, Icompiled a list of histop recommended add-ons and added in a few of my favorites. Watch Pablo in action or browse through this list. Enjoy!
Credits:Cover photo of Sketch icon designed by Dejan Markovic. For more educational videos on Product Design, subscribe to Pablo Stanley’s YouTube channel “Sketch Together“.
Before you do anything:Install Runner
Runner helps you to get around Sketch quicker by giving you an intuitive interface to supercharge your daily workflow. Runner allows you to search for and install Sketch plugins quickly and it notifies you to update a plugin when it is out of date. Run commands directly from your keyboard and save time.
Auto Layout gives you the flexibility to preview your design on ALL screen sizes. Install this plugin to define and view different iPhone/iPad sizes including Portrait/Landscape. You can also get an overview of all screen sizes for all artboards at once.
Keep your layers organized with this handy Sketch plugin. Rename It allows you to batch rename layers and artboards. It also adds numerical or alphabetical sequences.
Create buttons that always maintain their shape. Paddy is a lightweight Sketch plugin that automatically adds padding and spacing to your Sketch layers.
Don’t resize buttons manually. Instead, use Paddy to automatically add spacing, padding and alignment to your Sketch layers.
200 Icons as Symbols
Feather Sketch Library
The Feather Sketch Library is a Sketch file that contains all the icons and symbols with color overrides. Cole Bemis, a Product Designer in San Luis Obispo, CA, designed this popular icon set. Then a company named HelloHello turned them into a Sketch file.
All icons are set in black and white and you can customize and add colors to the template. Download the Feather Sketch Library and start using it in your projects.
Shared Text Styles
Create trust with consistent typography. The Shared Text Styles plugin allows you to import, export, and update text styles throughout different Sketch documents.
Shared Text Styles lets you import and override font styles across Sketch documents, so that you have uniform typography.
Clipboard Fill
Clipboard Fill makes it faster and easier to paste an image into a custom shape. No need for masks! After you install the plugin, take a screenshot, it copies to the clipboard, and then use a shortcut to paste the image directly into a shape.
Wave goodbye to manual masking and install the SketchClipboard Fillplugin.
Symbol Organizer
Organize your symbols page, and layer list, alphabetically and into groupings determined by your symbol names.
The Symbols Organizer pluginprovides the ability to choose the granularity of the groups, layout symbols horizontally or vertically, set a maximum of symbols per row/column, reverse the layer list sort direction, sequentially rename duplicate symbols, gather symbols from other pages, and remove unused symbols.
Create UI specs to share with developers and teammates. With Measure Sketch plugin you can export an automatically generated HTML and CSS file from Sketch. Super handy dandy pandy candy!
Sketch Measure improves collaboration between designers and developers. You can measure all elements on a page and create design specs fast.
Material Icons
The Material Theme Editor helps you make your own branded symbol library and apply global style changes to color, shape, and typography. This plugin gives you baseline themes with predefined components, icons, typography, colors, and more. Once you install, you can customize the theme to your brand. Install the Material Plugin.
Even if you don’t use the pre-designed theme, this plugin demonstrates how to properly setup a Sketch file for UI branding.
The Material Theme Editor is a free plugin to help you get organized and inspired for digital product design success.
Angle 2
With Angle 2, you can place your screen into over 500 perspective mockups for apps, websites, and cover images. It is available from Meng To’s Design +Code, an online library of classes and resources to 1-up your product design game. You can try the plugin for free with 50 devices and mockups, then upgrade for more.
Angle 2 makes it easy for us to present our work with confidence.
???? Plug It In, Plug It In ????
In addition to the sketch plugins above, we put together the 10 best photoshop plugins for 2021. Also below are more useful plugins not mentioned in Pablo’s presentation.
SF UI Font Fixer
When you preview text on Sketch, often the character spacing is not a clear representation of what it would be on an iOS device. Sketch SF UI Font Fixer automatically corrects this, thanks Kyle Hickinson, an iOS Developer and Designer. This plugin automatically adjusts the character spacing on text layers using iOS 9’s SF UI Text/Display fonts to what it would be when used in the app.
Download SF UI Font Fixer to automatically visually adjust character spacing when designing for iOS
Sketch Artboard Manager
The Sketch Artboard Manager automatically arranges the position of all artboards in your Sketch document, to snap them to rows & columns. Once you install the plugin, artboards will be automatically arranged in a neat and orderly way. If you want to manually adjust artboards, go to the menu and select Artboard Manager › Arrange Artboards.
Timeline is a simple and powerful Sketch plugin that enables you to easily create beautiful timeline animations for your websites, mobile apps, newsletters, banners and more. Add states and interactions to your design. Communicate motion and animation to developers. Collaborating with engineers just got easier!
That’s it for now. Which Sketch plugins do you use the most? Let me know in the comments below!
About the Author:Andi Galpern
Andi Galpern UX +Design Education CloudApp
Andi Galpern a UX Content Strategist and Design Educator at CloudApp. She teaches best practices for product design, builds community, and works across the Marketing & Product Team.
Andi is also the Founder and Producer of Cascade SF, an experience design for technology organization in the Bay Area. Her events provide a go-to space for product designers to learn new skills, connect with industry leaders, mentor, and stay ahead of technology. Everyone works together toward a more fulfilling career.
Since 2011, Andi has organized hundreds of design and technology events to bring communities together. She coaches designers to create presentations, write blog posts, and become leaders. Follow Andi on Twitter @andigalpern.
✨ I used CloudApp to createanimated gifs and screenshots for this article. TryCloudApp– It’s FREE. ✨
We use cookies on our website to give you the most relevant experience by remembering your preferences and repeat visits. By clicking “Accept”, you consent to the use of ALL the cookies.
This website uses cookies to improve your experience while you navigate through the website. Out of these, the cookies that are categorized as necessary are stored on your browser as they are essential for the working of basic functionalities of the website. We also use third-party cookies that help us analyze and understand how you use this website. These cookies will be stored in your browser only with your consent. You also have the option to opt-out of these cookies. But opting out of some of these cookies may affect your browsing experience.
Necessary cookies are absolutely essential for the website to function properly. These cookies ensure basic functionalities and security features of the website, anonymously.
Cookie
Duration
Description
cookielawinfo-checkbox-analytics
11 months
This cookie is set by GDPR Cookie Consent plugin. The cookie is used to store the user consent for the cookies in the category "Analytics".
cookielawinfo-checkbox-functional
11 months
The cookie is set by GDPR cookie consent to record the user consent for the cookies in the category "Functional".
cookielawinfo-checkbox-necessary
11 months
This cookie is set by GDPR Cookie Consent plugin. The cookies is used to store the user consent for the cookies in the category "Necessary".
cookielawinfo-checkbox-others
11 months
This cookie is set by GDPR Cookie Consent plugin. The cookie is used to store the user consent for the cookies in the category "Other.
cookielawinfo-checkbox-performance
11 months
This cookie is set by GDPR Cookie Consent plugin. The cookie is used to store the user consent for the cookies in the category "Performance".
viewed_cookie_policy
11 months
The cookie is set by the GDPR Cookie Consent plugin and is used to store whether or not user has consented to the use of cookies. It does not store any personal data.
Functional cookies help to perform certain functionalities like sharing the content of the website on social media platforms, collect feedbacks, and other third-party features.
Performance cookies are used to understand and analyze the key performance indexes of the website which helps in delivering a better user experience for the visitors.
Analytical cookies are used to understand how visitors interact with the website. These cookies help provide information on metrics the number of visitors, bounce rate, traffic source, etc.
Advertisement cookies are used to provide visitors with relevant ads and marketing campaigns. These cookies track visitors across websites and collect information to provide customized ads.
