Start learning with our library of video tutorials taught by experts. Get started
Viewers: in countries Watching now:
This course reveals how designers can create vibrant web graphics, wireframes, and complete web site mockups with the strong layout and color management tools in Adobe Illustrator. Author and Adobe Certified Expert Justin Seeley covers topics such as building responsive layouts with artboards, producing custom color palettes and swatches for web graphics, and making vector shapes and text that seamlessly scale. The course also explores adding drop shadows and other live effects, setting up interface elements such as forms and tabbed interfaces, optimizing and exporting different types of graphics, and speeding up your workflow with reusable image sprites and Smart Objects.
Many times you'll start a project in one application, like Illustrator or Photoshop, but then finish it off in another application. And so in order to do that and maintain a consistent look and feel for your project, you'll need to be able to share color swatches that you create inside of one application to the other. Now if you go back and watch the color chapter in this course, I explain exactly what a .ase file is-- it stands for Adobe Swatch Exchange--and I also go through how to create your own custom color palette. But in this case I'm just going to load up an Adobe Swatch Exchange file and then show you how that's interchangeable between both Photoshop and Illustrator.
So inside of Illustrator, if I want to load this up, I'll find the Swatches panel, I'll just click the little Library icon, and I'll go down to Other Library, and I'll navigate out to my Desktop/exercise files/Chapter 12/robot_ colors.ase, open that up, and there are my robot colors for this web site mockup that I created here. And you could have just created custom swatches from these as well. Once you have a .ase file saved out of Adobe Illustrator though, you can jump into another program, like Photoshop. And then I'll just create a new blank document; it doesn't matter what the size is. And I'll bring out up my Swatches panel here so you can see it.
And then I'll go right here, I'll choose Load Swatches, find robot_colors.ase, open it up, and those colors load in right there. I actually had them loaded in previously. You can see them right there as well. So if I cut these out real quick, you can see just the ones that I just loaded in right there. And so easily exchanging these swatches between applications ensures that I'm using a consistent color palette for any design that I do, no matter if it's in Photoshop, Illustrator, InDesign, or even Adobe Fireworks.
I can create all this artwork with the same colors, maintain a consistent look and feel throughout, and make sure that when I export this out and send it to the client, everything looks good. It maintains the same quality that they're used to from one application to another. So, take the time to set up your own color swatches. And again if you need to, go back and watch that chapter of this course and then save them out as .ase files, and you can easily exchange them from app to app.
Find answers to the most frequently asked questions about Illustrator for Web Design.
Here are the FAQs that matched your search "":
Sorry, there are no matches for your search ""—to search again, type in another word or phrase and click search.
Access exercise files from a button right under the course name.
Search within course videos and transcripts, and jump right to the results.
Remove icons showing you already watched videos if you want to start over.
Make the video wide, narrow, full-screen, or pop the player out of the page into its own window.
Click on text in the transcript to jump to that spot in the video. As the video plays, the relevant spot in the transcript will be highlighted.