Easy-to-follow video tutorials help you learn software, creative, and business skills.Become a member
Working with Adobe Swatch Exchange files means you can better maintain color consistency across designs for a specific project. Now, an example I've got here: it's just a starting point. It's basically a whole series of vector shapes, and they're all yellow. We need to do something with this. It's going to be a background color concept for a micro Web site. Now, one of our designers has already put together a style guide. So we're going to take a quick look at that inside of Adobe Illustrator. So you can see here we've got several different colors to work with, and they've all got hex values apply to them and so on.
What I want to do is I want to take this style guide and without having to literally open up the entire file in Fireworks and start sampling colors, I want actually work with the colors that exist in this design. Now, if I take a look in the Swatch panel in Illustrator, you'll see that I have a whole series of swatches, and these are all based on the color samples that we see inside of our design. So what I want to do is create a Swatch Exchange file that I can share with Fireworks, or Illustrator, or Photoshop, for that matter. And in order to do this, I just need to click on my Options in Illustrator and choose Save Swatch Library as ASE.
By default, I will be taken to the Swatch's Library. I actually want to place this on my Exercise folder. And I'm going to name this micro_ site_colors, and I'll click save. I will get a warning from Illustrator. You can put a whole bunch of different types of things in a Swatch file in Illustrator: Gradients, Patterns and so on. So you get a warning message saying that you have those things in the Swatch file, they may not be supported in other applications. So we will just click OK. Now, bringing these Swatch files into Fireworks is actually really easy. We'll go to our Swatches panel, and we have the defaults set of color cubes that are showing up here.
What I want to do is replace these color cubes with that Swatch file. So I'm going to go to my Swatch Options and choose Replace Swatches, and there we go, micro_site_colors and open that up, and you'll see 13 different colors that were in the original swatch file in Illustrator and now brought across into Fireworks. And now it's just a matter of me working with these to mock up my color concept design here. So I am going to use my Pointer tool. I'm going to start selecting each of my vectors. I'm going to work with the light blue up top.
Select my next vector. Go with a darker blue. Select my next vector. Go with a pale yellow. I scroll down a little bit here, select my next one. Go with a lighter brown, and then we'll finish it off with a darker brown. And now, I've basically whipped together my color concept for this abstract background for the micro_site_colors, working with the colors that I know we need to work with for that specific client.
Get unlimited access to all courses for just $25/month.Become a member