Start learning with our library of video tutorials taught by experts. Get started
Viewed by members. in countries. members currently watching.
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.
There may come a time in your creative process where you just hit a roadblock when it comes to developing color. Now, chances are the client is going to be very specific about what type of color they want in their design. But just in case they give you a little creative freedom, you might find it a little difficult to come up with color combinations. And that's okay, because there are several tools out there that will help you develop your own color palettes. My favorite is something called Kuler, and it's available for free by Adobe. So, just go to kuler.adobe.com, and you can sign in using your free Adobe ID.
If you don't have an Adobe ID, you can register, like I said, for free on adobe.com. Once you have your Adobe ID, log in to Kuler, and you can start accessing all of the different things that are available to you on this community site. As I said, Kuler is a community about color. And so you can come here and take a look at all of the different color combinations that other people have created. You can also create your own and share them with other people. You can download color palettes for use in different applications like Photoshop and Illustrator. It's a very powerful tool, and I really think that you should use it.
So, let's say, for instance, that I have a client that came to me and said "I need you to build me a web site for this fall festival that I'm getting ready to put on." I say okay, and we get to the point where we're talking about colors and they don't really have anything in mind, and I don't necessarily have anything in mind. I can bring up Kuler, and I can come right here to the search box, and I can just type in "fall" and hit search. Once I do that, it's going to return several different options available to me with that keyword fall. I can search through them and page through the results just like this until I find something that I want.
Once I find something, like maybe this one here, I can click on it. When I click on it, it shows real big across the top, just like this. I also get some information about it here. I can see that it's got brown, burnt, chocolate, fall, green, all these different keywords associated with it. I can see when it was created. I can see if it has any votes, how many times it's been downloaded, so I can see if it's in play anywhere else. I can also view more info like this, get a direct link to it if I need to. I could copy that and then send it to my client, say hey! What do you think about these colors? I can also use this button here to download the theme as an Adobe Swatch Exchange file or a .ase file. .ase files can be loaded into almost every single Adobe application, so that you can then use those swatches in your designs.
So, for instance, if I were to download this-- and I'll just save it to my desktop--I could then go back into Adobe Illustrator. I will go to File > New and just create a blank document. It doesn't matter what document you create. I'll bring up my Swatches panel and drag it out so you can see it. And I'll go here, and I'll choose Open Swatch Library, and I'll go to Other Library, go to my Desktop, choose Fall Fall.ase, hit Open, and there it is.
It loads right in there for me. I can then use all of these colors in my design if I want to. Pretty simple. If I go back over to Kuler, I can see that I can also create my own swatches. So if I go to Create, it's going to jump me here to an image, but I'm going to say From a Color. So let's say that I have a color--and I'll just mix one really quickly here like that, just mix this kind of purple color. I can then go up here and select different rules, like Analogous, Monochromatic, Triad, Complementary, Compound, Shades, and even Custom as well.
Now, you notice as I hover over these it gives you a little pop-up menu indicating what's going to happen when you do this. So, when I click Shades, it's going to create subtle variations of the base color's hue. So, that's what it looks like. Compound: combine interesting colors from multiple hues. Complementary: oppose two colors on the wheel for a simple theme based on two hues, just like this. Triad: space your colors in a triangle around the wheel, and see it forms that little shape. Monochromatic focuses on one color with varied intensity and lightness in a single hue of a color. And then we have Analogous: Match colors with adjacent hues.
So, for this one, I think that Monochromatic is probably the way I want to go, and so I can go over here, give it a title, just call this My colors, and hit Save. Once I do that, it jumps me over into Mykuler and Themes, and there's My Colors right there. I can then download these which I just created as an ASE file. I will download it to my desktop, and then I can hop right over into Illustrator, again go to the Window menu and bring up my Swatches panel, and I can click here; Open Swatch Library > Other Library, and on my desktop should be My colors. Open it up and there they are.
So, the next time you get stumped creating a color palette for your designs, check out kuler.adobe.com and mix and match your own colors to see what you can come up with.
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.