In this tutorial you’ll learn all about a brand new Sketch feature called “libraries”. Libraries were recently introduced, in version 47, and really enhance the way we work with assets and other team members.
Watch Screencast
Introducing Sketch Libraries
A Sketch library is essential a Sketch file with a bunch of symbols. Where libraries differ, is that the symbols within them become available from within the Sketch app without you needing to open the document they’re stored in. You can import your library assets into any Sketch document you like.
How to Organize Your Sketch Styles and Symbols Like a Pro
Quick Tip: How to Use Sketch’s Updated Symbols
Open up Sketch 47 for the first time and you’ll see straight away that there’s a library available for you to use, under the Insert or the Symbol menu. The “iOS UI Design library” has a wide variety of assets you can place straight onto your artboard.
How to Create Your Own Sketch Library
To demonstrate this I’m going to create a library of color swatches. Firstly, we create a page, then on that page we place a few color swatches (rectangles of whatever colors we want). Using the Create Symbols option we name each one, beginning with color/ in order to group them in the symbols menu.
This particular document is saved permanently in a suitable location, and is already effectively acting as a library of sorts. But now we need to add it to Sketch itself.
Go to Sketch > Preferences > Libraries and click Add Library. Then point to the file we need (our color file in this case) and watch as it becomes available in the list of libraries.
Now, we can access our color symbols from the Symbols menu where we see other libraries listed too.
Updating Symbols and Libraries
Importantly, at this point in the process, there now appears a warning at the bottom of our original colors file:
Any changes we make to the symbols within this file will reflect directly on the library and therefore any other files which make use of the library. If we do choose to make an update, we’ll be warned in other files which make use of the library (see top right of window):
Clicking Library Update Available will open a dialog showing exactly what changes have been made before you commit to using them.
Conclusion
Imagine the power libraries could give you and your design team. Consider the above situation and your own designs’ colors–altering one color swatch in your main branding library and watching it take effect across all your components. And this applies to all kinds of symbols too; typography symbols, icons, styles..brilliant!
Take a look at the screencast above for more details, and stay tuned for further Sketch updates and tricks.
