Jonathan Hau demonstrates InVision's Asset Library for Sketch, which lets teams store unlimited design elements in shared folders on Dropbox or Google Drive. When someone updates an asset, all collaborators get instant notifications and can sync their files. InVision also auto-generates a style guide that updates colors and fonts across all linked artboards in real time.
Chapters
Library— this is amazing. OK. Think about this. Every single time a designer makes a change— let's say you have a team of 5 designers. Slack— oh, where's that asset? Oh, let me upload it. OK, here. Here, let me— so upload to Slack. Then they have to download from Slack. And then all of those assets now can be stored inside a library. And the cool thing about library is it shares all of your assets, unlimited assets, any element from within your Sketch file into this asset library. You can create categories within, and you can customize those categories so that you have different sections within your library. And you can also create multiple libraries. So let's say you have one project that you have a whole bunch of, like 100 assets. that all of your designers should be referencing, you create one library for that, everybody references that library, and it can be on a Dropbox account so that everybody shares the same library. And any time a change is made to that library, that asset instantly gets pushed as a notification to everybody. They'll get an instant notification inside Sketch that says, you have a new change in your library. Do you want to sync? You hit yes, boom, it syncs. All of your assets are updated. And then if you have a template that you've created out of this, InVision will make it so that it goes across all of your assets in your design.
But the Sketch file should be saved with teams, like a Dropbox?
Not the Sketch file, your library. So you can create a library folder. That InVision generates for you. And that library folder is a separate folder set of files that will include all of your assets. And you can save that in any location that you want. It could be on Google Drive, whatever. Save that, and everybody can access that. They can all sync to the same set of assets.
OK.
Now, one quick note about that is InVision will generate— separately from this, a style guide linked to your artboards. So you'll notice here that I've generated a style guide associated with all these artboards here. I'm gonna, I'm gonna go ahead and uncheck this and zoom out here so you can see all my artboards. Okay, now if I click the separate page, InVision has generated this style guide automatically for you, right? It's taken all the hex values that are the most popular hex values and made a color palette. It's taken all of my fonts from this file and placed them here available so I can see each of the different fonts. And it shows all my text styles as well. Now, the cool thing about this template is it's linked to all of your artboards. So if I were to go back in here and change this orange color— I'm going to do this live to see if this works. I'm going to change this to, let's say, red. OK? I'm going to go and sync that style guide to my app. And now if I go back here, all of my artboards are red.
So you can do that even in—
Impress?
OK, no.
All right, OK, all right. All right, OK, so that's— So does this work the same in Photoshop as well? So this feature is not available in Photoshop. We only have certain limited things in Photoshop. The reason why we don't have this available in Photoshop is because Adobe has their own proprietary version of a shared asset library. So we don't allow you to do this in Photoshop because they restrict us from it.
