Created with Adobe Firefly
Adobe Illustrator
For a student of Design, perhaps no software is more important than Adobe Illustrator. Artwork created with this program can be used in video, print, animation and, more recently, even 3D modeling. We'll get started with something simple, then see how far each of you can take your designs!
Step 1
As we always do when starting off, make a new folder in OneDrive where all the project files are stored.
This time the name of the folder is:
231106 Vector Graphics Project Folder
Follow these steps to get started with our first practice design:
Open Adobe Illustrator
Choose "New File", click on the "Web" tab and select the Web-Large preset. It's 1920 x 1080, so everything we make will be easily compatible with the video resolution we are already familiar with.
Copy the text below and name your file under Preset Details in the upper right hand corner:
231106 Sample Graphic - Firstname LastnameAs soon as you click "Create" in the bottom right and the document opens up, use the menu option "File --> Save As" and save your blank document to your new project folder!
NOTE: When you first save a file in an Adobe program, it will ask if you want to save in the Adobe Cloud or on the computer. Don't use the Adobe Cloud - we already OneDrive; it is more reliable on NEISD computers.
Screenshot showing the creation of a new Illustrator file
"Save on Computer" and click "Don't Show Again"
Step 2
As with all Adobe programs, Workspaces arrange what's on the screen differently according to what you are trying to do. Switch to the "Essentials Classic" Workspace or it is going to be very hard find the tools we'll be using first. Alas, Adobe has added as new button shortcut in the upper right hand corner to quickly switch and reset Workspaces. I'll still sing my infamous song for you if you need it though!
What's so special about Illustrator?
Working with Vector graphics is very different from Bitmap graphics. Instead of manipulating a fixed quantity of pixels (like Photoshop does), Adobe Illustrator uses what are essentially math formulas to draw lines, curves, shapes and gradients that are perfectly formed no matter how large or small you want them to be. You can "rasterize" an Illustrator image and turn it into as many pixels as you like, but keep in mind, it is a one. way. trip.
Please Just Watch
This overview video from my "classic collection" is just as relevant today as when I made it several years ago. Photoshop and Illustrator may look similar on the surface, but they work in fundamentally different ways. It's important to begin to understand the power that vector graphics give a designer.
Step 3
Strokes
The term "Stroke" means some special in Illustrator - it is the actual line or curves between anchor points. The thickness of the stroke is known as its "Weight" and is generally measured in "Points". A straight line has two anchors, whereas a curved path can have several anchors that define the shapes of the curves.
Drawing Lines
After saving your blank "Web-Large" formatted file to your computer (we are using OneDrive, so always use the "Save to Computer" option) we'll draw some lines in a specific way and change their width, but not just by making them thicker along their whole path. This video starts at two and a half minutes in because we use OneDrive now.
Step 4
Drawing Circles
Using the Shape tool lets us create all manner of shapes without having to draw them manually. Holding down modifier keys like Shift and Alt make this tool more powerful. Two things to make sure of: 1) Are you drawing on the correct layer? 2) Is any part of your design currently selected?
Filling with Gradient Colors
Fill is the color inside the path defined by its anchor points. Careful control over gradient fills is one of the skills you have to practice that propels your artwork into the "WOW!" zone. Without them, designs have a flat appearance that isn't nearly as appealing, especially when animating your art.
Step 5
Export a Bitmap (JPG)
Once a design is complete, it need to be "rasterized" - converted to a standard format for use in other programs like Photoshop or Google Sites. You can't display an Illustrator file on your portfolio without doing this - we are exporting a JPG at High
Follow the export settings instructions carefully so you have a JPG that is 8000 x4500 pixels. "Use Artboard" trims off anything that went off the edges (the ends of the lines in this case). Choosing JPG gives you some additional options affecting the quality and resolution of the final image.
Snipping Your Evidence
Take a snip the specific way shown in the above video as well, so you can show you were able to follow all the instructions for this practice project. It will have the file name, the Layers panel and a slice of the design showing
Learn More
Adobe In-App Tutorials
Don't wait for me to make a video tutorial - Adobe has a number of step-by-step ones that can even show you exactly where a tool or option is located if you ask it nicely. Make this birdhouse using basic shape tools.